@skyux/indicators 6.18.0 → 6.20.0

package/documentation.json

@@ -32,9 +32,14 @@
     "SkyIconVariantType": "type-alias-skyiconvarianttype",
     "SkyIndicatorDescriptionType": "type-alias-skyindicatordescriptiontype",
     "SkyIndicatorIconType": "type-alias-skyindicatoricontype",
+    "SkyKeyInfoLayoutType": "type-alias-skykeyinfolayouttype",
     "SkyLabelType": "type-alias-skylabeltype",
     "SkyAlertHarness": "class-skyalertharness",
-    "SkyAlertHarnessFilters": "interface-skyalertharnessfilters"
+    "SkyKeyInfoHarness": "class-skykeyinfoharness",
+    "SkyLabelHarness": "class-skylabelharness",
+    "SkyAlertHarnessFilters": "interface-skyalertharnessfilters",
+    "SkyKeyInfoHarnessFilters": "interface-skykeyinfoharnessfilters",
+    "SkyLabelHarnessFilters": "interface-skylabelharnessfilters"
   },
   "typedoc": {
     "id": 0,
@@ -44,14 +49,14 @@
     "originalName": "",
     "children": [
       {
-        "id": 376,
+        "id": 385,
         "name": "SkyTokensMessageType",
         "kind": 8,
         "kindString": "Enumeration",
         "flags": {},
         "children": [
           {
-            "id": 378,
+            "id": 387,
             "name": "FocusActiveToken",
             "kind": 16,
             "kindString": "Enumeration member",
@@ -69,7 +74,7 @@
             "defaultValue": "1"
           },
           {
-            "id": 377,
+            "id": 386,
             "name": "FocusLastToken",
             "kind": 16,
             "kindString": "Enumeration member",
@@ -87,7 +92,7 @@
             "defaultValue": "0"
           },
           {
-            "id": 380,
+            "id": 389,
             "name": "FocusNextToken",
             "kind": 16,
             "kindString": "Enumeration member",
@@ -105,7 +110,7 @@
             "defaultValue": "3"
           },
           {
-            "id": 379,
+            "id": 388,
             "name": "FocusPreviousToken",
             "kind": 16,
             "kindString": "Enumeration member",
@@ -123,7 +128,7 @@
             "defaultValue": "2"
           },
           {
-            "id": 381,
+            "id": 390,
             "name": "RemoveActiveToken",
             "kind": 16,
             "kindString": "Enumeration member",
@@ -146,11 +151,11 @@
             "title": "Enumeration members",
             "kind": 16,
             "children": [
-              378,
-              377,
-              380,
-              379,
-              381
+              387,
+              386,
+              389,
+              388,
+              390
             ]
           }
         ],
@@ -163,7 +168,7 @@
         ]
       },
       {
-        "id": 332,
+        "id": 340,
         "name": "SkyAlertModule",
         "kind": 128,
         "kindString": "Class",
@@ -188,7 +193,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              333
+              341
             ]
           }
         ],
@@ -201,7 +206,7 @@
         ]
       },
       {
-        "id": 335,
+        "id": 343,
         "name": "SkyChevronModule",
         "kind": 128,
         "kindString": "Class",
@@ -226,7 +231,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              336
+              344
             ]
           }
         ],
@@ -239,7 +244,7 @@
         ]
       },
       {
-        "id": 338,
+        "id": 346,
         "name": "SkyExpansionIndicatorModule",
         "kind": 128,
         "kindString": "Class",
@@ -264,7 +269,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              339
+              347
             ]
           }
         ],
@@ -277,7 +282,7 @@
         ]
       },
       {
-        "id": 341,
+        "id": 349,
         "name": "SkyHelpInlineModule",
         "kind": 128,
         "kindString": "Class",
@@ -302,7 +307,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              342
+              350
             ]
           }
         ],
@@ -315,7 +320,7 @@
         ]
       },
       {
-        "id": 347,
+        "id": 355,
         "name": "SkyIconModule",
         "kind": 128,
         "kindString": "Class",
@@ -340,7 +345,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              348
+              356
             ]
           }
         ],
@@ -353,7 +358,7 @@
         ]
       },
       {
-        "id": 352,
+        "id": 361,
         "name": "SkyKeyInfoModule",
         "kind": 128,
         "kindString": "Class",
@@ -378,7 +383,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              353
+              362
             ]
           }
         ],
@@ -391,7 +396,7 @@
         ]
       },
       {
-        "id": 356,
+        "id": 365,
         "name": "SkyLabelModule",
         "kind": 128,
         "kindString": "Class",
@@ -416,7 +421,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              357
+              366
             ]
           }
         ],
@@ -429,7 +434,7 @@
         ]
       },
       {
-        "id": 361,
+        "id": 370,
         "name": "SkyStatusIndicatorModule",
         "kind": 128,
         "kindString": "Class",
@@ -454,7 +459,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              362
+              371
             ]
           }
         ],
@@ -467,7 +472,7 @@
         ]
       },
       {
-        "id": 364,
+        "id": 373,
         "name": "SkyTextHighlightModule",
         "kind": 128,
         "kindString": "Class",
@@ -492,7 +497,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              365
+              374
             ]
           }
         ],
@@ -505,7 +510,7 @@
         ]
       },
       {
-        "id": 367,
+        "id": 376,
         "name": "SkyTokensModule",
         "kind": 128,
         "kindString": "Class",
@@ -530,7 +535,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              368
+              377
             ]
           }
         ],
@@ -543,7 +548,7 @@
         ]
       },
       {
-        "id": 382,
+        "id": 391,
         "name": "SkyWaitModule",
         "kind": 128,
         "kindString": "Class",
@@ -568,7 +573,7 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              383
+              392
             ]
           }
         ],
@@ -581,7 +586,7 @@
         ]
       },
       {
-        "id": 385,
+        "id": 394,
         "name": "SkyWaitService",
         "kind": 128,
         "kindString": "Class",
@@ -602,7 +607,7 @@
         ],
         "children": [
           {
-            "id": 389,
+            "id": 395,
             "name": "constructor",
             "kind": 512,
             "kindString": "Constructor",
@@ -610,20 +615,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 25,
+                "line": 30,
                 "character": 2
               }
             ],
             "signatures": [
               {
-                "id": 390,
+                "id": 396,
                 "name": "new SkyWaitService",
                 "kind": 16384,
                 "kindString": "Constructor signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 391,
+                    "id": 397,
                     "name": "resolver",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -636,7 +641,7 @@
                     }
                   },
                   {
-                    "id": 392,
+                    "id": 398,
                     "name": "appRef",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -649,7 +654,7 @@
                     }
                   },
                   {
-                    "id": 393,
+                    "id": 399,
                     "name": "waitAdapter",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -660,7 +665,7 @@
                     }
                   },
                   {
-                    "id": 394,
+                    "id": 400,
                     "name": "windowSvc",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -673,14 +678,14 @@
                 ],
                 "type": {
                   "type": "reference",
-                  "id": 385,
+                  "id": 394,
                   "name": "SkyWaitService"
                 }
               }
             ]
           },
           {
-            "id": 395,
+            "id": 405,
             "name": "beginBlockingPageWait",
             "kind": 2048,
             "kindString": "Method",
@@ -690,13 +695,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 35,
+                "line": 45,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 396,
+                "id": 406,
                 "name": "beginBlockingPageWait",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -712,7 +717,7 @@
             ]
           },
           {
-            "id": 397,
+            "id": 407,
             "name": "beginNonBlockingPageWait",
             "kind": 2048,
             "kindString": "Method",
@@ -722,13 +727,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 42,
+                "line": 52,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 398,
+                "id": 408,
                 "name": "beginNonBlockingPageWait",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -744,7 +749,7 @@
             ]
           },
           {
-            "id": 407,
+            "id": 417,
             "name": "blockingWrap",
             "kind": 2048,
             "kindString": "Method",
@@ -754,13 +759,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 85,
+                "line": 95,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 408,
+                "id": 418,
                 "name": "blockingWrap",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -770,7 +775,7 @@
                 },
                 "typeParameter": [
                   {
-                    "id": 409,
+                    "id": 419,
                     "name": "T",
                     "kind": 131072,
                     "kindString": "Type parameter",
@@ -779,7 +784,7 @@
                 ],
                 "parameters": [
                   {
-                    "id": 410,
+                    "id": 420,
                     "name": "observable",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -789,7 +794,7 @@
                       "typeArguments": [
                         {
                           "type": "reference",
-                          "id": 409,
+                          "id": 419,
                           "name": "T"
                         }
                       ],
@@ -804,7 +809,7 @@
                   "typeArguments": [
                     {
                       "type": "reference",
-                      "id": 409,
+                      "id": 419,
                       "name": "T"
                     }
                   ],
@@ -816,7 +821,7 @@
             ]
           },
           {
-            "id": 403,
+            "id": 413,
             "name": "clearAllPageWaits",
             "kind": 2048,
             "kindString": "Method",
@@ -826,13 +831,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 65,
+                "line": 75,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 404,
+                "id": 414,
                 "name": "clearAllPageWaits",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -848,7 +853,7 @@
             ]
           },
           {
-            "id": 399,
+            "id": 409,
             "name": "endBlockingPageWait",
             "kind": 2048,
             "kindString": "Method",
@@ -858,13 +863,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 50,
+                "line": 60,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 400,
+                "id": 410,
                 "name": "endBlockingPageWait",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -880,7 +885,7 @@
             ]
           },
           {
-            "id": 401,
+            "id": 411,
             "name": "endNonBlockingPageWait",
             "kind": 2048,
             "kindString": "Method",
@@ -890,13 +895,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 58,
+                "line": 68,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 402,
+                "id": 412,
                 "name": "endNonBlockingPageWait",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -912,7 +917,7 @@
             ]
           },
           {
-            "id": 411,
+            "id": 421,
             "name": "nonBlockingWrap",
             "kind": 2048,
             "kindString": "Method",
@@ -922,13 +927,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-                "line": 96,
+                "line": 106,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 412,
+                "id": 422,
                 "name": "nonBlockingWrap",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -938,7 +943,7 @@
                 },
                 "typeParameter": [
                   {
-                    "id": 413,
+                    "id": 423,
                     "name": "T",
                     "kind": 131072,
                     "kindString": "Type parameter",
@@ -947,7 +952,7 @@
                 ],
                 "parameters": [
                   {
-                    "id": 414,
+                    "id": 424,
                     "name": "observable",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -957,7 +962,7 @@
                       "typeArguments": [
                         {
                           "type": "reference",
-                          "id": 413,
+                          "id": 423,
                           "name": "T"
                         }
                       ],
@@ -972,7 +977,7 @@
                   "typeArguments": [
                     {
                       "type": "reference",
-                      "id": 413,
+                      "id": 423,
                       "name": "T"
                     }
                   ],
@@ -989,27 +994,27 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              389
+              395
             ]
           },
           {
             "title": "Methods",
             "kind": 2048,
             "children": [
-              395,
-              397,
+              405,
               407,
-              403,
-              399,
-              401,
-              411
+              417,
+              413,
+              409,
+              411,
+              421
             ]
           }
         ],
         "sources": [
           {
             "fileName": "projects/indicators/src/modules/wait/wait.service.ts",
-            "line": 20,
+            "line": 24,
             "character": 13
           }
         ]
@@ -1133,7 +1138,7 @@
             ],
             "type": {
               "type": "reference",
-              "id": 360,
+              "id": 369,
               "name": "SkyIndicatorIconType"
             },
             "defaultValue": "ALERT_TYPE_DEFAULT"
@@ -1450,7 +1455,7 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 359,
+                      "id": 368,
                       "name": "SkyIndicatorDescriptionType"
                     }
                   }
@@ -1661,7 +1666,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/status-indicator/status-indicator.component.ts",
-                "line": 88,
+                "line": 86,
                 "character": 2
               }
             ],
@@ -1783,7 +1788,7 @@
             ],
             "type": {
               "type": "reference",
-              "id": 360,
+              "id": 369,
               "name": "SkyIndicatorIconType"
             },
             "defaultValue": "INDICATOR_TYPE_DEFAULT"
@@ -1926,7 +1931,7 @@
                 },
                 "type": {
                   "type": "reference",
-                  "id": 359,
+                  "id": 368,
                   "name": "SkyIndicatorDescriptionType"
                 }
               }
@@ -1956,7 +1961,7 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 359,
+                      "id": 368,
                       "name": "SkyIndicatorDescriptionType"
                     }
                   }
@@ -2020,7 +2025,7 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 360,
+                      "id": 369,
                       "name": "SkyIndicatorIconType"
                     }
                   }
@@ -2043,7 +2048,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/status-indicator/status-indicator.component.ts",
-                "line": 96,
+                "line": 94,
                 "character": 9
               }
             ],
@@ -2485,7 +2490,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 111,
+                "line": 93,
                 "character": 2
               }
             ],
@@ -2518,7 +2523,7 @@
                   },
                   {
                     "id": 179,
-                    "name": "resourcesService",
+                    "name": "resourcesSvc",
                     "kind": 32768,
                     "kindString": "Parameter",
                     "flags": {},
@@ -2537,7 +2542,28 @@
             ]
           },
           {
-            "id": 196,
+            "id": 198,
+            "name": "closeActive",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
+                "line": 83,
+                "character": 9
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "boolean"
+            },
+            "defaultValue": "false"
+          },
+          {
+            "id": 195,
             "name": "dismiss",
             "kind": 1024,
             "kindString": "Property",
@@ -2545,7 +2571,7 @@
               "isPublic": true
             },
             "comment": {
-              "shortText": "Fires when users click the close button or press the `Backspace` key to dismiss the token."
+              "shortText": "Fires when users click the close button."
             },
             "decorators": [
               {
@@ -2562,7 +2588,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 81,
+                "line": 74,
                 "character": 9
               }
             ],
@@ -2580,8 +2606,50 @@
             },
             "defaultValue": "..."
           },
+          {
+            "id": 199,
+            "name": "tabIndex",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
+                "line": 84,
+                "character": 9
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "number"
+            },
+            "defaultValue": "0"
+          },
           {
             "id": 197,
+            "name": "tokenActive",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
+                "line": 82,
+                "character": 9
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "boolean"
+            },
+            "defaultValue": "false"
+          },
+          {
+            "id": 196,
             "name": "tokenFocus",
             "kind": 1024,
             "kindString": "Property",
@@ -2606,7 +2674,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 87,
+                "line": 80,
                 "character": 9
               }
             ],
@@ -2748,7 +2816,7 @@
                   "tags": [
                     {
                       "tag": "default",
-                      "text": "true\n"
+                      "text": "false\n"
                     }
                   ]
                 },
@@ -2770,7 +2838,7 @@
                   "tags": [
                     {
                       "tag": "default",
-                      "text": "true\n"
+                      "text": "false\n"
                     }
                   ]
                 },
@@ -2817,7 +2885,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 55,
+                "line": 52,
                 "character": 13
               }
             ],
@@ -2829,7 +2897,7 @@
                 "kindString": "Get signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Indicates whether users can remove the token from the list by selecting the close button\nor pressing the `Backspace` key.",
+                  "shortText": "Indicates whether users can remove the token from the list by selecting the close button.",
                   "tags": [
                     {
                       "tag": "default",
@@ -2851,7 +2919,7 @@
                 "kindString": "Set signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Indicates whether users can remove the token from the list by selecting the close button\nor pressing the `Backspace` key.",
+                  "shortText": "Indicates whether users can remove the token from the list by selecting the close button.",
                   "tags": [
                     {
                       "tag": "default",
@@ -2902,35 +2970,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 69,
+                "line": 66,
                 "character": 13
               }
             ],
-            "getSignature": [
-              {
-                "id": 193,
-                "name": "focusable",
-                "kind": 524288,
-                "kindString": "Get signature",
-                "flags": {},
-                "comment": {
-                  "shortText": "Indicates whether users can press the `Tab` key to place focus on the token. This does not\naffect the ability to select the token, dismiss it, or navigate to it with the arrow keys.",
-                  "tags": [
-                    {
-                      "tag": "default",
-                      "text": "true\n"
-                    }
-                  ]
-                },
-                "type": {
-                  "type": "intrinsic",
-                  "name": "boolean"
-                }
-              }
-            ],
             "setSignature": [
               {
-                "id": 194,
+                "id": 193,
                 "name": "focusable",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -2946,7 +2992,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 195,
+                    "id": 194,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -2965,7 +3011,7 @@
             ]
           },
           {
-            "id": 206,
+            "id": 205,
             "name": "dismissToken",
             "kind": 2048,
             "kindString": "Method",
@@ -2975,20 +3021,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 116,
+                "line": 100,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 207,
+                "id": 206,
                 "name": "dismissToken",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 208,
+                    "id": 207,
                     "name": "event",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3009,7 +3055,7 @@
             ]
           },
           {
-            "id": 209,
+            "id": 208,
             "name": "focusElement",
             "kind": 2048,
             "kindString": "Method",
@@ -3019,13 +3065,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 121,
+                "line": 105,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 210,
+                "id": 209,
                 "name": "focusElement",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -3038,7 +3084,7 @@
             ]
           },
           {
-            "id": 214,
+            "id": 213,
             "name": "setCloseActive",
             "kind": 2048,
             "kindString": "Method",
@@ -3048,20 +3094,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 129,
+                "line": 113,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 215,
+                "id": 214,
                 "name": "setCloseActive",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 216,
+                    "id": 215,
                     "name": "closeActive",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3080,7 +3126,7 @@
             ]
           },
           {
-            "id": 211,
+            "id": 210,
             "name": "setTokenActive",
             "kind": 2048,
             "kindString": "Method",
@@ -3090,20 +3136,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/token.component.ts",
-                "line": 125,
+                "line": 109,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 212,
+                "id": 211,
                 "name": "setTokenActive",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 213,
+                    "id": 212,
                     "name": "tokenActive",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3134,8 +3180,11 @@
             "title": "Properties",
             "kind": 1024,
             "children": [
-              196,
-              197
+              198,
+              195,
+              199,
+              197,
+              196
             ]
           },
           {
@@ -3152,10 +3201,10 @@
             "title": "Methods",
             "kind": 2048,
             "children": [
-              206,
-              209,
-              214,
-              211
+              205,
+              208,
+              213,
+              210
             ]
           }
         ],
@@ -3168,11 +3217,14 @@
         ]
       },
       {
-        "id": 220,
+        "id": 218,
         "name": "SkyTokensComponent",
         "kind": 128,
         "kindString": "Class",
         "flags": {},
+        "comment": {
+          "shortText": "Creates a container that enables navigation between tokens using keyboard arrow keys.\nThis is useful when combined with other components where the <kbd>Tab</kbd> key is\nreserved for other functions, such as the SKY UX Lookup component."
+        },
         "decorators": [
           {
             "name": "Component",
@@ -3189,7 +3241,7 @@
         ],
         "children": [
           {
-            "id": 221,
+            "id": 219,
             "name": "constructor",
             "kind": 512,
             "kindString": "Constructor",
@@ -3197,20 +3249,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 214,
+                "line": 222,
                 "character": 2
               }
             ],
             "signatures": [
               {
-                "id": 222,
+                "id": 220,
                 "name": "SkyTokensComponent",
                 "kind": 16384,
                 "kindString": "Constructor signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 223,
+                    "id": 221,
                     "name": "changeDetector",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3225,14 +3277,14 @@
                 ],
                 "type": {
                   "type": "reference",
-                  "id": 220,
+                  "id": 218,
                   "name": "SkyTokensComponent"
                 }
               }
             ]
           },
           {
-            "id": 249,
+            "id": 247,
             "name": "focusIndexOverRange",
             "kind": 1024,
             "kindString": "Property",
@@ -3257,7 +3309,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 153,
+                "line": 164,
                 "character": 9
               }
             ],
@@ -3276,7 +3328,7 @@
             "defaultValue": "..."
           },
           {
-            "id": 250,
+            "id": 248,
             "name": "focusIndexUnderRange",
             "kind": 1024,
             "kindString": "Property",
@@ -3284,7 +3336,7 @@
               "isPublic": true
             },
             "comment": {
-              "shortText": "Fires when usersnavigate through the tokens list with the `Tab` key\nand attempt to move before the first token in the list."
+              "shortText": "Fires when users navigate through the tokens list with the `Tab` key\nand attempt to move before the first token in the list."
             },
             "decorators": [
               {
@@ -3301,7 +3353,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 160,
+                "line": 171,
                 "character": 9
               }
             ],
@@ -3320,7 +3372,50 @@
             "defaultValue": "..."
           },
           {
-            "id": 251,
+            "id": 261,
+            "name": "tokenComponents",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isPublic": true
+            },
+            "decorators": [
+              {
+                "name": "ViewChildren",
+                "type": {
+                  "type": "reference",
+                  "qualifiedName": "ViewChildrenDecorator",
+                  "package": "@angular/core",
+                  "name": "ViewChildren"
+                },
+                "arguments": {
+                  "selector": "SkyTokenComponent"
+                }
+              }
+            ],
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
+                "line": 213,
+                "character": 9
+              }
+            ],
+            "type": {
+              "type": "reference",
+              "typeArguments": [
+                {
+                  "type": "reference",
+                  "id": 175,
+                  "name": "SkyTokenComponent"
+                }
+              ],
+              "qualifiedName": "QueryList",
+              "package": "@angular/core",
+              "name": "QueryList"
+            }
+          },
+          {
+            "id": 249,
             "name": "tokenSelected",
             "kind": 1024,
             "kindString": "Property",
@@ -3345,7 +3440,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 166,
+                "line": 177,
                 "character": 9
               }
             ],
@@ -3354,7 +3449,7 @@
               "typeArguments": [
                 {
                   "type": "reference",
-                  "id": 372,
+                  "id": 381,
                   "name": "SkyTokenSelectedEventArgs"
                 }
               ],
@@ -3365,7 +3460,7 @@
             "defaultValue": "..."
           },
           {
-            "id": 252,
+            "id": 250,
             "name": "tokensChange",
             "kind": 1024,
             "kindString": "Property",
@@ -3390,7 +3485,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 173,
+                "line": 184,
                 "character": 9
               }
             ],
@@ -3401,7 +3496,7 @@
                   "type": "array",
                   "elementType": {
                     "type": "reference",
-                    "id": 370,
+                    "id": 379,
                     "name": "SkyToken"
                   }
                 }
@@ -3413,7 +3508,7 @@
             "defaultValue": "..."
           },
           {
-            "id": 257,
+            "id": 255,
             "name": "trackTokenFn",
             "kind": 1024,
             "kindString": "Property",
@@ -3423,64 +3518,26 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 198,
+                "line": 204,
                 "character": 9
               }
             ],
             "type": {
-              "type": "reflection",
-              "declaration": {
-                "id": 258,
-                "name": "__type",
-                "kind": 65536,
-                "kindString": "Type literal",
-                "flags": {},
-                "signatures": [
-                  {
-                    "id": 259,
-                    "name": "__type",
-                    "kind": 4096,
-                    "kindString": "Call signature",
-                    "flags": {},
-                    "comment": {
-                      "shortText": "internal"
-                    },
-                    "parameters": [
-                      {
-                        "id": 260,
-                        "name": "index",
-                        "kind": 32768,
-                        "kindString": "Parameter",
-                        "flags": {},
-                        "type": {
-                          "type": "intrinsic",
-                          "name": "number"
-                        }
-                      },
-                      {
-                        "id": 261,
-                        "name": "item",
-                        "kind": 32768,
-                        "kindString": "Parameter",
-                        "flags": {},
-                        "type": {
-                          "type": "reference",
-                          "id": 370,
-                          "name": "SkyToken"
-                        }
-                      }
-                    ],
-                    "type": {
-                      "type": "intrinsic",
-                      "name": "any"
-                    }
-                  }
-                ]
-              }
+              "type": "reference",
+              "typeArguments": [
+                {
+                  "type": "reference",
+                  "id": 379,
+                  "name": "SkyToken"
+                }
+              ],
+              "qualifiedName": "TrackByFunction",
+              "package": "@angular/core",
+              "name": "TrackByFunction"
             }
           },
           {
-            "id": 236,
+            "id": 234,
             "name": "trackWith",
             "kind": 1024,
             "kindString": "Property",
@@ -3505,7 +3562,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 104,
+                "line": 111,
                 "character": 9
               }
             ],
@@ -3515,7 +3572,62 @@
             }
           },
           {
-            "id": 224,
+            "id": 251,
+            "name": "activeIndex",
+            "kind": 262144,
+            "kindString": "Accessor",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
+                "line": 186,
+                "character": 13
+              }
+            ],
+            "getSignature": [
+              {
+                "id": 252,
+                "name": "activeIndex",
+                "kind": 524288,
+                "kindString": "Get signature",
+                "flags": {},
+                "type": {
+                  "type": "intrinsic",
+                  "name": "number"
+                }
+              }
+            ],
+            "setSignature": [
+              {
+                "id": 253,
+                "name": "activeIndex",
+                "kind": 1048576,
+                "kindString": "Set signature",
+                "flags": {},
+                "parameters": [
+                  {
+                    "id": 254,
+                    "name": "value",
+                    "kind": 32768,
+                    "kindString": "Parameter",
+                    "flags": {},
+                    "type": {
+                      "type": "intrinsic",
+                      "name": "number"
+                    }
+                  }
+                ],
+                "type": {
+                  "type": "intrinsic",
+                  "name": "void"
+                }
+              }
+            ]
+          },
+          {
+            "id": 222,
             "name": "disabled",
             "kind": 262144,
             "kindString": "Accessor",
@@ -3537,13 +3649,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 64,
+                "line": 72,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 225,
+                "id": 223,
                 "name": "disabled",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -3565,7 +3677,7 @@
             ],
             "setSignature": [
               {
-                "id": 226,
+                "id": 224,
                 "name": "disabled",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -3581,7 +3693,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 227,
+                    "id": 225,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3600,7 +3712,7 @@
             ]
           },
           {
-            "id": 228,
+            "id": 226,
             "name": "dismissible",
             "kind": 262144,
             "kindString": "Accessor",
@@ -3622,19 +3734,19 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 78,
+                "line": 85,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 229,
+                "id": 227,
                 "name": "dismissible",
                 "kind": 524288,
                 "kindString": "Get signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Indicates whether users can remove tokens from the list by selecting their close buttons\nor pressing the `Backspace` key.",
+                  "shortText": "Indicates whether users can remove a token from the list by selecting a token's close button.",
                   "tags": [
                     {
                       "tag": "default",
@@ -3650,13 +3762,13 @@
             ],
             "setSignature": [
               {
-                "id": 230,
+                "id": 228,
                 "name": "dismissible",
                 "kind": 1048576,
                 "kindString": "Set signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Indicates whether users can remove tokens from the list by selecting their close buttons\nor pressing the `Backspace` key.",
+                  "shortText": "Indicates whether users can remove a token from the list by selecting a token's close button.",
                   "tags": [
                     {
                       "tag": "default",
@@ -3666,7 +3778,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 231,
+                    "id": 229,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3685,7 +3797,7 @@
             ]
           },
           {
-            "id": 232,
+            "id": 230,
             "name": "displayWith",
             "kind": 262144,
             "kindString": "Accessor",
@@ -3707,13 +3819,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 91,
+                "line": 98,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 233,
+                "id": 231,
                 "name": "displayWith",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -3735,7 +3847,7 @@
             ],
             "setSignature": [
               {
-                "id": 234,
+                "id": 232,
                 "name": "displayWith",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -3751,7 +3863,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 235,
+                    "id": 233,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3770,7 +3882,7 @@
             ]
           },
           {
-            "id": 237,
+            "id": 235,
             "name": "focusable",
             "kind": 262144,
             "kindString": "Accessor",
@@ -3792,13 +3904,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 113,
+                "line": 120,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 238,
+                "id": 236,
                 "name": "focusable",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -3820,7 +3932,7 @@
             ],
             "setSignature": [
               {
-                "id": 239,
+                "id": 237,
                 "name": "focusable",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -3836,7 +3948,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 240,
+                    "id": 238,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3855,7 +3967,7 @@
             ]
           },
           {
-            "id": 245,
+            "id": 243,
             "name": "messageStream",
             "kind": 262144,
             "kindString": "Accessor",
@@ -3877,13 +3989,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 139,
+                "line": 150,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 246,
+                "id": 244,
                 "name": "messageStream",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -3896,7 +4008,7 @@
                   "typeArguments": [
                     {
                       "type": "reference",
-                      "id": 374,
+                      "id": 383,
                       "name": "SkyTokensMessage"
                     }
                   ],
@@ -3908,7 +4020,7 @@
             ],
             "setSignature": [
               {
-                "id": 247,
+                "id": 245,
                 "name": "messageStream",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -3918,7 +4030,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 248,
+                    "id": 246,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -3928,7 +4040,7 @@
                       "typeArguments": [
                         {
                           "type": "reference",
-                          "id": 374,
+                          "id": 383,
                           "name": "SkyTokensMessage"
                         }
                       ],
@@ -3946,7 +4058,7 @@
             ]
           },
           {
-            "id": 241,
+            "id": 239,
             "name": "tokens",
             "kind": 262144,
             "kindString": "Accessor",
@@ -3968,13 +4080,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 125,
+                "line": 132,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 242,
+                "id": 240,
                 "name": "tokens",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -3986,7 +4098,7 @@
                   "type": "array",
                   "elementType": {
                     "type": "reference",
-                    "id": 370,
+                    "id": 379,
                     "name": "SkyToken"
                   }
                 }
@@ -3994,7 +4106,7 @@
             ],
             "setSignature": [
               {
-                "id": 243,
+                "id": 241,
                 "name": "tokens",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -4004,7 +4116,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 244,
+                    "id": 242,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -4013,7 +4125,7 @@
                       "type": "array",
                       "elementType": {
                         "type": "reference",
-                        "id": 370,
+                        "id": 379,
                         "name": "SkyToken"
                       }
                     }
@@ -4027,7 +4139,7 @@
             ]
           },
           {
-            "id": 272,
+            "id": 267,
             "name": "ngOnDestroy",
             "kind": 2048,
             "kindString": "Method",
@@ -4037,13 +4149,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 227,
+                "line": 237,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 273,
+                "id": 268,
                 "name": "ngOnDestroy",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -4064,7 +4176,7 @@
             }
           },
           {
-            "id": 274,
+            "id": 269,
             "name": "onTokenClick",
             "kind": 2048,
             "kindString": "Method",
@@ -4074,27 +4186,27 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 232,
+                "line": 242,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 275,
+                "id": 270,
                 "name": "onTokenClick",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 276,
+                    "id": 271,
                     "name": "token",
                     "kind": 32768,
                     "kindString": "Parameter",
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 370,
+                      "id": 379,
                       "name": "SkyToken"
                     }
                   }
@@ -4107,7 +4219,7 @@
             ]
           },
           {
-            "id": 277,
+            "id": 272,
             "name": "onTokenKeyDown",
             "kind": 2048,
             "kindString": "Method",
@@ -4117,20 +4229,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 240,
+                "line": 250,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 278,
+                "id": 273,
                 "name": "onTokenKeyDown",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 279,
+                    "id": 274,
                     "name": "event",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -4151,7 +4263,7 @@
             ]
           },
           {
-            "id": 283,
+            "id": 278,
             "name": "removeToken",
             "kind": 2048,
             "kindString": "Method",
@@ -4161,27 +4273,27 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 268,
+                "line": 278,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 284,
+                "id": 279,
                 "name": "removeToken",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 285,
+                    "id": 280,
                     "name": "token",
                     "kind": 32768,
                     "kindString": "Parameter",
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 370,
+                      "id": 379,
                       "name": "SkyToken"
                     }
                   }
@@ -4194,7 +4306,7 @@
             ]
           },
           {
-            "id": 280,
+            "id": 275,
             "name": "selectToken",
             "kind": 2048,
             "kindString": "Method",
@@ -4204,27 +4316,27 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-                "line": 262,
+                "line": 272,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 281,
+                "id": 276,
                 "name": "selectToken",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 282,
+                    "id": 277,
                     "name": "token",
                     "kind": 32768,
                     "kindString": "Parameter",
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 370,
+                      "id": 379,
                       "name": "SkyToken"
                     }
                   }
@@ -4242,49 +4354,51 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              221
+              219
             ]
           },
           {
             "title": "Properties",
             "kind": 1024,
             "children": [
+              247,
+              248,
+              261,
               249,
               250,
-              251,
-              252,
-              257,
-              236
+              255,
+              234
             ]
           },
           {
             "title": "Accessors",
             "kind": 262144,
             "children": [
-              224,
-              228,
-              232,
-              237,
-              245,
-              241
+              251,
+              222,
+              226,
+              230,
+              235,
+              243,
+              239
             ]
           },
           {
             "title": "Methods",
             "kind": 2048,
             "children": [
+              267,
+              269,
               272,
-              274,
-              277,
-              283,
-              280
+              278,
+              275
             ]
           }
         ],
         "sources": [
           {
             "fileName": "projects/indicators/src/modules/tokens/tokens.component.ts",
-            "line": 56,
+            "line": 64,
             "character": 13
           }
         ],
@@ -4298,7 +4412,7 @@
         ]
       },
       {
-        "id": 301,
+        "id": 296,
         "name": "SkyWaitComponent",
         "kind": 128,
         "kindString": "Class",
@@ -4319,7 +4433,7 @@
         ],
         "children": [
           {
-            "id": 302,
+            "id": 297,
             "name": "constructor",
             "kind": 512,
             "kindString": "Constructor",
@@ -4327,20 +4441,20 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 91,
+                "line": 120,
                 "character": 2
               }
             ],
             "signatures": [
               {
-                "id": 303,
+                "id": 298,
                 "name": "SkyWaitComponent",
                 "kind": 16384,
                 "kindString": "Constructor signature",
                 "flags": {},
                 "parameters": [
                   {
-                    "id": 304,
+                    "id": 299,
                     "name": "elRef",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -4359,7 +4473,7 @@
                     }
                   },
                   {
-                    "id": 305,
+                    "id": 300,
                     "name": "adapterService",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -4370,8 +4484,8 @@
                     }
                   },
                   {
-                    "id": 306,
-                    "name": "resourceService",
+                    "id": 301,
+                    "name": "resourceSvc",
                     "kind": 32768,
                     "kindString": "Parameter",
                     "flags": {},
@@ -4395,47 +4509,12 @@
                 ],
                 "type": {
                   "type": "reference",
-                  "id": 301,
+                  "id": 296,
                   "name": "SkyWaitComponent"
                 }
               }
             ]
           },
-          {
-            "id": 307,
-            "name": "ariaLabel",
-            "kind": 1024,
-            "kindString": "Property",
-            "flags": {
-              "isPublic": true
-            },
-            "comment": {
-              "shortText": "Specifies an ARIA label for the wait icon while an element or page loads.\nThis sets the icon's `aria-label` attribute\n[to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\nThe default value varies based on whether the wait is for an element or a page\nand whether it is a blocking wait. For example, the default for a page-blocking\nwait is \"Page loading. Please wait.\""
-            },
-            "decorators": [
-              {
-                "name": "Input",
-                "type": {
-                  "type": "reference",
-                  "qualifiedName": "InputDecorator",
-                  "package": "@angular/core",
-                  "name": "Input"
-                },
-                "arguments": {}
-              }
-            ],
-            "sources": [
-              {
-                "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 26,
-                "character": 9
-              }
-            ],
-            "type": {
-              "type": "intrinsic",
-              "name": "string"
-            }
-          },
           {
             "id": 317,
             "name": "ariaLabelStream",
@@ -4447,7 +4526,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 85,
+                "line": 106,
                 "character": 9
               }
             ],
@@ -4466,22 +4545,13 @@
             "defaultValue": "..."
           },
           {
-            "id": 316,
-            "name": "isNonBlocking",
-            "kind": 1024,
-            "kindString": "Property",
+            "id": 302,
+            "name": "ariaLabel",
+            "kind": 262144,
+            "kindString": "Accessor",
             "flags": {
               "isPublic": true
             },
-            "comment": {
-              "shortText": "When set to `true`, wait indication appears in the bottom left corner of the element\ninstead of hiding the entire parent element.",
-              "tags": [
-                {
-                  "tag": "default",
-                  "text": "false\n"
-                }
-              ]
-            },
             "decorators": [
               {
                 "name": "Input",
@@ -4497,17 +4567,42 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 83,
-                "character": 9
+                "line": 34,
+                "character": 13
               }
             ],
-            "type": {
-              "type": "intrinsic",
-              "name": "boolean"
-            }
+            "setSignature": [
+              {
+                "id": 303,
+                "name": "ariaLabel",
+                "kind": 1048576,
+                "kindString": "Set signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Specifies an ARIA label for the wait icon while an element or page loads.\nThis sets the icon's `aria-label` attribute\n[to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\nThe default value varies based on whether the wait is for an element or a page\nand whether it is a blocking wait. For example, the default for a page-blocking\nwait is \"Page loading. Please wait.\""
+                },
+                "parameters": [
+                  {
+                    "id": 304,
+                    "name": "value",
+                    "kind": 32768,
+                    "kindString": "Parameter",
+                    "flags": {},
+                    "type": {
+                      "type": "intrinsic",
+                      "name": "string"
+                    }
+                  }
+                ],
+                "type": {
+                  "type": "intrinsic",
+                  "name": "void"
+                }
+              }
+            ]
           },
           {
-            "id": 312,
+            "id": 309,
             "name": "isFullPage",
             "kind": 262144,
             "kindString": "Accessor",
@@ -4529,13 +4624,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 62,
+                "line": 75,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 313,
+                "id": 310,
                 "name": "isFullPage",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -4557,7 +4652,7 @@
             ],
             "setSignature": [
               {
-                "id": 314,
+                "id": 311,
                 "name": "isFullPage",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -4573,7 +4668,92 @@
                 },
                 "parameters": [
                   {
-                    "id": 315,
+                    "id": 312,
+                    "name": "value",
+                    "kind": 32768,
+                    "kindString": "Parameter",
+                    "flags": {},
+                    "type": {
+                      "type": "intrinsic",
+                      "name": "boolean"
+                    }
+                  }
+                ],
+                "type": {
+                  "type": "intrinsic",
+                  "name": "void"
+                }
+              }
+            ]
+          },
+          {
+            "id": 313,
+            "name": "isNonBlocking",
+            "kind": 262144,
+            "kindString": "Accessor",
+            "flags": {
+              "isPublic": true
+            },
+            "decorators": [
+              {
+                "name": "Input",
+                "type": {
+                  "type": "reference",
+                  "qualifiedName": "InputDecorator",
+                  "package": "@angular/core",
+                  "name": "Input"
+                },
+                "arguments": {}
+              }
+            ],
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
+                "line": 97,
+                "character": 13
+              }
+            ],
+            "getSignature": [
+              {
+                "id": 314,
+                "name": "isNonBlocking",
+                "kind": 524288,
+                "kindString": "Get signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "When set to `true`, wait indication appears in the bottom left corner of the element\ninstead of hiding the entire parent element.",
+                  "tags": [
+                    {
+                      "tag": "default",
+                      "text": "false\n"
+                    }
+                  ]
+                },
+                "type": {
+                  "type": "intrinsic",
+                  "name": "boolean"
+                }
+              }
+            ],
+            "setSignature": [
+              {
+                "id": 315,
+                "name": "isNonBlocking",
+                "kind": 1048576,
+                "kindString": "Set signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "When set to `true`, wait indication appears in the bottom left corner of the element\ninstead of hiding the entire parent element.",
+                  "tags": [
+                    {
+                      "tag": "default",
+                      "text": "false\n"
+                    }
+                  ]
+                },
+                "parameters": [
+                  {
+                    "id": 316,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -4592,7 +4772,7 @@
             ]
           },
           {
-            "id": 308,
+            "id": 305,
             "name": "isWaiting",
             "kind": 262144,
             "kindString": "Accessor",
@@ -4614,13 +4794,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 32,
+                "line": 43,
                 "character": 13
               }
             ],
             "getSignature": [
               {
-                "id": 309,
+                "id": 306,
                 "name": "isWaiting",
                 "kind": 524288,
                 "kindString": "Get signature",
@@ -4636,7 +4816,7 @@
             ],
             "setSignature": [
               {
-                "id": 310,
+                "id": 307,
                 "name": "isWaiting",
                 "kind": 1048576,
                 "kindString": "Set signature",
@@ -4646,7 +4826,7 @@
                 },
                 "parameters": [
                   {
-                    "id": 311,
+                    "id": 308,
                     "name": "value",
                     "kind": 32768,
                     "kindString": "Parameter",
@@ -4665,7 +4845,44 @@
             ]
           },
           {
-            "id": 321,
+            "id": 329,
+            "name": "ngOnDestroy",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
+                "line": 136,
+                "character": 9
+              }
+            ],
+            "signatures": [
+              {
+                "id": 330,
+                "name": "ngOnDestroy",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "type": {
+                  "type": "intrinsic",
+                  "name": "void"
+                },
+                "implementationOf": {
+                  "type": "reference",
+                  "name": "OnDestroy.ngOnDestroy"
+                }
+              }
+            ],
+            "implementationOf": {
+              "type": "reference",
+              "name": "OnDestroy.ngOnDestroy"
+            }
+          },
+          {
+            "id": 327,
             "name": "ngOnInit",
             "kind": 2048,
             "kindString": "Method",
@@ -4675,13 +4892,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-                "line": 97,
+                "line": 132,
                 "character": 9
               }
             ],
             "signatures": [
               {
-                "id": 322,
+                "id": 328,
                 "name": "ngOnInit",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -4707,38 +4924,39 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              302
+              297
             ]
           },
           {
             "title": "Properties",
             "kind": 1024,
             "children": [
-              307,
-              317,
-              316
+              317
             ]
           },
           {
             "title": "Accessors",
             "kind": 262144,
             "children": [
-              312,
-              308
+              302,
+              309,
+              313,
+              305
             ]
           },
           {
             "title": "Methods",
             "kind": 2048,
             "children": [
-              321
+              329,
+              327
             ]
           }
         ],
         "sources": [
           {
             "fileName": "projects/indicators/src/modules/wait/wait.component.ts",
-            "line": 16,
+            "line": 24,
             "character": 13
           }
         ],
@@ -4748,6 +4966,12 @@
             "qualifiedName": "OnInit",
             "package": "@angular/core",
             "name": "OnInit"
+          },
+          {
+            "type": "reference",
+            "qualifiedName": "OnDestroy",
+            "package": "@angular/core",
+            "name": "OnDestroy"
           }
         ]
       },
@@ -5018,10 +5242,9 @@
             ],
             "type": {
               "type": "reference",
-              "id": 350,
+              "id": 358,
               "name": "SkyIconType"
-            },
-            "defaultValue": "'fa'"
+            }
           },
           {
             "id": 65,
@@ -5090,7 +5313,7 @@
             ],
             "type": {
               "type": "reference",
-              "id": 351,
+              "id": 359,
               "name": "SkyIconVariantType"
             }
           }
@@ -5270,7 +5493,7 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/key-info/key-info.component.ts",
-                "line": 16,
+                "line": 18,
                 "character": 9
               }
             ],
@@ -5300,7 +5523,7 @@
         "sources": [
           {
             "fileName": "projects/indicators/src/modules/key-info/key-info.component.ts",
-            "line": 8,
+            "line": 10,
             "character": 13
           }
         ]
@@ -5457,7 +5680,7 @@
             ],
             "type": {
               "type": "reference",
-              "id": 355,
+              "id": 364,
               "name": "SkyLabelType"
             },
             "defaultValue": "LABEL_TYPE_DEFAULT"
@@ -5585,7 +5808,7 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 359,
+                      "id": 368,
                       "name": "SkyIndicatorDescriptionType"
                     }
                   }
@@ -5649,7 +5872,7 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 355,
+                      "id": 364,
                       "name": "SkyLabelType"
                     }
                   }
@@ -5796,25 +6019,25 @@
         ]
       },
       {
-        "id": 370,
+        "id": 379,
         "name": "SkyToken",
         "kind": 256,
         "kindString": "Interface",
         "flags": {},
         "children": [
           {
-            "id": 371,
+            "id": 380,
             "name": "value",
             "kind": 1024,
             "kindString": "Property",
             "flags": {},
             "comment": {
-              "shortText": "Specifies the token's contents."
+              "shortText": "Specifies the token's value. The `sky-tokens` component will use its `displayWith`\nproperty to determine which of the value's properties to use as the token's label."
             },
             "sources": [
               {
                 "fileName": "projects/indicators/src/modules/tokens/types/token.ts",
-                "line": 5,
+                "line": 7,
                 "character": 2
               }
             ],
@@ -5829,7 +6052,7 @@
             "title": "Properties",
             "kind": 1024,
             "children": [
-              371
+              380
             ]
           }
         ],
@@ -5842,14 +6065,14 @@
         ]
       },
       {
-        "id": 372,
+        "id": 381,
         "name": "SkyTokenSelectedEventArgs",
         "kind": 256,
         "kindString": "Interface",
         "flags": {},
         "children": [
           {
-            "id": 373,
+            "id": 382,
             "name": "token",
             "kind": 1024,
             "kindString": "Property",
@@ -5868,7 +6091,7 @@
             ],
             "type": {
               "type": "reference",
-              "id": 370,
+              "id": 379,
               "name": "SkyToken"
             }
           }
@@ -5878,7 +6101,7 @@
             "title": "Properties",
             "kind": 1024,
             "children": [
-              373
+              382
             ]
           }
         ],
@@ -5891,14 +6114,14 @@
         ]
       },
       {
-        "id": 374,
+        "id": 383,
         "name": "SkyTokensMessage",
         "kind": 256,
         "kindString": "Interface",
         "flags": {},
         "children": [
           {
-            "id": 375,
+            "id": 384,
             "name": "type",
             "kind": 1024,
             "kindString": "Property",
@@ -5917,7 +6140,7 @@
             ],
             "type": {
               "type": "reference",
-              "id": 376,
+              "id": 385,
               "name": "SkyTokensMessageType"
             }
           }
@@ -5927,7 +6150,7 @@
             "title": "Properties",
             "kind": 1024,
             "children": [
-              375
+              384
             ]
           }
         ],
@@ -5940,7 +6163,7 @@
         ]
       },
       {
-        "id": 350,
+        "id": 358,
         "name": "SkyIconType",
         "kind": 4194304,
         "kindString": "Type alias",
@@ -5967,7 +6190,7 @@
         }
       },
       {
-        "id": 351,
+        "id": 359,
         "name": "SkyIconVariantType",
         "kind": 4194304,
         "kindString": "Type alias",
@@ -5994,7 +6217,7 @@
         }
       },
       {
-        "id": 359,
+        "id": 368,
         "name": "SkyIndicatorDescriptionType",
         "kind": 4194304,
         "kindString": "Type alias",
@@ -6057,7 +6280,7 @@
         }
       },
       {
-        "id": 360,
+        "id": 369,
         "name": "SkyIndicatorIconType",
         "kind": 4194304,
         "kindString": "Type alias",
@@ -6092,7 +6315,34 @@
         }
       },
       {
-        "id": 355,
+        "id": 360,
+        "name": "SkyKeyInfoLayoutType",
+        "kind": 4194304,
+        "kindString": "Type alias",
+        "flags": {},
+        "sources": [
+          {
+            "fileName": "projects/indicators/src/modules/key-info/key-info-layout-type.ts",
+            "line": 1,
+            "character": 12
+          }
+        ],
+        "type": {
+          "type": "union",
+          "types": [
+            {
+              "type": "literal",
+              "value": "horizontal"
+            },
+            {
+              "type": "literal",
+              "value": "vertical"
+            }
+          ]
+        }
+      },
+      {
+        "id": 364,
         "name": "SkyLabelType",
         "kind": 4194304,
         "kindString": "Type alias",
@@ -6127,7 +6377,7 @@
         }
       },
       {
-        "id": 565,
+        "id": 437,
         "name": "SkyAlertHarness",
         "kind": 128,
         "kindString": "Class",
@@ -6137,30 +6387,89 @@
         },
         "children": [
           {
-            "id": 566,
-            "name": "hostSelector",
-            "kind": 1024,
-            "kindString": "Property",
+            "id": 458,
+            "name": "close",
+            "kind": 2048,
+            "kindString": "Method",
             "flags": {
-              "isPublic": true,
-              "isStatic": true
+              "isPublic": true
             },
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 11,
-                "character": 16
-              }
+                "line": 65,
+                "character": 15
+              }
             ],
-            "type": {
-              "type": "intrinsic",
-              "name": "string"
+            "signatures": [
+              {
+                "id": 459,
+                "name": "close",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Closes the alert."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "intrinsic",
+                      "name": "void"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
+          },
+          {
+            "id": 454,
+            "name": "getAlertType",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true
             },
-            "defaultValue": "'sky-alert'"
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
+                "line": 37,
+                "character": 15
+              }
+            ],
+            "signatures": [
+              {
+                "id": 455,
+                "name": "getAlertType",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the current alert type."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "id": 369,
+                      "name": "SkyIndicatorIconType"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
           },
           {
-            "id": 585,
-            "name": "close",
+            "id": 466,
+            "name": "getCustomDescription",
             "kind": 2048,
             "kindString": "Method",
             "flags": {
@@ -6169,26 +6478,26 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 62,
+                "line": 129,
                 "character": 15
               }
             ],
             "signatures": [
               {
-                "id": 586,
-                "name": "close",
+                "id": 467,
+                "name": "getCustomDescription",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Closes the alert."
+                  "shortText": "Gets the custom text used for the screen reader description of the label component icon."
                 },
                 "type": {
                   "type": "reference",
                   "typeArguments": [
                     {
                       "type": "intrinsic",
-                      "name": "void"
+                      "name": "string"
                     }
                   ],
                   "qualifiedName": "Promise",
@@ -6199,8 +6508,8 @@
             ]
           },
           {
-            "id": 581,
-            "name": "getAlertType",
+            "id": 464,
+            "name": "getDescriptionType",
             "kind": 2048,
             "kindString": "Method",
             "flags": {
@@ -6209,27 +6518,27 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 30,
+                "line": 93,
                 "character": 15
               }
             ],
             "signatures": [
               {
-                "id": 582,
-                "name": "getAlertType",
+                "id": 465,
+                "name": "getDescriptionType",
                 "kind": 4096,
                 "kindString": "Call signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Gets the current alert type."
+                  "shortText": "Gets the `descriptionType` of the label component."
                 },
                 "type": {
                   "type": "reference",
                   "typeArguments": [
                     {
                       "type": "reference",
-                      "id": 360,
-                      "name": "SkyIndicatorIconType"
+                      "id": 368,
+                      "name": "SkyIndicatorDescriptionType"
                     }
                   ],
                   "qualifiedName": "Promise",
@@ -6240,7 +6549,7 @@
             ]
           },
           {
-            "id": 583,
+            "id": 456,
             "name": "getText",
             "kind": 2048,
             "kindString": "Method",
@@ -6250,13 +6559,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 55,
+                "line": 58,
                 "character": 15
               }
             ],
             "signatures": [
               {
-                "id": 584,
+                "id": 457,
                 "name": "getText",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -6280,7 +6589,7 @@
             ]
           },
           {
-            "id": 594,
+            "id": 471,
             "name": "host",
             "kind": 2048,
             "kindString": "Method",
@@ -6294,7 +6603,7 @@
             ],
             "signatures": [
               {
-                "id": 595,
+                "id": 472,
                 "name": "host",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -6328,7 +6637,7 @@
             }
           },
           {
-            "id": 589,
+            "id": 462,
             "name": "isCloseable",
             "kind": 2048,
             "kindString": "Method",
@@ -6338,13 +6647,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 82,
+                "line": 85,
                 "character": 15
               }
             ],
             "signatures": [
               {
-                "id": 590,
+                "id": 463,
                 "name": "isCloseable",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -6368,7 +6677,7 @@
             ]
           },
           {
-            "id": 587,
+            "id": 460,
             "name": "isClosed",
             "kind": 2048,
             "kindString": "Method",
@@ -6378,13 +6687,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 73,
+                "line": 76,
                 "character": 15
               }
             ],
             "signatures": [
               {
-                "id": 588,
+                "id": 461,
                 "name": "isClosed",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -6408,7 +6717,7 @@
             ]
           },
           {
-            "id": 567,
+            "id": 439,
             "name": "with",
             "kind": 2048,
             "kindString": "Method",
@@ -6419,13 +6728,13 @@
             "sources": [
               {
                 "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-                "line": 21,
+                "line": 28,
                 "character": 16
               }
             ],
             "signatures": [
               {
-                "id": 568,
+                "id": 440,
                 "name": "with",
                 "kind": 4096,
                 "kindString": "Call signature",
@@ -6435,14 +6744,14 @@
                 },
                 "parameters": [
                   {
-                    "id": 569,
+                    "id": 441,
                     "name": "filters",
                     "kind": 32768,
                     "kindString": "Parameter",
                     "flags": {},
                     "type": {
                       "type": "reference",
-                      "id": 614,
+                      "id": 491,
                       "name": "SkyAlertHarnessFilters"
                     }
                   }
@@ -6452,7 +6761,7 @@
                   "typeArguments": [
                     {
                       "type": "reference",
-                      "id": 565,
+                      "id": 437,
                       "name": "SkyAlertHarness"
                     }
                   ],
@@ -6469,34 +6778,29 @@
             "title": "Constructors",
             "kind": 512,
             "children": [
-              575
-            ]
-          },
-          {
-            "title": "Properties",
-            "kind": 1024,
-            "children": [
-              566
+              447
             ]
           },
           {
             "title": "Methods",
             "kind": 2048,
             "children": [
-              585,
-              581,
-              583,
-              594,
-              589,
-              587,
-              567
+              458,
+              454,
+              466,
+              464,
+              456,
+              471,
+              462,
+              460,
+              439
             ]
           }
         ],
         "sources": [
           {
             "fileName": "projects/indicators/src/testing/alert/alert-harness.ts",
-            "line": 10,
+            "line": 13,
             "character": 13
           }
         ],
@@ -6508,135 +6812,973 @@
         ]
       },
       {
-        "id": 614,
-        "name": "SkyAlertHarnessFilters",
-        "kind": 256,
-        "kindString": "Interface",
+        "id": 495,
+        "name": "SkyKeyInfoHarness",
+        "kind": 128,
+        "kindString": "Class",
         "flags": {},
         "comment": {
-          "shortText": "A set of criteria that can be used to filter a list of SkyAlertHarness instances."
+          "shortText": "Harness for interacting with a key info component in tests."
         },
         "children": [
           {
-            "id": 617,
-            "name": "ancestor",
-            "kind": 1024,
-            "kindString": "Property",
+            "id": 513,
+            "name": "getLabelText",
+            "kind": 2048,
+            "kindString": "Method",
             "flags": {
-              "isOptional": true
-            },
-            "comment": {
-              "shortText": "Only find instances that are nested under an element with the given selector."
+              "isPublic": true
             },
             "sources": [
               {
-                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
-                "line": 351,
-                "character": 4
+                "fileName": "projects/indicators/src/testing/key-info/key-info-harness.ts",
+                "line": 42,
+                "character": 15
               }
             ],
-            "type": {
-              "type": "intrinsic",
-              "name": "string"
-            },
-            "inheritedFrom": {
-              "type": "reference",
-              "name": "SkyHarnessFilters.ancestor"
-            }
+            "signatures": [
+              {
+                "id": 514,
+                "name": "getLabelText",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the current label text."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "intrinsic",
+                      "name": "string"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
           },
           {
-            "id": 615,
-            "name": "dataSkyId",
-            "kind": 1024,
-            "kindString": "Property",
+            "id": 515,
+            "name": "getLayout",
+            "kind": 2048,
+            "kindString": "Method",
             "flags": {
-              "isOptional": true
-            },
-            "comment": {
-              "shortText": "Only find instances whose `data-sky-id` attribute matches the given value."
+              "isPublic": true
             },
             "sources": [
               {
-                "fileName": "libs/components/core/testing/src/shared/harness-filters.ts",
-                "line": 11,
-                "character": 2
+                "fileName": "projects/indicators/src/testing/key-info/key-info-harness.ts",
+                "line": 49,
+                "character": 15
               }
             ],
-            "type": {
-              "type": "union",
-              "types": [
-                {
-                  "type": "intrinsic",
-                  "name": "string"
+            "signatures": [
+              {
+                "id": 516,
+                "name": "getLayout",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the current layout type."
                 },
-                {
+                "type": {
                   "type": "reference",
-                  "qualifiedName": "RegExp",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "id": 360,
+                      "name": "SkyKeyInfoLayoutType"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
                   "package": "typescript",
-                  "name": "RegExp"
+                  "name": "Promise"
                 }
-              ]
-            },
-            "inheritedFrom": {
-              "type": "reference",
-              "name": "SkyHarnessFilters.dataSkyId"
-            }
+              }
+            ]
           },
           {
-            "id": 616,
-            "name": "selector",
-            "kind": 1024,
-            "kindString": "Property",
+            "id": 511,
+            "name": "getValueText",
+            "kind": 2048,
+            "kindString": "Method",
             "flags": {
-              "isOptional": true
-            },
-            "comment": {
-              "shortText": "Only find instances whose host element matches the given selector."
+              "isPublic": true
             },
             "sources": [
               {
-                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
-                "line": 349,
-                "character": 4
+                "fileName": "projects/indicators/src/testing/key-info/key-info-harness.ts",
+                "line": 35,
+                "character": 15
               }
             ],
-            "type": {
-              "type": "intrinsic",
-              "name": "string"
-            },
-            "inheritedFrom": {
-              "type": "reference",
-              "name": "SkyHarnessFilters.selector"
-            }
-          }
-        ],
-        "groups": [
-          {
-            "title": "Properties",
-            "kind": 1024,
-            "children": [
-              617,
-              615,
-              616
+            "signatures": [
+              {
+                "id": 512,
+                "name": "getValueText",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the current value text."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "intrinsic",
+                      "name": "string"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
             ]
-          }
-        ],
-        "sources": [
-          {
-            "fileName": "projects/indicators/src/testing/alert/alert-harness-filters.ts",
-            "line": 7,
-            "character": 17
-          }
-        ],
-        "extendedTypes": [
+          },
           {
-            "type": "reference",
-            "name": "SkyHarnessFilters"
-          }
-        ]
-      }
-    ],
-    "groups": [
+            "id": 520,
+            "name": "host",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {},
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 221,
+                "character": 4
+              }
+            ],
+            "signatures": [
+              {
+                "id": 521,
+                "name": "host",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets a `Promise` for the `TestElement` representing the host element of the component."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "qualifiedName": "TestElement",
+                      "package": "@angular/cdk",
+                      "name": "TestElement"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                },
+                "inheritedFrom": {
+                  "type": "reference",
+                  "name": "SkyComponentHarness.host"
+                }
+              }
+            ],
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyComponentHarness.host"
+            }
+          },
+          {
+            "id": 497,
+            "name": "with",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true,
+              "isStatic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/key-info/key-info-harness.ts",
+                "line": 26,
+                "character": 16
+              }
+            ],
+            "signatures": [
+              {
+                "id": 498,
+                "name": "with",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets a `HarnessPredicate` that can be used to search for a\n`SkyKeyInfoHarness` that meets certain criteria."
+                },
+                "parameters": [
+                  {
+                    "id": 499,
+                    "name": "filters",
+                    "kind": 32768,
+                    "kindString": "Parameter",
+                    "flags": {},
+                    "type": {
+                      "type": "reference",
+                      "id": 540,
+                      "name": "SkyKeyInfoHarnessFilters"
+                    }
+                  }
+                ],
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "id": 495,
+                      "name": "SkyKeyInfoHarness"
+                    }
+                  ],
+                  "qualifiedName": "HarnessPredicate",
+                  "package": "@angular/cdk",
+                  "name": "HarnessPredicate"
+                }
+              }
+            ]
+          }
+        ],
+        "groups": [
+          {
+            "title": "Constructors",
+            "kind": 512,
+            "children": [
+              505
+            ]
+          },
+          {
+            "title": "Methods",
+            "kind": 2048,
+            "children": [
+              513,
+              515,
+              511,
+              520,
+              497
+            ]
+          }
+        ],
+        "sources": [
+          {
+            "fileName": "projects/indicators/src/testing/key-info/key-info-harness.ts",
+            "line": 12,
+            "character": 13
+          }
+        ],
+        "extendedTypes": [
+          {
+            "type": "reference",
+            "name": "SkyComponentHarness"
+          }
+        ]
+      },
+      {
+        "id": 544,
+        "name": "SkyLabelHarness",
+        "kind": 128,
+        "kindString": "Class",
+        "flags": {},
+        "comment": {
+          "shortText": "Harness for interacting with a label component in tests."
+        },
+        "children": [
+          {
+            "id": 566,
+            "name": "getCustomDescription",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/label/label-harness.ts",
+                "line": 102,
+                "character": 15
+              }
+            ],
+            "signatures": [
+              {
+                "id": 567,
+                "name": "getCustomDescription",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the custom text used for the screen reader description of the label component icon."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "intrinsic",
+                      "name": "string"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
+          },
+          {
+            "id": 564,
+            "name": "getDescriptionType",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/label/label-harness.ts",
+                "line": 66,
+                "character": 15
+              }
+            ],
+            "signatures": [
+              {
+                "id": 565,
+                "name": "getDescriptionType",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the `descriptionType` of the label component."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "id": 368,
+                      "name": "SkyIndicatorDescriptionType"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
+          },
+          {
+            "id": 560,
+            "name": "getLabelText",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/label/label-harness.ts",
+                "line": 36,
+                "character": 15
+              }
+            ],
+            "signatures": [
+              {
+                "id": 561,
+                "name": "getLabelText",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the text of the label component."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "intrinsic",
+                      "name": "string"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
+          },
+          {
+            "id": 562,
+            "name": "getLabelType",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/label/label-harness.ts",
+                "line": 43,
+                "character": 15
+              }
+            ],
+            "signatures": [
+              {
+                "id": 563,
+                "name": "getLabelType",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets the `labelType` of the label component."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "id": 364,
+                      "name": "SkyLabelType"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                }
+              }
+            ]
+          },
+          {
+            "id": 571,
+            "name": "host",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {},
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 221,
+                "character": 4
+              }
+            ],
+            "signatures": [
+              {
+                "id": 572,
+                "name": "host",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets a `Promise` for the `TestElement` representing the host element of the component."
+                },
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "qualifiedName": "TestElement",
+                      "package": "@angular/cdk",
+                      "name": "TestElement"
+                    }
+                  ],
+                  "qualifiedName": "Promise",
+                  "package": "typescript",
+                  "name": "Promise"
+                },
+                "inheritedFrom": {
+                  "type": "reference",
+                  "name": "SkyComponentHarness.host"
+                }
+              }
+            ],
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyComponentHarness.host"
+            }
+          },
+          {
+            "id": 546,
+            "name": "with",
+            "kind": 2048,
+            "kindString": "Method",
+            "flags": {
+              "isPublic": true,
+              "isStatic": true
+            },
+            "sources": [
+              {
+                "fileName": "projects/indicators/src/testing/label/label-harness.ts",
+                "line": 27,
+                "character": 16
+              }
+            ],
+            "signatures": [
+              {
+                "id": 547,
+                "name": "with",
+                "kind": 4096,
+                "kindString": "Call signature",
+                "flags": {},
+                "comment": {
+                  "shortText": "Gets a `HarnessPredicate` that can be used to search for a\n`SkyLookupHarness` that meets certain criteria."
+                },
+                "parameters": [
+                  {
+                    "id": 548,
+                    "name": "filters",
+                    "kind": 32768,
+                    "kindString": "Parameter",
+                    "flags": {},
+                    "type": {
+                      "type": "reference",
+                      "id": 591,
+                      "name": "SkyLabelHarnessFilters"
+                    }
+                  }
+                ],
+                "type": {
+                  "type": "reference",
+                  "typeArguments": [
+                    {
+                      "type": "reference",
+                      "id": 544,
+                      "name": "SkyLabelHarness"
+                    }
+                  ],
+                  "qualifiedName": "HarnessPredicate",
+                  "package": "@angular/cdk",
+                  "name": "HarnessPredicate"
+                }
+              }
+            ]
+          }
+        ],
+        "groups": [
+          {
+            "title": "Constructors",
+            "kind": 512,
+            "children": [
+              554
+            ]
+          },
+          {
+            "title": "Methods",
+            "kind": 2048,
+            "children": [
+              566,
+              564,
+              560,
+              562,
+              571,
+              546
+            ]
+          }
+        ],
+        "sources": [
+          {
+            "fileName": "projects/indicators/src/testing/label/label-harness.ts",
+            "line": 13,
+            "character": 13
+          }
+        ],
+        "extendedTypes": [
+          {
+            "type": "reference",
+            "name": "SkyComponentHarness"
+          }
+        ]
+      },
+      {
+        "id": 491,
+        "name": "SkyAlertHarnessFilters",
+        "kind": 256,
+        "kindString": "Interface",
+        "flags": {},
+        "comment": {
+          "shortText": "A set of criteria that can be used to filter a list of SkyAlertHarness instances."
+        },
+        "children": [
+          {
+            "id": 494,
+            "name": "ancestor",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances that are nested under an element with the given selector."
+            },
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 351,
+                "character": 4
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "string"
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.ancestor"
+            }
+          },
+          {
+            "id": 492,
+            "name": "dataSkyId",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances whose `data-sky-id` attribute matches the given value."
+            },
+            "sources": [
+              {
+                "fileName": "libs/components/core/testing/src/shared/harness-filters.ts",
+                "line": 11,
+                "character": 2
+              }
+            ],
+            "type": {
+              "type": "union",
+              "types": [
+                {
+                  "type": "intrinsic",
+                  "name": "string"
+                },
+                {
+                  "type": "reference",
+                  "qualifiedName": "RegExp",
+                  "package": "typescript",
+                  "name": "RegExp"
+                }
+              ]
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.dataSkyId"
+            }
+          },
+          {
+            "id": 493,
+            "name": "selector",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances whose host element matches the given selector."
+            },
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 349,
+                "character": 4
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "string"
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.selector"
+            }
+          }
+        ],
+        "groups": [
+          {
+            "title": "Properties",
+            "kind": 1024,
+            "children": [
+              494,
+              492,
+              493
+            ]
+          }
+        ],
+        "sources": [
+          {
+            "fileName": "projects/indicators/src/testing/alert/alert-harness-filters.ts",
+            "line": 7,
+            "character": 17
+          }
+        ],
+        "extendedTypes": [
+          {
+            "type": "reference",
+            "name": "SkyHarnessFilters"
+          }
+        ]
+      },
+      {
+        "id": 540,
+        "name": "SkyKeyInfoHarnessFilters",
+        "kind": 256,
+        "kindString": "Interface",
+        "flags": {},
+        "comment": {
+          "shortText": "A set of criteria that can be used to filter a list of SkyKeyInfoHarness instances."
+        },
+        "children": [
+          {
+            "id": 543,
+            "name": "ancestor",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances that are nested under an element with the given selector."
+            },
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 351,
+                "character": 4
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "string"
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.ancestor"
+            }
+          },
+          {
+            "id": 541,
+            "name": "dataSkyId",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances whose `data-sky-id` attribute matches the given value."
+            },
+            "sources": [
+              {
+                "fileName": "libs/components/core/testing/src/shared/harness-filters.ts",
+                "line": 11,
+                "character": 2
+              }
+            ],
+            "type": {
+              "type": "union",
+              "types": [
+                {
+                  "type": "intrinsic",
+                  "name": "string"
+                },
+                {
+                  "type": "reference",
+                  "qualifiedName": "RegExp",
+                  "package": "typescript",
+                  "name": "RegExp"
+                }
+              ]
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.dataSkyId"
+            }
+          },
+          {
+            "id": 542,
+            "name": "selector",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances whose host element matches the given selector."
+            },
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 349,
+                "character": 4
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "string"
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.selector"
+            }
+          }
+        ],
+        "groups": [
+          {
+            "title": "Properties",
+            "kind": 1024,
+            "children": [
+              543,
+              541,
+              542
+            ]
+          }
+        ],
+        "sources": [
+          {
+            "fileName": "projects/indicators/src/testing/key-info/key-info-harness-filters.ts",
+            "line": 7,
+            "character": 17
+          }
+        ],
+        "extendedTypes": [
+          {
+            "type": "reference",
+            "name": "SkyHarnessFilters"
+          }
+        ]
+      },
+      {
+        "id": 591,
+        "name": "SkyLabelHarnessFilters",
+        "kind": 256,
+        "kindString": "Interface",
+        "flags": {},
+        "comment": {
+          "shortText": "A set of criteria that can be used to filter a list of `SkyLabelHarness` instances."
+        },
+        "children": [
+          {
+            "id": 594,
+            "name": "ancestor",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances that are nested under an element with the given selector."
+            },
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 351,
+                "character": 4
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "string"
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.ancestor"
+            }
+          },
+          {
+            "id": 592,
+            "name": "dataSkyId",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances whose `data-sky-id` attribute matches the given value."
+            },
+            "sources": [
+              {
+                "fileName": "libs/components/core/testing/src/shared/harness-filters.ts",
+                "line": 11,
+                "character": 2
+              }
+            ],
+            "type": {
+              "type": "union",
+              "types": [
+                {
+                  "type": "intrinsic",
+                  "name": "string"
+                },
+                {
+                  "type": "reference",
+                  "qualifiedName": "RegExp",
+                  "package": "typescript",
+                  "name": "RegExp"
+                }
+              ]
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.dataSkyId"
+            }
+          },
+          {
+            "id": 593,
+            "name": "selector",
+            "kind": 1024,
+            "kindString": "Property",
+            "flags": {
+              "isOptional": true
+            },
+            "comment": {
+              "shortText": "Only find instances whose host element matches the given selector."
+            },
+            "sources": [
+              {
+                "fileName": "node_modules/@angular/cdk/testing/component-harness.d.ts",
+                "line": 349,
+                "character": 4
+              }
+            ],
+            "type": {
+              "type": "intrinsic",
+              "name": "string"
+            },
+            "inheritedFrom": {
+              "type": "reference",
+              "name": "SkyHarnessFilters.selector"
+            }
+          }
+        ],
+        "groups": [
+          {
+            "title": "Properties",
+            "kind": 1024,
+            "children": [
+              594,
+              592,
+              593
+            ]
+          }
+        ],
+        "sources": [
+          {
+            "fileName": "projects/indicators/src/testing/label/label-harness-filters.ts",
+            "line": 7,
+            "character": 17
+          }
+        ],
+        "extendedTypes": [
+          {
+            "type": "reference",
+            "name": "SkyHarnessFilters"
+          }
+        ]
+      }
+    ],
+    "groups": [
       {
         "title": "Modules",
         "kind": 2,
@@ -6701,12 +7843,17 @@
     {
       "fileName": "key-info-demo.component.html",
       "filePath": "/projects/indicators/documentation/code-examples/key-info/basic/key-info-demo.component.html",
-      "rawContents": "<sky-key-info [layout]=\"layout\">\n  <sky-key-info-value> 575 </sky-key-info-value>\n  <sky-key-info-label> New members </sky-key-info-label>\n</sky-key-info>\n"
+      "rawContents": "<sky-key-info [layout]=\"layout\" data-sky-id=\"key-info-demo\">\n  <sky-key-info-value>{{ value }}</sky-key-info-value>\n  <sky-key-info-label> New members </sky-key-info-label>\n</sky-key-info>\n"
+    },
+    {
+      "fileName": "key-info-demo.component.spec.ts",
+      "filePath": "/projects/indicators/documentation/code-examples/key-info/basic/key-info-demo.component.spec.ts",
+      "rawContents": "import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';\nimport { TestBed } from '@angular/core/testing';\nimport { SkyKeyInfoHarness } from '@skyux/indicators/testing';\n\nimport { KeyInfoDemoComponent } from './key-info-demo.component';\nimport { KeyInfoDemoModule } from './key-info-demo.module';\n\ndescribe('Basic key info', () => {\n  async function setupTest(options?: { value?: number }) {\n    const fixture = TestBed.createComponent(KeyInfoDemoComponent);\n\n    if (options?.value !== undefined) {\n      fixture.componentInstance.value = options.value;\n    }\n\n    const loader = TestbedHarnessEnvironment.loader(fixture);\n\n    const keyInfoHarness = await loader.getHarness(\n      SkyKeyInfoHarness.with({ dataSkyId: 'key-info-demo' })\n    );\n\n    return { keyInfoHarness, fixture };\n  }\n\n  beforeEach(() => {\n    TestBed.configureTestingModule({\n      imports: [KeyInfoDemoModule],\n    });\n  });\n\n  it('should display a vertical key info', async () => {\n    const { keyInfoHarness } = await setupTest({ value: 101 });\n\n    await expectAsync(keyInfoHarness.getLayout()).toBeResolvedTo('vertical');\n    await expectAsync(keyInfoHarness.getValueText()).toBeResolvedTo('101');\n    await expectAsync(keyInfoHarness.getLabelText()).toBeResolvedTo(\n      'New members'\n    );\n  });\n\n  it('should display a horizontal key info', async () => {\n    const { keyInfoHarness } = await setupTest({ value: 50 });\n\n    await expectAsync(keyInfoHarness.getLayout()).toBeResolvedTo('horizontal');\n    await expectAsync(keyInfoHarness.getValueText()).toBeResolvedTo('50');\n    await expectAsync(keyInfoHarness.getLabelText()).toBeResolvedTo(\n      'New members'\n    );\n  });\n});\n"
     },
     {
       "fileName": "key-info-demo.component.ts",
       "filePath": "/projects/indicators/documentation/code-examples/key-info/basic/key-info-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-key-info-demo',\n  templateUrl: './key-info-demo.component.html',\n})\nexport class KeyInfoDemoComponent {\n  public layout = 'vertical';\n}\n"
+      "rawContents": "import { Component, Input } from '@angular/core';\nimport { SkyKeyInfoLayoutType } from '@skyux/indicators';\n\n@Component({\n  selector: 'app-key-info-demo',\n  templateUrl: './key-info-demo.component.html',\n})\nexport class KeyInfoDemoComponent {\n  @Input()\n  public set value(value: number) {\n    this.#_value = value;\n    this.layout = this.#_value >= 100 ? 'vertical' : 'horizontal';\n  }\n\n  public get value(): number {\n    return this.#_value;\n  }\n\n  public layout: SkyKeyInfoLayoutType = 'vertical';\n\n  #_value: number | undefined;\n}\n"
     },
     {
       "fileName": "key-info-demo.module.ts",
@@ -6731,12 +7878,17 @@
     {
       "fileName": "label-demo.component.html",
       "filePath": "/projects/indicators/documentation/code-examples/label/basic/label-demo.component.html",
-      "rawContents": "<sky-label\n  class=\"sky-margin-inline-lg\"\n  labelType=\"info\"\n  descriptionType=\"important-info\"\n>\n  Board member\n</sky-label>\n\n<sky-label\n  class=\"sky-margin-inline-lg\"\n  labelType=\"success\"\n  descriptionType=\"success\"\n>\n  Approved\n</sky-label>\n\n<sky-label\n  class=\"sky-margin-inline-lg\"\n  labelType=\"warning\"\n  descriptionType=\"warning\"\n>\n  Needs approval\n</sky-label>\n\n<sky-label\n  class=\"sky-margin-inline-lg\"\n  labelType=\"danger\"\n  descriptionType=\"important-warning\"\n>\n  Overdue\n</sky-label>\n\n<sky-label\n  class=\"sky-margin-inline-lg\"\n  labelType=\"info\"\n  descriptionType=\"custom\"\n  customDescription=\"Fun fact:\"\n>\n  Custom screen reader description\n</sky-label>\n"
+      "rawContents": "<sky-label\n  data-sky-id=\"label-demo\"\n  [labelType]=\"labelType\"\n  [descriptionType]=\"descriptionType\"\n>\n  {{ labelText }}\n</sky-label>\n"
+    },
+    {
+      "fileName": "label-demo.component.spec.ts",
+      "filePath": "/projects/indicators/documentation/code-examples/label/basic/label-demo.component.spec.ts",
+      "rawContents": "import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';\nimport { TestBed } from '@angular/core/testing';\nimport { SkyLabelHarness } from '@skyux/indicators/testing';\n\nimport { LabelDemoComponent } from './label-demo.component';\nimport { LabelDemoModule } from './label-demo.module';\n\ndescribe('Basic label', () => {\n  async function setupTest(options?: {\n    daysUntilDue?: number;\n    submitted?: boolean;\n  }) {\n    const fixture = TestBed.createComponent(LabelDemoComponent);\n\n    if (options?.daysUntilDue !== undefined) {\n      fixture.componentInstance.daysUntilDue = options.daysUntilDue;\n    }\n\n    if (options?.submitted !== undefined) {\n      fixture.componentInstance.submitted = options.submitted;\n    }\n\n    const loader = TestbedHarnessEnvironment.loader(fixture);\n\n    const labelHarness = await loader.getHarness(\n      SkyLabelHarness.with({ dataSkyId: 'label-demo' })\n    );\n\n    return { labelHarness, fixture };\n  }\n\n  beforeEach(() => {\n    TestBed.configureTestingModule({\n      imports: [LabelDemoModule],\n    });\n  });\n\n  it('should show an info label when submitted is false and there is more than a week until due', async () => {\n    const { labelHarness, fixture } = await setupTest({ daysUntilDue: 8 });\n    fixture.detectChanges();\n\n    await expectAsync(labelHarness.getLabelType()).toBeResolvedTo('info');\n    await expectAsync(labelHarness.getDescriptionType()).toBeResolvedTo(\n      'attention'\n    );\n    await expectAsync(labelHarness.getLabelText()).toBeResolvedTo('Incomplete');\n  });\n\n  it('should show a warning label when submitted is false and there is less than a week until due', async () => {\n    const { labelHarness, fixture } = await setupTest({ daysUntilDue: 6 });\n    fixture.detectChanges();\n\n    await expectAsync(labelHarness.getLabelType()).toBeResolvedTo('warning');\n    await expectAsync(labelHarness.getDescriptionType()).toBeResolvedTo(\n      'important-warning'\n    );\n    await expectAsync(labelHarness.getLabelText()).toBeResolvedTo('Due soon');\n  });\n\n  it('should show a danger label when submitted is false and it is past due', async () => {\n    const { labelHarness, fixture } = await setupTest({ daysUntilDue: -1 });\n    fixture.detectChanges();\n\n    await expectAsync(labelHarness.getLabelType()).toBeResolvedTo('danger');\n    await expectAsync(labelHarness.getDescriptionType()).toBeResolvedTo(\n      'danger'\n    );\n    await expectAsync(labelHarness.getLabelText()).toBeResolvedTo('Overdue');\n  });\n\n  it('should show a success label when submitted is true', async () => {\n    const { labelHarness, fixture } = await setupTest({ submitted: true });\n    fixture.detectChanges();\n\n    await expectAsync(labelHarness.getLabelType()).toBeResolvedTo('success');\n    await expectAsync(labelHarness.getDescriptionType()).toBeResolvedTo(\n      'completed'\n    );\n    await expectAsync(labelHarness.getLabelText()).toBeResolvedTo('Submitted');\n  });\n});\n"
     },
     {
       "fileName": "label-demo.component.ts",
       "filePath": "/projects/indicators/documentation/code-examples/label/basic/label-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-label-demo',\n  templateUrl: './label-demo.component.html',\n})\nexport class LabelDemoComponent {}\n"
+      "rawContents": "import { Component, Input } from '@angular/core';\nimport { SkyIndicatorDescriptionType, SkyLabelType } from '@skyux/indicators';\n\n@Component({\n  selector: 'app-label-demo',\n  templateUrl: './label-demo.component.html',\n})\nexport class LabelDemoComponent {\n  @Input()\n  public get daysUntilDue(): number {\n    return this.#_daysUntilDue;\n  }\n\n  public set daysUntilDue(days: number) {\n    this.#_daysUntilDue = days;\n    this.updateLabelProperties(this.submitted, days);\n  }\n\n  @Input()\n  public get submitted(): boolean {\n    return this.#_submitted;\n  }\n\n  public set submitted(submitted: boolean) {\n    this.#_submitted = submitted;\n    this.updateLabelProperties(submitted, this.daysUntilDue);\n  }\n\n  public labelType: SkyLabelType = 'info';\n  public descriptionType: SkyIndicatorDescriptionType = 'attention';\n  public labelText = 'Incomplete';\n  public todaysDate = new Date('9/14/22');\n  #_daysUntilDue = 14;\n  #_submitted = false;\n\n  private updateLabelProperties(submitted: boolean, days: number) {\n    if (submitted) {\n      this.labelType = 'success';\n      this.descriptionType = 'completed';\n      this.labelText = 'Submitted';\n    } else if (days <= 0) {\n      this.labelType = 'danger';\n      this.descriptionType = 'danger';\n      this.labelText = 'Overdue';\n    } else if (days <= 7) {\n      this.labelType = 'warning';\n      this.descriptionType = 'important-warning';\n      this.labelText = 'Due soon';\n    } else {\n      this.labelType = 'info';\n      this.descriptionType = 'attention';\n      this.labelText = 'Incomplete';\n    }\n  }\n}\n"
     },
     {
       "fileName": "label-demo.module.ts",