@pnp/spfx-controls-react 3.26.0-beta.3528159 → 3.26.0-beta.3528624

package/release/analysis-logs/lint.sarif

@@ -147,24 +147,6 @@
                 "text": "Disallow using an async function as a Promise executor"
               }
             },
-            {
-              "id": "prefer-const",
-              "helpUri": "https://eslint.org/docs/latest/rules/prefer-const",
-              "properties": {},
-              "shortDescription": {
-                "text": "Require `const` declarations for variables that are never reassigned after declared"
-              }
-            },
-            {
-              "id": "react/self-closing-comp",
-              "helpUri": "https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/self-closing-comp.md",
-              "properties": {
-                "category": "Stylistic Issues"
-              },
-              "shortDescription": {
-                "text": "Disallow extra closing tags for components without children"
-              }
-            },
             {
               "id": "max-lines",
               "helpUri": "https://eslint.org/docs/latest/rules/max-lines",
@@ -5356,16 +5338,19 @@
                   "startLine": 115,
                   "startColumn": 3,
                   "endLine": 125,
-                  "endColumn": 13,
-                  "snippet": {
-                    "text": "ReactDOM.render(\n    <ActionButton\n      text={title}\n      className={baseCssClass}\n      iconUrl={iconUrl}\n      iconPlacement={iconPlacement}\n      iconSize={iconSize}\n      actionClickHandler={actionClickHandler}\n      style={style}\n      theme={theme}\n    />, div)"
-                  }
+                  "endColumn": 13
                 }
               }
             }
           ],
           "ruleId": "@rushstack/pair-react-dom-render-unmount",
-          "ruleIndex": 3
+          "ruleIndex": 3,
+          "suppressions": [
+            {
+              "kind": "inSource",
+              "justification": ""
+            }
+          ]
         },
         {
           "level": "warning",
@@ -5383,17 +5368,19 @@
                   "startLine": 26,
                   "startColumn": 3,
                   "endLine": 26,
-                  "endColumn": 38,
-                  "snippet": {
-                    "text": "ReactDOM.render(renderReact(), div)"
-                  }
+                  "endColumn": 38
                 }
               }
             }
           ],
           "ruleId": "@rushstack/pair-react-dom-render-unmount",
           "ruleIndex": 3,
-          "suppressions": []
+          "suppressions": [
+            {
+              "kind": "inSource",
+              "justification": ""
+            }
+          ]
         },
         {
           "level": "warning",
@@ -5411,10 +5398,7 @@
                   "startLine": 101,
                   "startColumn": 39,
                   "endLine": 101,
-                  "endColumn": 42,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 42
                 }
               }
             }
@@ -5444,10 +5428,7 @@
                   "startLine": 101,
                   "startColumn": 52,
                   "endLine": 101,
-                  "endColumn": 55,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 55
                 }
               }
             }
@@ -5477,10 +5458,7 @@
                   "startLine": 639,
                   "startColumn": 14,
                   "endLine": 639,
-                  "endColumn": 41,
-                  "snippet": {
-                    "text": "new RegExp(this.regex, \"g\")"
-                  }
+                  "endColumn": 41
                 }
               }
             }
@@ -7704,10 +7682,7 @@
                   "startLine": 139,
                   "startColumn": 21,
                   "endLine": 139,
-                  "endColumn": 24,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 24
                 }
               }
             }
@@ -7737,10 +7712,7 @@
                   "startLine": 140,
                   "startColumn": 25,
                   "endLine": 140,
-                  "endColumn": 28,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 28
                 }
               }
             }
@@ -7991,33 +7963,6 @@
             }
           ]
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'IdPrefixProvider' is defined but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/controls/DetailsList/DetailsList.tsx",
-                  "index": 221
-                },
-                "region": {
-                  "startLine": 2,
-                  "startColumn": 10,
-                  "endLine": 2,
-                  "endColumn": 26,
-                  "snippet": {
-                    "text": "IdPrefixProvider"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5
-        },
         {
           "level": "warning",
           "message": {
@@ -8814,10 +8759,7 @@
                   "startLine": 37,
                   "startColumn": 17,
                   "endLine": 37,
-                  "endColumn": 20,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 20
                 }
               }
             }
@@ -8847,10 +8789,7 @@
                   "startLine": 40,
                   "startColumn": 11,
                   "endLine": 40,
-                  "endColumn": 14,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 14
                 }
               }
             }
@@ -8880,10 +8819,7 @@
                   "startLine": 45,
                   "startColumn": 15,
                   "endLine": 45,
-                  "endColumn": 18,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 18
                 }
               }
             }
@@ -8913,10 +8849,7 @@
                   "startLine": 51,
                   "startColumn": 14,
                   "endLine": 51,
-                  "endColumn": 17,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 17
                 }
               }
             }
@@ -8946,10 +8879,7 @@
                   "startLine": 54,
                   "startColumn": 16,
                   "endLine": 54,
-                  "endColumn": 19,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 19
                 }
               }
             }
@@ -8979,10 +8909,7 @@
                   "startLine": 57,
                   "startColumn": 38,
                   "endLine": 57,
-                  "endColumn": 41,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 41
                 }
               }
             }
@@ -9462,10 +9389,7 @@
                   "startLine": 16,
                   "startColumn": 21,
                   "endLine": 16,
-                  "endColumn": 24,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 24
                 }
               }
             }
@@ -9495,10 +9419,7 @@
                   "startLine": 266,
                   "startColumn": 31,
                   "endLine": 266,
-                  "endColumn": 34,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 34
                 }
               }
             }
@@ -9528,10 +9449,7 @@
                   "startLine": 285,
                   "startColumn": 41,
                   "endLine": 285,
-                  "endColumn": 44,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 44
                 }
               }
             }
@@ -9561,10 +9479,7 @@
                   "startLine": 286,
                   "startColumn": 44,
                   "endLine": 286,
-                  "endColumn": 61,
-                  "snippet": {
-                    "text": "\"MeetingLocation\""
-                  }
+                  "endColumn": 61
                 }
               }
             }
@@ -9594,10 +9509,7 @@
                   "startLine": 287,
                   "startColumn": 63,
                   "endLine": 287,
-                  "endColumn": 76,
-                  "snippet": {
-                    "text": "\"DisplayName\""
-                  }
+                  "endColumn": 76
                 }
               }
             }
@@ -10377,10 +10289,7 @@
                   "startLine": 81,
                   "startColumn": 64,
                   "endLine": 81,
-                  "endColumn": 67,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 67
                 }
               }
             }
@@ -10410,10 +10319,7 @@
                   "startLine": 168,
                   "startColumn": 64,
                   "endLine": 168,
-                  "endColumn": 67,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 67
                 }
               }
             }
@@ -10443,10 +10349,7 @@
                   "startLine": 412,
                   "startColumn": 68,
                   "endLine": 412,
-                  "endColumn": 71,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 71
                 }
               }
             }
@@ -10476,10 +10379,7 @@
                   "startLine": 20,
                   "startColumn": 49,
                   "endLine": 20,
-                  "endColumn": 52,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 52
                 }
               }
             }
@@ -10509,10 +10409,7 @@
                   "startLine": 194,
                   "startColumn": 35,
                   "endLine": 194,
-                  "endColumn": 38,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 38
                 }
               }
             }
@@ -10542,10 +10439,7 @@
                   "startLine": 194,
                   "startColumn": 41,
                   "endLine": 194,
-                  "endColumn": 44,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 44
                 }
               }
             }
@@ -10575,10 +10469,7 @@
                   "startLine": 219,
                   "startColumn": 33,
                   "endLine": 219,
-                  "endColumn": 40,
-                  "snippet": {
-                    "text": "'input'"
-                  }
+                  "endColumn": 40
                 }
               }
             }
@@ -10608,10 +10499,7 @@
                   "startLine": 221,
                   "startColumn": 22,
                   "endLine": 221,
-                  "endColumn": 25,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 25
                 }
               }
             }
@@ -10641,10 +10529,7 @@
                   "startLine": 242,
                   "startColumn": 24,
                   "endLine": 242,
-                  "endColumn": 27,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 27
                 }
               }
             }
@@ -10791,13 +10676,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 580,
+                  "startLine": 579,
                   "startColumn": 39,
-                  "endLine": 580,
-                  "endColumn": 42,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 579,
+                  "endColumn": 42
                 }
               }
             }
@@ -10824,13 +10706,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 623,
+                  "startLine": 622,
                   "startColumn": 39,
-                  "endLine": 623,
-                  "endColumn": 42,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 622,
+                  "endColumn": 42
                 }
               }
             }
@@ -10857,13 +10736,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 717,
+                  "startLine": 716,
                   "startColumn": 30,
-                  "endLine": 717,
-                  "endColumn": 33,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 716,
+                  "endColumn": 33
                 }
               }
             }
@@ -10890,13 +10766,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 796,
+                  "startLine": 795,
                   "startColumn": 113,
-                  "endLine": 796,
-                  "endColumn": 116,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 795,
+                  "endColumn": 116
                 }
               }
             }
@@ -10923,13 +10796,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 797,
+                  "startLine": 796,
                   "startColumn": 113,
-                  "endLine": 797,
-                  "endColumn": 116,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 796,
+                  "endColumn": 116
                 }
               }
             }
@@ -10956,13 +10826,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 833,
+                  "startLine": 832,
                   "startColumn": 28,
-                  "endLine": 833,
-                  "endColumn": 31,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 832,
+                  "endColumn": 31
                 }
               }
             }
@@ -10989,13 +10856,10 @@
                   "index": 353
                 },
                 "region": {
-                  "startLine": 837,
+                  "startLine": 836,
                   "startColumn": 33,
-                  "endLine": 837,
-                  "endColumn": 36,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 836,
+                  "endColumn": 36
                 }
               }
             }
@@ -11262,10 +11126,7 @@
                   "startLine": 131,
                   "startColumn": 31,
                   "endLine": 131,
-                  "endColumn": 34,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 34
                 }
               }
             }
@@ -11295,10 +11156,7 @@
                   "startLine": 673,
                   "startColumn": 25,
                   "endLine": 673,
-                  "endColumn": 28,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 28
                 }
               }
             }
@@ -11328,10 +11186,7 @@
                   "startLine": 797,
                   "startColumn": 15,
                   "endLine": 797,
-                  "endColumn": 18,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 18
                 }
               }
             }
@@ -11361,10 +11216,7 @@
                   "startLine": 1033,
                   "startColumn": 138,
                   "endLine": 1033,
-                  "endColumn": 141,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 141
                 }
               }
             }
@@ -11394,10 +11246,7 @@
                   "startLine": 1160,
                   "startColumn": 120,
                   "endLine": 1160,
-                  "endColumn": 123,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 123
                 }
               }
             }
@@ -11427,10 +11276,7 @@
                   "startLine": 1193,
                   "startColumn": 31,
                   "endLine": 1193,
-                  "endColumn": 34,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 34
                 }
               }
             }
@@ -11460,10 +11306,7 @@
                   "startLine": 1543,
                   "startColumn": 63,
                   "endLine": 1543,
-                  "endColumn": 66,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 66
                 }
               }
             }
@@ -11493,10 +11336,7 @@
                   "startLine": 1543,
                   "startColumn": 75,
                   "endLine": 1543,
-                  "endColumn": 78,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 78
                 }
               }
             }
@@ -11526,10 +11366,7 @@
                   "startLine": 1549,
                   "startColumn": 37,
                   "endLine": 1549,
-                  "endColumn": 40,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 40
                 }
               }
             }
@@ -11559,10 +11396,7 @@
                   "startLine": 1740,
                   "startColumn": 37,
                   "endLine": 1740,
-                  "endColumn": 40,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 40
                 }
               }
             }
@@ -12192,10 +12026,7 @@
                   "startLine": 23,
                   "startColumn": 22,
                   "endLine": 23,
-                  "endColumn": 25,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 25
                 }
               }
             }
@@ -12225,10 +12056,7 @@
                   "startLine": 59,
                   "startColumn": 53,
                   "endLine": 59,
-                  "endColumn": 56,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 56
                 }
               }
             }
@@ -12258,10 +12086,7 @@
                   "startLine": 177,
                   "startColumn": 45,
                   "endLine": 177,
-                  "endColumn": 48,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 48
                 }
               }
             }
@@ -12291,10 +12116,7 @@
                   "startLine": 195,
                   "startColumn": 44,
                   "endLine": 195,
-                  "endColumn": 47,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 47
                 }
               }
             }
@@ -12324,10 +12146,7 @@
                   "startLine": 208,
                   "startColumn": 28,
                   "endLine": 208,
-                  "endColumn": 31,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 31
                 }
               }
             }
@@ -12357,10 +12176,7 @@
                   "startLine": 283,
                   "startColumn": 74,
                   "endLine": 283,
-                  "endColumn": 77,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 77
                 }
               }
             }
@@ -12390,10 +12206,7 @@
                   "startLine": 319,
                   "startColumn": 77,
                   "endLine": 319,
-                  "endColumn": 80,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 80
                 }
               }
             }
@@ -12423,10 +12236,7 @@
                   "startLine": 319,
                   "startColumn": 88,
                   "endLine": 319,
-                  "endColumn": 91,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 91
                 }
               }
             }
@@ -12456,10 +12266,7 @@
                   "startLine": 344,
                   "startColumn": 104,
                   "endLine": 344,
-                  "endColumn": 107,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 107
                 }
               }
             }
@@ -12489,10 +12296,7 @@
                   "startLine": 467,
                   "startColumn": 60,
                   "endLine": 467,
-                  "endColumn": 63,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 63
                 }
               }
             }
@@ -12522,10 +12326,7 @@
                   "startLine": 635,
                   "startColumn": 32,
                   "endLine": 635,
-                  "endColumn": 35,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 35
                 }
               }
             }
@@ -12555,10 +12356,7 @@
                   "startLine": 637,
                   "startColumn": 22,
                   "endLine": 637,
-                  "endColumn": 25,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 25
                 }
               }
             }
@@ -13998,10 +13796,7 @@
                   "startLine": 39,
                   "startColumn": 46,
                   "endLine": 39,
-                  "endColumn": 49,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 49
                 }
               }
             }
@@ -14031,10 +13826,7 @@
                   "startLine": 42,
                   "startColumn": 34,
                   "endLine": 42,
-                  "endColumn": 37,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 37
                 }
               }
             }
@@ -14214,10 +14006,7 @@
                   "startLine": 25,
                   "startColumn": 58,
                   "endLine": 25,
-                  "endColumn": 61,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 61
                 }
               }
             }
@@ -14247,10 +14036,7 @@
                   "startLine": 25,
                   "startColumn": 77,
                   "endLine": 25,
-                  "endColumn": 80,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 80
                 }
               }
             }
@@ -14280,10 +14066,7 @@
                   "startLine": 25,
                   "startColumn": 96,
                   "endLine": 25,
-                  "endColumn": 99,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 99
                 }
               }
             }
@@ -14313,10 +14096,7 @@
                   "startLine": 150,
                   "startColumn": 67,
                   "endLine": 150,
-                  "endColumn": 70,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 70
                 }
               }
             }
@@ -14346,10 +14126,7 @@
                   "startLine": 168,
                   "startColumn": 17,
                   "endLine": 168,
-                  "endColumn": 20,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 20
                 }
               }
             }
@@ -14357,10 +14134,6 @@
           "ruleId": "@typescript-eslint/no-explicit-any",
           "ruleIndex": 0,
           "suppressions": [
-            {
-              "kind": "inSource",
-              "justification": ""
-            },
             {
               "kind": "inSource",
               "justification": ""
@@ -14383,10 +14156,7 @@
                   "startLine": 230,
                   "startColumn": 14,
                   "endLine": 230,
-                  "endColumn": 17,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 17
                 }
               }
             }
@@ -14416,10 +14186,7 @@
                   "startLine": 274,
                   "startColumn": 41,
                   "endLine": 274,
-                  "endColumn": 44,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 44
                 }
               }
             }
@@ -14449,10 +14216,7 @@
                   "startLine": 274,
                   "startColumn": 60,
                   "endLine": 274,
-                  "endColumn": 63,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 63
                 }
               }
             }
@@ -14482,10 +14246,7 @@
                   "startLine": 274,
                   "startColumn": 79,
                   "endLine": 274,
-                  "endColumn": 82,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 82
                 }
               }
             }
@@ -14635,10 +14396,7 @@
                   "startLine": 11,
                   "startColumn": 62,
                   "endLine": 11,
-                  "endColumn": 64,
-                  "snippet": {
-                    "text": "=>"
-                  }
+                  "endColumn": 64
                 }
               }
             }
@@ -14668,10 +14426,7 @@
                   "startLine": 14,
                   "startColumn": 58,
                   "endLine": 14,
-                  "endColumn": 61,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 61
                 }
               }
             }
@@ -14701,10 +14456,7 @@
                   "startLine": 35,
                   "startColumn": 19,
                   "endLine": 35,
-                  "endColumn": 22,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 22
                 }
               }
             }
@@ -14734,10 +14486,7 @@
                   "startLine": 72,
                   "startColumn": 5,
                   "endLine": 112,
-                  "endColumn": 10,
-                  "snippet": {
-                    "text": "(async () => {\n      try {\n        const assetLibraryInfo = await getSiteAssetsLibrary(appGlobalState.context.pageContext.site.absoluteUrl);\n        const { id: libraryId, parentReference } = assetLibraryInfo;\n        const { siteId } = parentReference;\n        const rs: IUploadFileResult = await uploadFile(file, UPLOAD_FOLDER_NAME, siteId, libraryId, uploadLocation);\n\n        const fileSearchResult: ISearchImagesResult = {\n          driveId: rs.parentReference.driveId,\n          title: rs.name,\n          path: rs.parentReference.path,\n          filename: rs.name,\n          siteID: rs.parentReference.siteId,\n          fileType: rs.file.mimeType,\n          spWebUrl: rs.webUrl,\n          id: rs.id,\n          modifiedBy: rs.lastModifiedBy.user.email,\n          lastModifiedTime: rs.lastModifiedDateTime,\n          fileExtension: rs.name.split(\".\").pop(),\n          created: \"\",\n          author: \"\",\n          editorOwsUser: \"\",\n          siteTitle: \"\",\n          parentLink: \"\",\n          listID: \"\",\n          listItemID: \"\",\n          spSiteURL: \"\",\n          webId: \"\",\n          uniqueID: \"\",\n          defaultEncodingURL: rs.webUrl,\n        };\n\n        setFileSearchResult(fileSearchResult);\n        setRetryUpload(false);\n      } catch (error) {\n        setErrorInfo({ origemFunction: \"uploadFile\", error: \"Uploaderror\" });\n        setFileSearchResult({} as ISearchImagesResult);\n        setRetryUpload(false);\n        console.error(\"[UploadFIle, File Upload Error]\", error);\n      }\n    })();"
-                  }
+                  "endColumn": 10
                 }
               }
             }
@@ -14827,10 +14576,7 @@
                   "startLine": 45,
                   "startColumn": 22,
                   "endLine": 45,
-                  "endColumn": 61,
-                  "snippet": {
-                    "text": "require('./constants/defaultImage.png')"
-                  }
+                  "endColumn": 61
                 }
               }
             }
@@ -14860,10 +14606,7 @@
                   "startLine": 70,
                   "startColumn": 20,
                   "endLine": 70,
-                  "endColumn": 31,
-                  "snippet": {
-                    "text": "setIsAdding"
-                  }
+                  "endColumn": 31
                 }
               }
             }
@@ -14893,10 +14636,7 @@
                   "startLine": 91,
                   "startColumn": 10,
                   "endLine": 91,
-                  "endColumn": 23,
-                  "snippet": {
-                    "text": "isInitialized"
-                  }
+                  "endColumn": 23
                 }
               }
             }
@@ -14926,10 +14666,7 @@
                   "startLine": 139,
                   "startColumn": 7,
                   "endLine": 139,
-                  "endColumn": 42,
-                  "snippet": {
-                    "text": "refHasMore.current = hasMoreResults"
-                  }
+                  "endColumn": 42
                 }
               }
             }
@@ -14959,10 +14696,7 @@
                   "startLine": 147,
                   "startColumn": 5,
                   "endLine": 166,
-                  "endColumn": 10,
-                  "snippet": {
-                    "text": "(async () => {\n      if (!context || source === SOURCE_STOCK || source === SOURCE_UPLOAD)\n        return;\n      setIsLoading(true);\n      setSelectedImage(null);\n      refStart.current = 0;\n      try {\n        const results = await searchImages(\n          `(${queryExtensions}) ${source}`,\n          refStart.current\n        );\n        const { fields, hasMoreResults } = results;\n        refHasMore.current = hasMoreResults;\n        setSearchResults(fields);\n      } catch (error) {\n        console.error('[useEffect] error:', error);\n      } finally {\n        setIsLoading(false);\n      }\n    })();"
-                  }
+                  "endColumn": 10
                 }
               }
             }
@@ -14992,10 +14726,7 @@
                   "startLine": 240,
                   "startColumn": 9,
                   "endLine": 240,
-                  "endColumn": 36,
-                  "snippet": {
-                    "text": "isScrolling.current = false"
-                  }
+                  "endColumn": 36
                 }
               }
             }
@@ -15325,10 +15056,7 @@
                   "startLine": 24,
                   "startColumn": 29,
                   "endLine": 24,
-                  "endColumn": 32,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 32
                 }
               }
             }
@@ -15358,10 +15086,7 @@
                   "startLine": 25,
                   "startColumn": 18,
                   "endLine": 25,
-                  "endColumn": 21,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 21
                 }
               }
             }
@@ -17221,10 +16946,7 @@
                   "startLine": 19,
                   "startColumn": 121,
                   "endLine": 19,
-                  "endColumn": 123,
-                  "snippet": {
-                    "text": "=>"
-                  }
+                  "endColumn": 123
                 }
               }
             }
@@ -17232,10 +16954,6 @@
           "ruleId": "@typescript-eslint/explicit-function-return-type",
           "ruleIndex": 9,
           "suppressions": [
-            {
-              "kind": "inSource",
-              "justification": ""
-            },
             {
               "kind": "inSource",
               "justification": ""
@@ -17528,10 +17246,7 @@
                   "startLine": 17,
                   "startColumn": 38,
                   "endLine": 17,
-                  "endColumn": 41,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 41
                 }
               }
             }
@@ -17561,10 +17276,7 @@
                   "startLine": 22,
                   "startColumn": 60,
                   "endLine": 22,
-                  "endColumn": 63,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 63
                 }
               }
             }
@@ -18014,10 +17726,7 @@
                   "startLine": 18,
                   "startColumn": 41,
                   "endLine": 18,
-                  "endColumn": 43,
-                  "snippet": {
-                    "text": "=>"
-                  }
+                  "endColumn": 43
                 }
               }
             }
@@ -18734,13 +18443,10 @@
                   "index": 783
                 },
                 "region": {
-                  "startLine": 36,
+                  "startLine": 35,
                   "startColumn": 25,
-                  "endLine": 36,
-                  "endColumn": 28,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 35,
+                  "endColumn": 28
                 }
               }
             }
@@ -18767,13 +18473,10 @@
                   "index": 783
                 },
                 "region": {
-                  "startLine": 90,
+                  "startLine": 89,
                   "startColumn": 29,
-                  "endLine": 90,
-                  "endColumn": 32,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 89,
+                  "endColumn": 32
                 }
               }
             }
@@ -18800,13 +18503,10 @@
                   "index": 783
                 },
                 "region": {
-                  "startLine": 96,
+                  "startLine": 95,
                   "startColumn": 24,
-                  "endLine": 96,
-                  "endColumn": 27,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 95,
+                  "endColumn": 27
                 }
               }
             }
@@ -18833,13 +18533,10 @@
                   "index": 783
                 },
                 "region": {
-                  "startLine": 106,
+                  "startLine": 105,
                   "startColumn": 58,
-                  "endLine": 106,
-                  "endColumn": 61,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 105,
+                  "endColumn": 61
                 }
               }
             }
@@ -18866,13 +18563,10 @@
                   "index": 783
                 },
                 "region": {
-                  "startLine": 114,
+                  "startLine": 113,
                   "startColumn": 61,
-                  "endLine": 114,
-                  "endColumn": 64,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 113,
+                  "endColumn": 64
                 }
               }
             }
@@ -18899,13 +18593,10 @@
                   "index": 783
                 },
                 "region": {
-                  "startLine": 132,
+                  "startLine": 131,
                   "startColumn": 25,
-                  "endLine": 132,
-                  "endColumn": 28,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endLine": 131,
+                  "endColumn": 28
                 }
               }
             }
@@ -19175,10 +18866,7 @@
                   "startLine": 87,
                   "startColumn": 9,
                   "endLine": 91,
-                  "endColumn": 12,
-                  "snippet": {
-                    "text": "getUserPresence(user?.id || \"\").then((presence) => {\n          userPresence = presence as Presence;\n          user = { ...user, presence: userPresence } as IUserInfo;\n          setUser(user);\n        });"
-                  }
+                  "endColumn": 12
                 }
               }
             }
@@ -19208,10 +18896,7 @@
                   "startLine": 102,
                   "startColumn": 5,
                   "endLine": 107,
-                  "endColumn": 10,
-                  "snippet": {
-                    "text": "(async () => {\n      await checkUserPresence();\n      setInterval(async () => {\n        await checkUserPresence();\n      }, 60000);\n    })();"
-                  }
+                  "endColumn": 10
                 }
               }
             }
@@ -19241,10 +18926,7 @@
                   "startLine": 139,
                   "startColumn": 49,
                   "endLine": 139,
-                  "endColumn": 52,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 52
                 }
               }
             }
@@ -19274,10 +18956,7 @@
                   "startLine": 161,
                   "startColumn": 57,
                   "endLine": 161,
-                  "endColumn": 60,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 60
                 }
               }
             }
@@ -19457,10 +19136,7 @@
                   "startLine": 33,
                   "startColumn": 22,
                   "endLine": 33,
-                  "endColumn": 24,
-                  "snippet": {
-                    "text": "=>"
-                  }
+                  "endColumn": 24
                 }
               }
             }
@@ -19490,10 +19166,7 @@
                   "startLine": 34,
                   "startColumn": 5,
                   "endLine": 63,
-                  "endColumn": 10,
-                  "snippet": {
-                    "text": "(async () => {\n      try {\n        if (has(context, \"sdks.microsoftTeams.teamsJs.app.getContext\")) {\n          const teamsContext = await (context as WebPartContext).sdks.microsoftTeams?.teamsJs.app.getContext();\n          const teamsTheme = teamsContext.app.theme || \"default\";\n          switch (teamsTheme) {\n            case \"dark\":\n              setTheme(teamsDarkTheme);\n              break;\n            case \"contrast\":\n              setTheme(teamsHighContrastTheme);\n              break;\n            case \"default\":\n              setTheme(teamsLightTheme);\n              break;\n            default:\n              setTheme(teamsLightTheme);\n              break;\n          }\n        } else if (themeV8 || currentSPTheme) {\n          setTheme(createV9Theme(themeV8 ?? currentSPTheme));\n        } else {\n          setTheme(teamsLightTheme);\n        }\n      } catch (error) {\n        console.warn(\"ListToolbar: Failed to resolve theme, using default\", error);\n        setTheme(teamsLightTheme);\n      }\n      setIsInitialized(true);\n    })();"
-                  }
+                  "endColumn": 10
                 }
               }
             }
@@ -19564,91 +19237,37 @@
         {
           "level": "warning",
           "message": {
-            "text": "'strings' is defined but never used."
+            "text": "Unexpected any. Specify a different type."
           },
           "locations": [
             {
               "physicalLocation": {
                 "artifactLocation": {
-                  "uri": "src/extensions/ootbFields/OotbFieldsFieldCustomizer.ts",
-                  "index": 866
+                  "uri": "src/extensions/testForm/components/TestForm.tsx",
+                  "index": 869
                 },
                 "region": {
-                  "startLine": 10,
-                  "startColumn": 13,
-                  "endLine": 10,
-                  "endColumn": 20,
-                  "snippet": {
-                    "text": "strings"
-                  }
+                  "startLine": 44,
+                  "startColumn": 50,
+                  "endLine": 44,
+                  "endColumn": 53
                 }
               }
             }
           ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5
+          "ruleId": "@typescript-eslint/no-explicit-any",
+          "ruleIndex": 0,
+          "suppressions": [
+            {
+              "kind": "inSource",
+              "justification": ""
+            }
+          ]
         },
         {
           "level": "warning",
           "message": {
-            "text": "'IOotbFieldsProps' is defined but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/extensions/ootbFields/OotbFieldsFieldCustomizer.ts",
-                  "index": 866
-                },
-                "region": {
-                  "startLine": 11,
-                  "startColumn": 22,
-                  "endLine": 11,
-                  "endColumn": 38,
-                  "snippet": {
-                    "text": "IOotbFieldsProps"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Unexpected any. Specify a different type."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/extensions/testForm/components/TestForm.tsx",
-                  "index": 869
-                },
-                "region": {
-                  "startLine": 44,
-                  "startColumn": 50,
-                  "endLine": 44,
-                  "endColumn": 53
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-explicit-any",
-          "ruleIndex": 0,
-          "suppressions": [
-            {
-              "kind": "inSource",
-              "justification": ""
-            }
-          ]
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Unexpected any. Specify a different type."
+            "text": "Unexpected any. Specify a different type."
           },
           "locations": [
             {
@@ -21890,33 +21509,6 @@
             }
           ]
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'Title1' is defined but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/TestControl.tsx",
-                  "index": 913
-                },
-                "region": {
-                  "startLine": 8,
-                  "startColumn": 3,
-                  "endLine": 8,
-                  "endColumn": 9,
-                  "snippet": {
-                    "text": "Title1"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5
-        },
         {
           "level": "warning",
           "message": {
@@ -21930,9 +21522,9 @@
                   "index": 913
                 },
                 "region": {
-                  "startLine": 48,
+                  "startLine": 45,
                   "startColumn": 17,
-                  "endLine": 48,
+                  "endLine": 45,
                   "endColumn": 20,
                   "snippet": {
                     "text": "any"
@@ -21944,115 +21536,6 @@
           "ruleId": "@typescript-eslint/no-explicit-any",
           "ruleIndex": 0
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'context' is assigned a value but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/TestControl.tsx",
-                  "index": 913
-                },
-                "region": {
-                  "startLine": 54,
-                  "startColumn": 25,
-                  "endLine": 54,
-                  "endColumn": 32,
-                  "snippet": {
-                    "text": "context"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'onSelectedUsers' is assigned a value but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/TestControl.tsx",
-                  "index": 913
-                },
-                "region": {
-                  "startLine": 62,
-                  "startColumn": 9,
-                  "endLine": 62,
-                  "endColumn": 24,
-                  "snippet": {
-                    "text": "onSelectedUsers"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Missing return type on function."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/TestControl.tsx",
-                  "index": 913
-                },
-                "region": {
-                  "startLine": 62,
-                  "startColumn": 48,
-                  "endLine": 62,
-                  "endColumn": 50,
-                  "snippet": {
-                    "text": "=>"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/explicit-function-return-type",
-          "ruleIndex": 9
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'IWidgetLink' is defined but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 166,
-                  "startColumn": 3,
-                  "endLine": 166,
-                  "endColumn": 14,
-                  "snippet": {
-                    "text": "IWidgetLink"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5,
-          "suppressions": []
-        },
         {
           "level": "warning",
           "message": {
@@ -22066,9 +21549,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 325,
+                  "startLine": 324,
                   "startColumn": 23,
-                  "endLine": 325,
+                  "endLine": 324,
                   "endColumn": 26,
                   "snippet": {
                     "text": "any"
@@ -22094,9 +21577,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 483,
+                  "startLine": 482,
                   "startColumn": 3,
-                  "endLine": 483,
+                  "endLine": 482,
                   "endColumn": 31,
                   "snippet": {
                     "text": "private onSelectedChannel = "
@@ -22122,9 +21605,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 766,
+                  "startLine": 765,
                   "startColumn": 3,
-                  "endLine": 766,
+                  "endLine": 765,
                   "endColumn": 33,
                   "snippet": {
                     "text": "public async componentDidMount"
@@ -22150,9 +21633,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 772,
+                  "startLine": 771,
                   "startColumn": 42,
-                  "endLine": 772,
+                  "endLine": 771,
                   "endColumn": 45,
                   "snippet": {
                     "text": "any"
@@ -22178,9 +21661,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 793,
+                  "startLine": 792,
                   "startColumn": 121,
-                  "endLine": 793,
+                  "endLine": 792,
                   "endColumn": 124,
                   "snippet": {
                     "text": "any"
@@ -22193,34 +21676,6 @@
           "ruleIndex": 0,
           "suppressions": []
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'error' is defined but never used."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 800,
-                  "startColumn": 18,
-                  "endLine": 800,
-                  "endColumn": 23,
-                  "snippet": {
-                    "text": "error"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-unused-vars",
-          "ruleIndex": 5,
-          "suppressions": []
-        },
         {
           "level": "warning",
           "message": {
@@ -22234,9 +21689,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 824,
+                  "startLine": 823,
                   "startColumn": 3,
-                  "endLine": 824,
+                  "endLine": 823,
                   "endColumn": 23,
                   "snippet": {
                     "text": "private _onConfigure"
@@ -22262,9 +21717,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 832,
+                  "startLine": 831,
                   "startColumn": 3,
-                  "endLine": 832,
+                  "endLine": 831,
                   "endColumn": 24,
                   "snippet": {
                     "text": "private _getSelection"
@@ -22290,9 +21745,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 832,
+                  "startLine": 831,
                   "startColumn": 32,
-                  "endLine": 832,
+                  "endLine": 831,
                   "endColumn": 35,
                   "snippet": {
                     "text": "any"
@@ -22318,9 +21773,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 841,
+                  "startLine": 840,
                   "startColumn": 3,
-                  "endLine": 841,
+                  "endLine": 840,
                   "endColumn": 27,
                   "snippet": {
                     "text": "private _getDropFiles = "
@@ -22346,9 +21801,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 866,
+                  "startLine": 865,
                   "startColumn": 3,
-                  "endLine": 866,
+                  "endLine": 865,
                   "endColumn": 32,
                   "snippet": {
                     "text": "private _onTaxPickerChange = "
@@ -22374,9 +21829,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 878,
+                  "startLine": 877,
                   "startColumn": 3,
-                  "endLine": 878,
+                  "endLine": 877,
                   "endColumn": 37,
                   "snippet": {
                     "text": "private _onDateTimePickerChange = "
@@ -22402,9 +21857,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 887,
+                  "startLine": 886,
                   "startColumn": 3,
-                  "endLine": 887,
+                  "endLine": 886,
                   "endColumn": 32,
                   "snippet": {
                     "text": "private onListPickerChange = "
@@ -22430,9 +21885,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 898,
+                  "startLine": 897,
                   "startColumn": 3,
-                  "endLine": 898,
+                  "endLine": 897,
                   "endColumn": 32,
                   "snippet": {
                     "text": "private onViewPickerChange = "
@@ -22458,9 +21913,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 905,
+                  "startLine": 904,
                   "startColumn": 3,
-                  "endLine": 905,
+                  "endLine": 904,
                   "endColumn": 24,
                   "snippet": {
                     "text": "private deleteItem = "
@@ -22486,9 +21941,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 919,
+                  "startLine": 918,
                   "startColumn": 3,
-                  "endLine": 919,
+                  "endLine": 918,
                   "endColumn": 35,
                   "snippet": {
                     "text": "private _getPeoplePickerItems = "
@@ -22514,9 +21969,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 919,
+                  "startLine": 918,
                   "startColumn": 43,
-                  "endLine": 919,
+                  "endLine": 918,
                   "endColumn": 46,
                   "snippet": {
                     "text": "any"
@@ -22542,9 +21997,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 934,
+                  "startLine": 933,
                   "startColumn": 3,
-                  "endLine": 934,
+                  "endLine": 933,
                   "endColumn": 37,
                   "snippet": {
                     "text": "private listItemPickerDataSelected"
@@ -22570,9 +22025,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 934,
+                  "startLine": 933,
                   "startColumn": 44,
-                  "endLine": 934,
+                  "endLine": 933,
                   "endColumn": 47,
                   "snippet": {
                     "text": "any"
@@ -22598,9 +22053,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 938,
+                  "startLine": 937,
                   "startColumn": 3,
-                  "endLine": 938,
+                  "endLine": 937,
                   "endColumn": 25,
                   "snippet": {
                     "text": "private _startProgress"
@@ -22626,9 +22081,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 999,
+                  "startLine": 998,
                   "startColumn": 3,
-                  "endLine": 999,
+                  "endLine": 998,
                   "endColumn": 37,
                   "snippet": {
                     "text": "private _onFilePickerSave = async "
@@ -22654,9 +22109,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1012,
+                  "startLine": 1011,
                   "startColumn": 3,
-                  "endLine": 1012,
+                  "endLine": 1011,
                   "endColumn": 44,
                   "snippet": {
                     "text": "private onToolbarSelectedFiltersChange = "
@@ -22682,9 +22137,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1018,
+                  "startLine": 1017,
                   "startColumn": 3,
-                  "endLine": 1018,
+                  "endLine": 1017,
                   "endColumn": 33,
                   "snippet": {
                     "text": "private toggleToolbarFilter = "
@@ -22710,9 +22165,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1038,
+                  "startLine": 1037,
                   "startColumn": 3,
-                  "endLine": 1038,
+                  "endLine": 1037,
                   "endColumn": 23,
                   "snippet": {
                     "text": "private addFilter = "
@@ -22738,9 +22193,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1046,
+                  "startLine": 1045,
                   "startColumn": 3,
-                  "endLine": 1046,
+                  "endLine": 1045,
                   "endColumn": 28,
                   "snippet": {
                     "text": "private onClearFilters = "
@@ -22766,9 +22221,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1051,
+                  "startLine": 1050,
                   "startColumn": 3,
-                  "endLine": 1051,
+                  "endLine": 1050,
                   "endColumn": 28,
                   "snippet": {
                     "text": "private onRemoveFilter = "
@@ -22794,9 +22249,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1068,
+                  "startLine": 1067,
                   "startColumn": 38,
-                  "endLine": 1068,
+                  "endLine": 1067,
                   "endColumn": 41,
                   "snippet": {
                     "text": "any"
@@ -22812,7 +22267,7 @@
         {
           "level": "warning",
           "message": {
-            "text": "[\"Title\"] is better written in dot notation."
+            "text": "Unexpected any. Specify a different type."
           },
           "locations": [
             {
@@ -22822,19 +22277,19 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1119,
-                  "startColumn": 32,
-                  "endLine": 1119,
-                  "endColumn": 39,
+                  "startLine": 1163,
+                  "startColumn": 24,
+                  "endLine": 1163,
+                  "endColumn": 27,
                   "snippet": {
-                    "text": "\"Title\""
+                    "text": "any"
                   }
                 }
               }
             }
           ],
-          "ruleId": "dot-notation",
-          "ruleIndex": 12,
+          "ruleId": "@typescript-eslint/no-explicit-any",
+          "ruleIndex": 0,
           "suppressions": []
         },
         {
@@ -22850,10 +22305,10 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1164,
-                  "startColumn": 24,
-                  "endLine": 1164,
-                  "endColumn": 27,
+                  "startLine": 1188,
+                  "startColumn": 34,
+                  "endLine": 1188,
+                  "endColumn": 37,
                   "snippet": {
                     "text": "any"
                   }
@@ -22868,7 +22323,7 @@
         {
           "level": "warning",
           "message": {
-            "text": "[\"ServerRelativeUrl\"] is better written in dot notation."
+            "text": "Unexpected any. Specify a different type."
           },
           "locations": [
             {
@@ -22878,25 +22333,25 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1165,
-                  "startColumn": 32,
-                  "endLine": 1165,
-                  "endColumn": 51,
+                  "startLine": 1713,
+                  "startColumn": 51,
+                  "endLine": 1713,
+                  "endColumn": 54,
                   "snippet": {
-                    "text": "'ServerRelativeUrl'"
+                    "text": "any"
                   }
                 }
               }
             }
           ],
-          "ruleId": "dot-notation",
-          "ruleIndex": 12,
+          "ruleId": "@typescript-eslint/no-explicit-any",
+          "ruleIndex": 0,
           "suppressions": []
         },
         {
           "level": "warning",
           "message": {
-            "text": "Unexpected any. Specify a different type."
+            "text": "File has too many lines (3258). Maximum allowed is 2000."
           },
           "locations": [
             {
@@ -22906,25 +22361,25 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1189,
-                  "startColumn": 34,
-                  "endLine": 1189,
-                  "endColumn": 37,
+                  "startLine": 2001,
+                  "startColumn": 1,
+                  "endLine": 3259,
+                  "endColumn": 1,
                   "snippet": {
-                    "text": "any"
+                    "text": "            </div>\n          }\n          {controlVisibility.ListItemPicker &&\n            <div id=\"ListItemPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">List Item picker list data tester:\n\n                <ListItemPicker listId={'b1416fca-dc77-4198-a082-62a7657dcfa9'}\n                  columnInternalName=\"DateAndTime\"\n                  keyColumnInternalName=\"Id\"\n                  // filter={\"Title eq 'SPFx'\"}\n                  orderBy={'Title desc'}\n                  itemLimit={5}\n                  context={this.props.context}\n                  placeholder={'Select list items'}\n                  onSelectedItem={this.listItemPickerDataSelected} />\n\n              </div>\n            </div>\n          }\n          {controlVisibility.ListItemComments &&\n            <div id=\"ListItemCommentsDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">List Item Comments Tester\n                <ListItemComments webUrl='https://contoso.sharepoint.com/sites/ThePerspective'\n                  listId='6f151a33-a7af-4fae-b8c4-f2f04cbc690f'\n                  itemId={\"1\"}\n                  serviceScope={this.props.context.serviceScope}\n                  numberCommentsPerPage={10}\n                  label=\"ListItem Comments\"\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.ViewPicker &&\n            <div id=\"ViewPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">View picker tester:\n                <ViewPicker context={this.props.context}\n                  label=\"Select view(s)\"\n                  listId={\"9f3908cd-1e88-4ab3-ac42-08efbbd64ec9\"}\n                  placeholder={'Select list view(s)'}\n                  orderBy={1}\n                  multiSelect={true}\n                  onSelectionChanged={this.onViewPickerChange} />\n              </div>\n            </div>\n          }\n          {controlVisibility.FieldPicker &&\n            <div id=\"FieldPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">Field picker tester:\n                <FieldPicker\n                  context={this.props.context}\n                  label={'Select a field'}\n                  listId={this.state.selectedList}\n                  onSelectionChanged={(fields) => {\n                    console.log(fields);\n                  }}\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.IconPicker &&\n            <div id=\"IconPickerDiv\" className={styles.container}>\n              <div>Icon Picker</div>\n              <div>\n                <IconPicker\n                  renderOption=\"panel\"\n                  onSave={(value) => { console.log(value); }}\n                  currentIcon={'Warning'}\n                  buttonLabel=\"Icon Picker\" />\n              </div>\n              <IconPicker buttonLabel={'Icon'}\n                onChange={(iconName: string) => { console.log(iconName); }}\n                onCancel={() => { console.log(\"Panel closed\"); }}\n                onSave={(iconName: string) => { console.log(iconName); }} />\n            </div>\n          }\n          {controlVisibility.ComboBoxListItemPicker &&\n            <div id=\"ComboBoxListItemPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">ComboBoxListItemPicker:\n\n                <ComboBoxListItemPicker listId={this.state.comboBoxListItemPickerListId}\n                  columnInternalName='Title'\n                  keyColumnInternalName='Id'\n                  orderBy='Title desc'\n                  multiSelect={true}\n                  onSelectedItem={(data) => {\n                    console.log(`Item(s):`, data);\n                  }}\n                  defaultSelectedItems={this.state.comboBoxListItemPickerIds}\n                  webUrl={this.props.context.pageContext.web.absoluteUrl}\n                  spHttpClient={this.props.context.spHttpClient} />\n\n                <PrimaryButton text=\"Change List\" onClick={() => {\n                  this.setState({\n                    comboBoxListItemPickerListId: '71210430-8436-4962-a14d-5525475abd6b'\n                  });\n                }} />\n                <PrimaryButton text=\"Change default items\" onClick={() => {\n                  this.setState({\n                    comboBoxListItemPickerIds: [{ Id: 2, Title: '222' }]\n                  });\n                }} />\n\n              </div>\n            </div>\n          }\n          {controlVisibility.IFrameDialog &&\n            <div id=\"IFrameDialogDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">iframe dialog tester:\n                <PrimaryButton\n                  text=\"Open iframe Dialog\"\n                  onClick={() => { this.setState({ iFrameDialogOpened: true }); }} />\n                <IFrameDialog\n                  url={iframeUrl}\n                  iframeOnLoad={(iframe: any) => { console.log('iframe loaded'); }}\n                  hidden={!this.state.iFrameDialogOpened}\n                  onDismiss={() => { this.setState({ iFrameDialogOpened: false }); }}\n                  modalProps={{\n                    isBlocking: true,\n                    styles: {\n                      root: {\n                        backgroundColor: '#00ff00'\n                      },\n                      main: {\n                        backgroundColor: '#ff0000'\n                      }\n                    }\n                  }}\n                  dialogContentProps={{\n                    type: DialogType.close,\n                    showCloseButton: true\n                  }}\n                  width={'570px'}\n                  height={'315px'} />\n              </div>\n            </div>\n          }\n          {controlVisibility.IFramePanel &&\n            <div id=\"IFramePanelDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">iframe Panel tester:\n                <PrimaryButton\n                  text=\"Open iframe Panel\"\n                  onClick={() => { this.setState({ iFramePanelOpened: true }); }} />\n                <IFramePanel\n                  url={iframeUrl}\n                  type={PanelType.medium}\n                  //  height=\"300px\"\n                  headerText=\"iframe panel title\"\n                  closeButtonAriaLabel=\"Close\"\n                  isOpen={this.state.iFramePanelOpened}\n                  onDismiss={() => { this.setState({ iFramePanelOpened: false }); }}\n                  iframeOnLoad={(iframe: any) => { console.log('iframe loaded'); }}\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.ImagePicker &&\n            <div id=\"ImagePickerDiv\" className={styles.container}>\n              <ImagePicker\n                context={this.props.context}\n                onFileSelected={(file) => { console.log(file); this.setState({ selectedUrlImagePicker: file.fileAbsoluteUrl }); }}\n                onDeleteFile={() => { console.log('file deleted'); }}\n                selectedFileUrl={this.state.selectedUrlImagePicker}\n              />\n            </div>\n          }\n          {controlVisibility.FolderPicker &&\n            <div id=\"FolderPickerDiv\" className={styles.container}>\n              <FolderPicker context={this.props.context}\n                rootFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                onSelect={this._onFolderSelect}\n                label='Folder Picker'\n                required={true}\n                canCreateFolders={true}\n               />\n            </div>\n          }\n          <div id=\"FilterBarDiv\" className={styles.container} hidden={!controlVisibility.FilterBar}>\n            <FilterBar items={this.state.filters} inlineItemCount={3} onClearFilters={this.onClearFilters} onRemoveFilter={this.onRemoveFilter} />\n            <button onClick={this.addFilter}>Add new filter</button>\n          </div>\n          {controlVisibility.Carousel &&\n\n            <div id=\"CarouselDiv\" className={styles.container}>\n              <div>\n                <h3>Carousel with fixed elements:</h3>\n                <Carousel\n                  buttonsLocation={CarouselButtonsLocation.top}\n                  buttonsDisplay={CarouselButtonsDisplay.block}\n\n                  contentContainerStyles={styles.carouselContent}\n                  containerButtonsStyles={styles.carouselButtonsContainer}\n\n                  isInfinite={true}\n\n                  element={this.carouselElements}\n                  onMovePrevClicked={(index: number) => { console.log(`Prev button clicked: ${index}`); }}\n                />\n              </div>\n              <div>\n                <h3>Carousel with CarouselImage elements:</h3>\n                <Carousel\n                  buttonsLocation={CarouselButtonsLocation.center}\n                  buttonsDisplay={CarouselButtonsDisplay.buttonsOnly}\n\n                  contentContainerStyles={styles.carouselImageContent}\n                  //containerButtonsStyles={styles.carouselButtonsContainer}\n\n                  isInfinite={true}\n                  indicatorShape={CarouselIndicatorShape.circle}\n                  indicatorsDisplay={CarouselIndicatorsDisplay.block}\n                  pauseOnHover={true}\n\n                  element={[\n                    {\n                      imageSrc: 'https://images.unsplash.com/photo-1588614959060-4d144f28b207?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3078&q=80',\n                      title: 'Colosseum',\n                      description: 'This is Colosseum',\n                      url: 'https://en.wikipedia.org/wiki/Colosseum',\n                      showDetailsOnHover: true,\n                      imageFit: ImageFit.cover\n                    },\n                    {\n                      imageSrc: 'https://www.telegraph.co.uk/content/dam/science/2018/06/20/stonehenge-2326750_1920_trans%2B%2BZgEkZX3M936N5BQK4Va8RWtT0gK_6EfZT336f62EI5U.jpg',\n                      title: 'Stonehenge',\n                      description: 'This is Stonehendle',\n                      url: 'https://en.wikipedia.org/wiki/Stonehenge',\n                      showDetailsOnHover: true,\n                      imageFit: ImageFit.cover\n                    },\n                    {\n                      imageSrc: 'https://upload.wikimedia.org/wikipedia/commons/thumb/a/af/All_Gizah_Pyramids.jpg/2560px-All_Gizah_Pyramids.jpg',\n                      title: 'Pyramids of Giza',\n                      description: 'This are Pyramids of Giza (Egypt)',\n                      url: 'https://en.wikipedia.org/wiki/Egyptian_pyramids',\n                      showDetailsOnHover: true,\n                      imageFit: ImageFit.cover\n                    }\n                  ]}\n                  onMoveNextClicked={(index: number) => { console.log(`Next button clicked: ${index}`); }}\n                  onMovePrevClicked={(index: number) => { console.log(`Prev button clicked: ${index}`); }}\n                  rootStyles={mergeStyles({\n                    backgroundColor: '#C3C3C3'\n                  })}\n                />\n              </div>\n              <div>\n                <h3>Carousel with triggerPageElement:</h3>\n                <Carousel\n                  buttonsLocation={CarouselButtonsLocation.bottom}\n                  buttonsDisplay={CarouselButtonsDisplay.buttonsOnly}\n\n                  contentContainerStyles={styles.carouselContent}\n\n                  canMoveNext={this.state.canMoveNext}\n                  canMovePrev={this.state.canMovePrev}\n                  triggerPageEvent={this.triggerNextElement}\n                  element={this.state.currentCarouselElement}\n                />\n              </div>\n              <div>\n                <h3>Carousel with minimal configuration:</h3>\n                <Carousel\n                  element={this.carouselElements}\n                  contentHeight={200}\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.SiteBreadcrumb &&\n            <div id=\"SiteBreadcrumbDiv\" className={styles.container}>\n              <div className={styles.siteBreadcrumb}>\n                <SiteBreadcrumb context={this.props.context} />\n              </div>\n            </div>\n          }\n          {controlVisibility.FilePicker &&\n            <div id=\"FilePickerDiv\" className={styles.container}>\n              <div>\n                <h3>File Picker</h3>\n                <TextField\n                  label=\"Default SiteFileTab Folder\"\n                  onChange={debounce((ev, newVal) => { this.setState({ filePickerDefaultFolderAbsolutePath: newVal }); }, 500)}\n                  styles={{ root: { marginBottom: 10 } }}\n                />\n                <FilePicker\n                  bingAPIKey=\"<BING API KEY>\"\n                  //webAbsoluteUrl=\"https://023xn.sharepoint.com/sites/test1\"\n                  //defaultFolderAbsolutePath={\"https://aterentiev.sharepoint.com/sites/SPFxinTeamsDemo/Shared%20Documents/General\"}\n                  //accepts={[\".gif\", \".jpg\", \".jpeg\", \".bmp\", \".dib\", \".tif\", \".tiff\", \".ico\", \".png\", \".jxr\", \".svg\"]}\n                  buttonLabel=\"Add File\"\n                  buttonIconProps={{ iconName: 'Add', styles: { root: { fontSize: 42 } } }}\n                  onSave={this._onFilePickerSave}\n                  onChange={(filePickerResult: IFilePickerResult[]) => { console.log(filePickerResult); }}\n                  context={this.props.context}\n                  hideRecentTab={false}\n                  includePageLibraries={true}\n                  checkIfFileExists={false}\n                />\n                {\n                  this.state.filePickerResult &&\n                  <div>\n                    <div>\n                      FileName: {this.state.filePickerResult[0].fileName}\n                    </div>\n                    <div>\n                      File size: {GeneralHelper.formatBytes(this.state.filePickerResult[0].fileSize, 2)}\n                    </div>\n                  </div>\n                }\n              </div>\n\n              <div>\n                <h3>File Picker with target folder browser</h3>\n                <FilePicker\n                  bingAPIKey=\"<BING API KEY>\"\n                  //accepts={[\".gif\", \".jpg\", \".jpeg\", \".bmp\", \".dib\", \".tif\", \".tiff\", \".ico\", \".png\", \".jxr\", \".svg\"]}\n                  buttonLabel=\"Upload image\"\n                  buttonIcon=\"FileImage\"\n                  onSave={this._onFilePickerSave}\n                  onChange={(filePickerResult: IFilePickerResult[]) => { console.log(filePickerResult); }}\n                  context={this.props.context}\n                  hideRecentTab={false}\n                  renderCustomUploadTabContent={() => (\n                    <FolderExplorer context={this.props.context}\n                      rootFolder={this.rootFolder}\n                      defaultFolder={this.rootFolder}\n                      onSelect={this._onFolderSelect}\n                      canCreateFolders={true}\n                    />)}\n                />\n              </div>\n              <p><a href=\"javascript:;\" onClick={this.deleteItem}>Deletes second item</a></p>\n            </div>\n          }\n          {controlVisibility.Progress &&\n            <div id=\"ProgressDiv\" className={styles.container}>\n              <Progress title={'Progress Test'}\n                showOverallProgress={true}\n                showIndeterminateOverallProgress={false}\n                hideNotStartedActions={false}\n                actions={this.state.progressActions}\n                currentActionIndex={this.state.currentProgressActionIndex}\n                longRunningText={'This operation takes longer than expected'}\n                longRunningTextDisplayDelay={7000}\n                height={'350px'}\n                inProgressIconName={'ChromeBackMirrored'} />\n              <PrimaryButton text={'Start Progress'} onClick={this._startProgress} />\n            </div>\n          }\n          {controlVisibility.ProgressStepsIndicator &&\n            <div id=\"ProgressStepsIndicatorDiv\" className={styles.container}>\n              <ProgressStepsIndicator steps={this.progressSteps} currentStep={0} themeVariant={this.props.themeVariant} />\n            </div>\n          }\n          {controlVisibility.Toast &&\n            <div id=\"ToastDiv\" className={styles.container}>\n              <h3>Toast</h3>\n              <Toast\n                title=\"Decision saved\"\n                body=\"This native Fluent UI toast will dismiss after five seconds.\"\n                subtitle=\"Controls Test\"\n                intent=\"success\"\n                dismissible\n                autoDismiss\n                duration={5}\n                durationUnit=\"seconds\"\n              />\n            </div>\n          }\n          {controlVisibility.GridLayout &&\n            <div id=\"GridLayoutDiv\" className={styles.container}>\n              <div className=\"ms-font-l\">Grid Layout</div>\n              <GridLayout\n                ariaLabel={\"List of content, use right and left arrow keys to navigate, arrow down to access details.\"}\n                items={sampleGridData}\n                onRenderGridItem={(item: any, finalSize: ISize, isCompact: boolean) => this._onRenderGridItem(item, finalSize, isCompact)}\n                itemMinWidth={250}\n                itemMaxWidth={600}\n                itemPadding={60}\n                //compactThreshold={220}\n                //rowsPerPage={1}\n                />\n            </div>\n          }\n          {controlVisibility.HoverReactionsBar &&\n            <div ref={this.divRefAddReaction} id=\"HoverReactionsBarDiv\" className={styles.container}>\n              <PrimaryButton text=\"Open HoverReactionsBar\" onClick={() => { this.setState({ isOpenHoverReactionBar: true }); }} />\n              <HoverReactionsBar\n                isOpen={this.state.isOpenHoverReactionBar}\n                onSelect={(emoji, emojiInfo) => { console.log(emoji); }}\n                onDismiss={(): void => {\n                  this.setState({ isOpenHoverReactionBar: false });\n                }}\n                target={this.divRefAddReaction.current as HTMLDivElement} />\n            </div>\n          }\n          {controlVisibility.FolderExplorer &&\n            <div id=\"FolderExplorerDiv\" className={styles.container}>\n              <FolderExplorer\n                context={this.props.context}\n                rootFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                defaultFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                onSelect={this._onFolderSelect}\n                canCreateFolders={true}\n                orderby='Name' //'ListItemAllFields/Created'\n                orderAscending={true}\n                showFiles={true}\n                onFileClick={this._onFileClick}\n              />\n            </div>\n          }\n          {controlVisibility.TreeView &&\n            <div id=\"TreeViewDiv\" className={styles.container}>\n              <h3>Tree View</h3>\n              <TreeView items={this.treeitems}\n                defaultExpanded={false}\n                selectionMode={TreeViewSelectionMode.Multiple}\n                showCheckboxes={true}\n                treeItemActionsDisplayMode={TreeItemActionsDisplayMode.ContextualMenu}\n                defaultSelectedKeys={this.state.treeViewSelectedKeys}\n                onExpandCollapse={this.onExpandCollapseTree}\n                onSelect={this.onItemSelected}\n                defaultExpandedChildren={true}\n                theme={this.props.themeVariant}\n              //expandToSelected={true}\n              // onRenderItem={this.renderCustomTreeItem}\n              />\n              <PrimaryButton onClick={() => { this.setState({ treeViewSelectedKeys: [] }); }}>Clear selection</PrimaryButton>\n            </div>\n          }\n          {controlVisibility.Pagination &&\n            <div id=\"PaginationDiv\" className={styles.container}>\n              <Pagination\n                currentPage={3}\n                onChange={(page) => (this._getPage(page))}\n                totalPages={this.props.paginationTotalPages || 13}\n              //limiter={3}\n              // hideFirstPageJump\n              //hideLastPageJump\n              //limiterIcon={\"NumberedListText\"}\n              />\n            </div>\n          }\n          {controlVisibility.FieldCollectionData &&\n            <div id=\"FieldCollectionDataDiv\" className={styles.container}>\n              <FieldCollectionData\n                key={\"FieldCollectionData\"}\n                label={\"Fields Collection\"}\n                itemsPerPage={3}\n                manageBtnLabel={\"Manage\"}\n                onChanged={(value) => { console.log(value); }}\n                panelHeader={\"Manage values\"}\n                enableSorting={true}\n                panelProps={{ type: PanelType.custom, customWidth: \"98vw\" }}\n                fields={[\n                  { id: \"Field1\", title: \"String field\", type: CustomCollectionFieldType.string, required: true },\n                  { id: \"Field2\", title: \"Number field\", type: CustomCollectionFieldType.number },\n                  { id: \"Field3\", title: \"URL field\", type: CustomCollectionFieldType.url },\n                  { id: \"Field4\", title: \"Boolean field\", type: CustomCollectionFieldType.boolean },\n                  {\n                    id: \"Field5\", title: \"People picker\", type: CustomCollectionFieldType.peoplepicker, required: true,\n                    minimumUsers: 2, minimumUsersMessage: \"2 Users is the minimum\", maximumUsers: 3,\n                  },\n                  {\n                    id: \"Field6\", title: \"Combo Single\", type: CustomCollectionFieldType.combobox, required: true,\n                    multiSelect: false, options: [{ key: \"choice 1\", text: \"choice 1\" }, { key: \"choice 2\", text: \"choice 2\" }, { key: \"choice 3\", text: \"choice 3\" }]\n                  },\n                  {\n                    id: \"Field7\", title: \"Combo Multi\", type: CustomCollectionFieldType.combobox,\n                    allowFreeform: true, multiSelect: true, options: [{ key: \"choice 1\", text: \"choice 1\" }, { key: \"choice 2\", text: \"choice 2\" }, { key: \"choice 3\", text: \"choice 3\" }]\n                  },\n                  { id: \"Field8\", title: \"Date field\", type: CustomCollectionFieldType.date, placeholder: \"Select a date\" }\n                ]}\n                value={this.getRandomCollectionFieldData()}\n\n                // value = {null}\n                context={this.props.context as any} //error when this is omitted and people picker is used\n                usePanel={true}\n                noDataMessage=\"No data is selected\" //overrides the default message\n              />\n            </div>\n          }\n          {controlVisibility.ContentTypePicker &&\n            <ContentTypePicker\n              context={this.props.context}\n            // group=\"Content Feedback\"\n            // includeHidden={false}\n            // includeReadOnly={false}\n            // label=\"Select your content type\"\n            // multiSelect={false}\n            // orderBy={ContentTypesOrderBy.Name}\n            // listId=\"00000000-0000-0000-0000-000000000000\"\n            // onSelectionChanged={this.onContentTypePickerChanged}\n            // showBlankOption={true}\n            />\n          }\n          {controlVisibility.Dashboard &&\n            <div id=\"DashboardDiv\" className={styles.container}>\n              <Dashboard\n                widgets={[{\n                  title: \"Card 1\",\n                  desc: \"Last updated Monday, April 4 at 11:15 AM (PT)\",\n                  widgetActionGroup: calloutItemsExample,\n                  size: WidgetSize.Quadruple,\n                  body: [\n                    {\n                      id: \"t1\",\n                      title: \"Tab 1\",\n                      content: (\n                        <Flex\n                          vAlign=\"center\"\n                          hAlign=\"center\"\n                          styles={{ height: \"100%\", border: \"1px dashed rgb(179, 176, 173)\" }}\n                        >\n                          <NorthstarText size=\"large\" weight=\"semibold\">\n                            Content #1\n                          </NorthstarText>\n                        </Flex>\n                      ),\n                    },\n                    {\n                      id: \"t2\",\n                      title: \"Tab 2\",\n                      content: (\n                        <Flex\n                          vAlign=\"center\"\n                          hAlign=\"center\"\n                          styles={{ height: \"100%\", border: \"1px dashed rgb(179, 176, 173)\" }}\n                        >\n                          <NorthstarText size=\"large\" weight=\"semibold\">\n                            Content #2\n                          </NorthstarText>\n                        </Flex>\n                      ),\n                    },\n                    {\n                      id: \"t3\",\n                      title: \"Tab 3\",\n                      content: (\n                        <Flex\n                          vAlign=\"center\"\n                          hAlign=\"center\"\n                          styles={{ height: \"100%\", border: \"1px dashed rgb(179, 176, 173)\" }}\n                        >\n                          <NorthstarText size=\"large\" weight=\"semibold\">\n                            Content #3\n                          </NorthstarText>\n                        </Flex>\n                      ),\n                    },\n                  ],\n                  link: linkExample,\n                },\n                {\n                  title: \"Card 2\",\n                  size: WidgetSize.Single,\n                  link: customizedLinkExample,\n                  rowSpan: 2\n                },\n                {\n                  title: \"Card 3\",\n                  size: WidgetSize.Double,\n                  link: linkExample,\n                },\n                {\n                  title: \"Card 4\",\n                  size: WidgetSize.Single,\n                  link: customizedLinkExample,\n                },\n                {\n                  title: \"Card 5\",\n                  size: WidgetSize.Single,\n                  link: linkExample,\n                },\n                {\n                  title: \"Card 6\",\n                  size: WidgetSize.Single,\n                  link: linkExample,\n                }]} />\n            </div>\n          }\n          {controlVisibility.Toolbar &&\n            <div id=\"ToolbarDiv\" className={styles.container}>\n              <div>\n                <h3>Uncontrolled toolbar</h3>\n                <Toolbar actionGroups={{\n                  'group1': {\n                    'action1': {\n                      title: 'Edit',\n                      iconName: 'Edit',\n                      onClick: () => { console.log('Edit action click'); }\n                    },\n                    'action2': {\n                      title: 'New',\n                      iconName: 'Add',\n                      onClick: () => { console.log('New action click'); }\n                    }\n                  }\n                }}\n                  filters={toolbarFilters}\n                  onSelectedFiltersChange={this.onToolbarSelectedFiltersChange}\n                />\n              </div>\n              <div>\n                <h3>Controlled toolbar</h3>\n                <Toolbar actionGroups={{\n                  'group1': {\n                    'action1': {\n                      title: 'Edit',\n                      iconName: 'Edit',\n                      onClick: () => { console.log('Edit action click'); }\n                    },\n                    'action2': {\n                      title: 'New',\n                      iconName: 'Add',\n                      onClick: () => { console.log('New action click'); }\n                    }\n                  }\n                }}\n                  filters={toolbarFilters}\n                  selectedFilterIds={this.state.selectedFilters}\n                  onSelectedFiltersChange={this.onToolbarSelectedFiltersChange} />\n              </div>\n              <div>Selected filter IDs: {this.state.selectedFilters.join(\", \")}</div>\n              <PrimaryButton text='Toggle filter1' onClick={() => this.toggleToolbarFilter(\"filter1\")} />\n              <PrimaryButton text='Toggle filter2' onClick={() => this.toggleToolbarFilter(\"filter2\")} />\n            </div>\n          }\n          {controlVisibility.AnimatedDialog &&\n            <div id=\"AnimatedDialogDiv\" className={styles.container}>\n              <h3>Animated Dialogs</h3>\n\n              {/* Multiple elements added only for demo - can be controlled with fewer elements */}\n\n              <PrimaryButton text='Show animated dialog' onClick={() => { this.setState({ showAnimatedDialog: true }); }} />\n              {/* Normal animated dialog */}\n              <AnimatedDialog\n                hidden={!this.state.showAnimatedDialog}\n                onDismiss={() => { this.setState({ showAnimatedDialog: false }); }}\n                dialogContentProps={animatedDialogContentProps}\n                modalProps={animatedModalProps}\n              >\n                <DialogFooter>\n                  <PrimaryButton onClick={() => { this.setState({ showAnimatedDialog: false }); }} text=\"Yes\" />\n                  <DefaultButton onClick={() => { this.setState({ showAnimatedDialog: false }); }} text=\"No\" />\n                </DialogFooter>\n              </AnimatedDialog>\n              <br />\n              <br />\n\n              <PrimaryButton text='Show animated dialog with icon' onClick={() => { this.setState({ showCustomisedAnimatedDialog: true }); }} />\n              {/* Animated dialog with icon */}\n              <AnimatedDialog\n                hidden={!this.state.showCustomisedAnimatedDialog}\n                onDismiss={() => { this.setState({ showCustomisedAnimatedDialog: false }); }}\n                dialogContentProps={customizedAnimatedDialogContentProps}\n                modalProps={customizedAnimatedModalProps}\n                dialogAnimationInType='fadeInDown'\n                dialogAnimationOutType='fadeOutDown'\n                iconName='UnknownSolid'\n                iconAnimationType='zoomInDown'\n                showAnimatedDialogFooter={true}\n                okButtonText=\"Yes\"\n                cancelButtonText=\"No\"\n                onOkClick={() => timeout(1500)}\n                onSuccess={() => {\n                  this.setState({ showCustomisedAnimatedDialog: false });\n                  this.setState({ showSuccessDialog: true });\n                }}\n                onError={() => {\n                  this.setState({ showCustomisedAnimatedDialog: false });\n                  this.setState({ showErrorDialog: true });\n                }}>\n                <div className={styles.dialogContent}>\n                  <span>Do you like the animated dialog?</span>\n                </div>\n              </AnimatedDialog>\n\n              {/* Success animated dialog */}\n              <AnimatedDialog\n                hidden={!this.state.showSuccessDialog}\n                onDismiss={() => { this.setState({ showSuccessDialog: false }); }}\n                dialogContentProps={successDialogContentProps}\n                modalProps={customizedAnimatedModalProps}\n                iconName='CompletedSolid'\n              >\n                <div className={styles.dialogContent}><span>Thank you.</span></div>\n                <div className={styles.dialogFooter}>\n                  <PrimaryButton onClick={() => { this.setState({ showSuccessDialog: false }); }} text=\"OK\"  />\n                </div>\n              </AnimatedDialog>\n\n              {/* Error animated dialog */}\n              <AnimatedDialog\n                hidden={!this.state.showErrorDialog}\n                onDismiss={() => { this.setState({ showErrorDialog: false }); }}\n                dialogContentProps={errorDialogContentProps}\n                modalProps={customizedAnimatedModalProps}\n                iconName='StatusErrorFull'\n              >\n                <div className={styles.dialogContent}><span>Ther was an error.</span></div>\n                <div className={styles.dialogFooter}>\n                  <PrimaryButton onClick={() => { this.setState({ showErrorDialog: false }); }} text=\"OK\"  />\n                </div>\n              </AnimatedDialog>\n            </div>\n          }\n          {controlVisibility.LivePersona &&\n            <div id=\"LivePersonaDiv\" className={styles.container}>\n              <LivePersona upn=\"meganb@contoso.onmicrosoft.com\"\n                template={\n                  <>\n                    <Persona text=\"Megan Bowen\" secondaryText=\"meganb@contoso.onmicrosoft.com\" coinSize={48} />\n                  </>\n                }\n                serviceScope={this.props.context.serviceScope}\n              />\n            </div>\n          }\n          {controlVisibility.LocationPicker &&\n            <div id=\"LocationPickerDiv\" className={styles.container}>\n              <LocationPicker context={this.props.context} label=\"Location\" onChange={(locValue: ILocationPickerItem) => { console.log(locValue.DisplayName + \", \" + locValue.Address.Street); }} />\n            </div>\n          }\n          {controlVisibility.ModernTaxonomyPicker &&\n            <div id=\"ModernTaxonomyPickerDiv\" className={styles.container}>\n              <ModernTaxonomyPicker\n                allowMultipleSelections={true}\n                termSetId={this.termSetId}\n                panelTitle=\"Panel title\"\n                label={\"Modern Taxonomy Picker\"}\n                context={this.props.context}\n                required={false}\n                disabled={false}\n                customPanelWidth={400}\n              />\n            </div>\n          }\n          {controlVisibility.MonacoEditor &&\n            <div id=\"MonacoEditorDiv\" className={styles.container}>\n              <MonacoEditor value={\"\"}\n                showMiniMap={true}\n                onValueChange={(value, validationErrors) => { console.log(value); console.log(validationErrors); }}\n                language={\"javascript\"} />\n            </div>\n          }\n          {controlVisibility.AdaptiveCardHost &&\n            <div id=\"AdaptiveCardHostDiv\" className={styles.container}>\n              <h3>Adaptive Card Host</h3>\n              <AdaptiveCardHost\n                card={{\n                  \"$schema\": \"http://adaptivecards.io/schemas/adaptive-card.json\",\n                  \"type\": \"AdaptiveCard\",\n                  \"version\": \"1.0\",\n                  \"body\": [\n                    {\n                      \"type\": \"TextBlock\",\n                      \"size\": \"medium\",\n                      \"weight\": \"bolder\",\n                      \"text\": \" ${ParticipantInfoForm.title}\",\n                      \"horizontalAlignment\": \"center\",\n                      \"wrap\": true,\n                      \"style\": \"heading\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Name\",\n                      \"style\": \"text\",\n                      \"id\": \"SimpleVal\",\n                      \"isRequired\": true,\n                      \"errorMessage\": \"Name is required\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Homepage\",\n                      \"style\": \"url\",\n                      \"id\": \"UrlVal\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Email\",\n                      \"style\": \"email\",\n                      \"id\": \"EmailVal\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Phone\",\n                      \"style\": \"tel\",\n                      \"id\": \"TelVal\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Comments\",\n                      \"style\": \"text\",\n                      \"isMultiline\": true,\n                      \"id\": \"MultiLineVal\"\n                    },\n                    {\n                      \"type\": \"Input.Number\",\n                      \"label\": \"Quantity\",\n                      \"min\": -5,\n                      \"max\": 5,\n                      \"value\": 1,\n                      \"id\": \"NumVal\",\n                      \"errorMessage\": \"The quantity must be between -5 and 5\"\n                    },\n                    {\n                      \"type\": \"Input.Date\",\n                      \"label\": \"Due Date\",\n                      \"id\": \"DateVal\",\n                      \"value\": \"2017-09-20\"\n                    },\n                    {\n                      \"type\": \"Input.Time\",\n                      \"label\": \"Start time\",\n                      \"id\": \"TimeVal\",\n                      \"value\": \"16:59\"\n                    },\n                    {\n                      \"type\": \"TextBlock\",\n                      \"size\": \"medium\",\n                      \"weight\": \"bolder\",\n                      \"text\": \"${Survey.title} \",\n                      \"horizontalAlignment\": \"center\",\n                      \"wrap\": true,\n                      \"style\": \"heading\"\n                    },\n                    {\n                      \"type\": \"Input.ChoiceSet\",\n                      \"id\": \"CompactSelectVal\",\n                      \"label\": \"${Survey.questions[0].question}\",\n                      \"style\": \"compact\",\n                      \"value\": \"1\",\n                      \"choices\": [\n                        {\n                          \"$data\": \"${Survey.questions[0].items}\",\n                          \"title\": \"${choice}\",\n                          \"value\": \"${value}\"\n                        }\n                      ]\n                    },\n                    {\n                      \"type\": \"Input.ChoiceSet\",\n                      \"id\": \"SingleSelectVal\",\n                      \"label\": \"${Survey.questions[1].question}\",\n                      \"style\": \"expanded\",\n                      \"value\": \"1\",\n                      \"choices\": [\n                        {\n                          \"$data\": \"${Survey.questions[1].items}\",\n                          \"title\": \"${choice}\",\n                          \"value\": \"${value}\"\n                        }\n                      ]\n                    },\n                    {\n                      \"type\": \"Input.ChoiceSet\",\n                      \"id\": \"MultiSelectVal\",\n                      \"label\": \"${Survey.questions[2].question}\",\n                      \"isMultiSelect\": true,\n                      \"value\": \"1,3\",\n                      \"choices\": [\n                        {\n                          \"$data\": \"${Survey.questions[2].items}\",\n                          \"title\": \"${choice}\",\n                          \"value\": \"${value}\"\n                        }\n                      ]\n                    },\n                    {\n                      \"type\": \"TextBlock\",\n                      \"size\": \"medium\",\n                      \"weight\": \"bolder\",\n                      \"text\": \"Input.Toggle\",\n                      \"horizontalAlignment\": \"center\",\n                      \"wrap\": true,\n                      \"style\": \"heading\"\n                    },\n                    {\n                      \"type\": \"Input.Toggle\",\n                      \"label\": \"Please accept the terms and conditions:\",\n                      \"title\": \"${Survey.questions[3].question}\",\n                      \"valueOn\": \"true\",\n                      \"valueOff\": \"false\",\n                      \"id\": \"AcceptsTerms\",\n                      \"isRequired\": true,\n                      \"errorMessage\": \"Accepting the terms and conditions is required\"\n                    },\n                    {\n                      \"type\": \"Input.Toggle\",\n                      \"label\": \"How do you feel about red cars?\",\n                      \"title\": \"${Survey.questions[4].question}\",\n                      \"valueOn\": \"RedCars\",\n                      \"valueOff\": \"NotRedCars\",\n                      \"id\": \"ColorPreference\"\n                    }\n                  ],\n                  \"actions\": [\n                    {\n                      \"type\": \"Action.Submit\",\n                      \"title\": \"Submit\",\n                      \"data\": {\n                        \"id\": \"1234567890\"\n                      }\n                    },\n                    {\n                      \"type\": \"Action.ShowCard\",\n                      \"title\": \"Show Card\",\n                      \"card\": {\n                        \"type\": \"AdaptiveCard\",\n                        \"body\": [\n                          {\n                            \"type\": \"Input.Text\",\n                            \"label\": \"enter comment\",\n                            \"style\": \"text\",\n                            \"id\": \"CommentVal\"\n                          }\n                        ],\n                        \"actions\": [\n                          {\n                            \"type\": \"Action.Submit\",\n                            \"title\": \"OK\"\n                          }\n                        ]\n                      }\n                    }\n                  ]\n                }}\n                data={{\n                  \"$root\": {\n                    \"ParticipantInfoForm\": {\n                      \"title\": \"Input.Text elements\"\n                    },\n                    \"Survey\": {\n                      \"title\": \"Input ChoiceSet\",\n                      \"questions\": [\n                        {\n                          \"question\": \"What color do you want? (compact)\",\n                          \"items\": [\n                            {\n                              \"choice\": \"Red\",\n                              \"value\": \"1\"\n                            },\n                            {\n                              \"choice\": \"Green\",\n                              \"value\": \"2\"\n                            },\n                            {\n                              \"choice\": \"Blue\",\n                              \"value\": \"3\"\n                            }\n                          ]\n                        },\n                        {\n                          \"question\": \"What color do you want? (expanded)\",\n                          \"items\": [\n                            {\n                              \"choice\": \"Red\",\n                              \"value\": \"1\"\n                            },\n                            {\n                              \"choice\": \"Green\",\n                              \"value\": \"2\"\n                            },\n                            {\n                              \"choice\": \"Blue\",\n                              \"value\": \"3\"\n                            }\n                          ]\n                        },\n                        {\n                          \"question\": \"What color do you want? (multiselect)\",\n                          \"items\": [\n                            {\n                              \"choice\": \"Red\",\n                              \"value\": \"1\"\n                            },\n                            {\n                              \"choice\": \"Green\",\n                              \"value\": \"2\"\n                            },\n                            {\n                              \"choice\": \"Blue\",\n                              \"value\": \"3\"\n                            }\n                          ]\n                        },\n                        {\n                          \"question\": \"I accept the terms and conditions (True/False)\"\n                        },\n                        {\n                          \"question\": \"Red cars are better than other cars\"\n                        }\n                      ]\n                    }\n                  }\n                }}\n                theme={this.props.themeVariant}\n                themeType={AdaptiveCardHostThemeType.SharePoint}\n                onInvokeAction={(action) => alert(JSON.stringify(action))}\n                onError={(error) => console.log(error.message)}\n                onSetCustomElements={(registry: CardObjectRegistry<CardElement>) => { }}\n                onSetCustomActions={(registry: CardObjectRegistry<Action>) => { }}\n                onUpdateHostCapabilities={(hostCapabilities: HostCapabilities) => {\n                  hostCapabilities.setCustomProperty(\"CustomPropertyName\", Date.now);\n                }}\n                context={this.props.context}\n              />\n            </div>\n          }\n          {controlVisibility.VariantThemeProvider &&\n            <div id=\"VariantThemeProviderDiv\" className={styles.container}>\n              <h3>Variant Theme Provider</h3>\n              <VariantThemeProvider variantType={VariantType.Strong}>\n                <Stack tokens={{ childrenGap: 5, padding: 5 }}>\n                  <Label>This Web Part implements an example on how to use the 'Fluent UI' theme library and how to apply/generate theme variation for the Web Part itself.</Label>\n                  <PrimaryButton>Primary Button</PrimaryButton>\n                  <DefaultButton>Default Button</DefaultButton>\n                  <Link>Link</Link>\n                </Stack>\n              </VariantThemeProvider>\n            </div>\n          }\n          {controlVisibility.EnhancedThemeProvider &&\n            <div id=\"EnhancedThemeProviderDiv\" className={styles.container}>\n              <h3>Enhanced Theme Provider</h3>\n              <EnhancedThemeProvider applyTo=\"element\" context={this.props.context} theme={this.props.themeVariant}>\n                <ControlsTestEnhancedThemeProviderFunctionComponent />\n                <ControlsTestEnhancedThemeProvider />\n              </EnhancedThemeProvider>\n            </div>\n          }\n          {controlVisibility.AdaptiveCardDesignerHost &&\n            <div id=\"AdaptiveCardDesignerHostDiv\" className={styles.container}>\n              <h3>Adaptive Card Designer Host</h3>\n              <AdaptiveCardDesignerHost\n                headerText={`Adaptive Card Designer`}\n                buttonText=\"Open Designer\"\n                card={{ \"$schema\": \"http://adaptivecards.io/schemas/adaptive-card.json\", \"type\": \"AdaptiveCard\", \"version\": \"1.5\", \"body\": [{ \"type\": \"ColumnSet\", \"columns\": [{ \"width\": \"auto\", \"items\": [{ \"type\": \"Image\", \"size\": \"Small\", \"style\": \"Person\", \"url\": \"/_layouts/15/userphoto.aspx?size=M&username=${$root['@context']['userInfo']['email']}\" }], \"type\": \"Column\" }, { \"width\": \"stretch\", \"items\": [{ \"type\": \"TextBlock\", \"text\": \"${$root['@context']['userInfo']['displayName']}\", \"weight\": \"Bolder\" }, { \"type\": \"TextBlock\", \"spacing\": \"None\", \"text\": \"${$root['@context']['userInfo']['email']}\" }], \"type\": \"Column\" }] }] }}\n                data={undefined}\n                context={this.props.context}\n                theme={this.props.themeVariant}\n                onSave={(payload: object) => alert(JSON.stringify(payload))}\n                snippets={[{\n                  name: \"Persona\",\n                  category: \"Snippets\",\n                  payload: {\n                    type: \"ColumnSet\",\n                    columns: [\n                      {\n                        width: \"auto\",\n                        items: [\n                          {\n                            type: \"Image\",\n                            size: \"Small\",\n                            style: \"Person\",\n                            url: \"/_layouts/15/userphoto.aspx?size=M&username=${$root['@context']['userInfo']['email']}\"\n                          }\n                        ]\n                      },\n                      {\n                        width: \"stretch\",\n                        items: [\n                          {\n                            type: \"TextBlock\",\n                            text: \"${$root['@context']['userInfo']['displayName']}\",\n                            weight: \"Bolder\"\n                          },\n                          {\n                            type: \"TextBlock\",\n                            spacing: \"None\",\n                            text: \"${$root['@context']['userInfo']['email']}\"\n                          }\n                        ]\n                      }\n                    ]\n                  }\n                }]}\n              />\n            </div>\n          }\n          {controlVisibility.ShareDialog &&\n            <div id=\"ShareDialogDiv\" className={styles.container}>\n              <PrimaryButton text=\"Open Share dialog\" onClick={() => { this.setState({ isOpenShareDialog: true }); }} />\n              <ShareDialog\n                isOpen={this.state.isOpenShareDialog}\n                onClose={() => this.setState({ isOpenShareDialog: false })}\n                options={{\n                  siteUrl: this.props.context.pageContext.web.absoluteUrl,\n                  listId: 'b1416fca-dc77-4198-a082-62a7657dcfa9',\n                  itemId: 1,\n                  name: 'Document Name'\n                }} />\n            </div>\n          }\n          {controlVisibility.TaxonomyTree &&\n            <div id=\"TaxonomyTreeDiv\" className={styles.container} hidden={!controlVisibility.TaxonomyTree}>\n              <h3>Modern Taxonomy Tree</h3>\n              {this.state.termStoreInfo && (\n                <TaxonomyTree\n                  languageTag={this.state.termStoreInfo.defaultLanguageTag}\n                  onLoadMoreData={this.spTaxonomyService.getTerms}\n                  pageSize={50}\n                  setTerms={(value) => this.setState({ testTerms: value as any })}\n                  termStoreInfo={this.state.termStoreInfo}\n                  termSetInfo={this.state.termSetInfo}\n                  terms={this.state.testTerms as any[]}\n                  onRenderActionButton={() => <button>test button</button>}\n                  hideDeprecatedTerms={false}\n                  showIcons={true}\n                />\n              )}\n            </div>\n          }\n          {controlVisibility.ListToolbar &&\n            <div id=\"ListToolbarDiv\" className={styles.container}>\n              <h3>ListToolbar</h3>\n              <ListToolbar\n                context={this.props.context}\n                theme={this.props.themeVariant as any}\n                items={[\n                  { key: 'new', label: 'New', icon: <span>+</span>, onClick: () => console.log('New clicked'), group: 'actions' },\n                  { key: 'edit', label: 'Edit', icon: <span>✎</span>, onClick: () => console.log('Edit clicked'), group: 'actions' },\n                  { key: 'delete', label: 'Delete', icon: <span>🗑</span>, onClick: () => console.log('Delete clicked'), appearance: 'subtle', group: 'danger' },\n                ]}\n                farItems={[\n                  { key: 'filter', label: 'Filter', icon: <span>🔍</span>, onClick: () => console.log('Filter clicked'), isFarItem: true },\n                  { key: 'settings', label: 'Settings', icon: <span>⚙</span>, onClick: () => console.log('Settings clicked'), isFarItem: true },\n                ]}\n                totalCount={10}\n                showGroupDividers={true}\n                ariaLabel=\"List Toolbar\"\n              />\n            </div>\n          }\n          {controlVisibility.TestControl &&\n            <div id=\"TestControlDiv\" className={styles.container}>\n              <TestControl context={this.props.context} themeVariant={this.props.themeVariant} />\n            </div>\n          }\n          {controlVisibility.UploadFiles &&\n            <div id=\"UploadFilesDiv\" className={styles.container}>\n              <h3>Upload Files</h3>\n              <EnhancedThemeProvider theme={this.props.themeVariant} context={this.props.context}>\n                <Stack>\n                  <UploadFiles\n                    context={this.props.context}\n                    title=\"Upload Files\"\n                    onUploadFiles={(files) => {\n                      console.log(\"files\", files);\n                    }}\n                    themeVariant={this.props.themeVariant}\n                  />\n                </Stack>\n              </EnhancedThemeProvider>\n            </div>\n          }\n          {controlVisibility.UserPicker &&\n            <div id=\"UserPickerDiv\" className={styles.container}>\n              <UserPicker\n                context={this.props.context}\n                secondaryTextPropertyName=\"mail\"\n                theme={this.props.themeVariant}\n                placeholder={\"Search User\"}\n              // label={\n              //   <div>\n              //     <Person20Filled color={tokens.colorBrandForeground1} />\n              //     <Body1>Select User</Body1>\n              //   </div>\n              // }\n              // onSelectedUsers={onSelectedUsers}\n              // onRemoveSelectedUser={onRemovedUser}\n              />\n            </div>\n          }\n          {\n            controlVisibility.Calendar &&\n            <div id=\"CalendarDiv\" className={styles.container}>\n              <TestCalendarControl\n                  context={this.props.context} theme={this.props.themeVariant as any}   hasTeamsContext={false} themeString={'default'} title={'Calendar'} appHostName={EAppHostName.SharePoint} />\n            </div>\n\n          }\n          {\n            controlVisibility.SPFilePicker &&\n            <div id=\"SPFilePickerDiv\" className={styles.container}>\n              <TestSPFilePickerControl context={this.props.context} />\n            </div>\n\n          }\n          {controlVisibility.WorldMap &&\n            <div id=\"WorldMapDiv\" className={styles.container}>\n              <WorldMap description={'World Map Sample'} isDarkTheme={false} hasTeamsContext={false} title={'Microsoft Locations Worldwide'}     />\n            </div>\n          }\n        </div>\n      </React.Suspense>\n    );\n  }\n\n  private getRandomCollectionFieldData = () => {\n    const result: Record<string, unknown>[] = [];\n    for (let i = 1; i < 16; i++) {\n\n      const sampleDate = new Date();\n      sampleDate.setDate(sampleDate.getDate() + i);\n\n      result.push({\n        \"Field1\": `String${i}`,\n        \"Field2\": i,\n        \"Field3\": \"https://pnp.github.io/\",\n        \"Field4\": true,\n        \"Field5\": null as any,\n        \"Field6\": { key: \"choice 1\", text: \"choice 1\" },\n        \"Field7\": [{ key: \"choice 1\", text: \"choice 1\" }, { key: \"choice 2\", text: \"choice 2\" }],\n        \"Field8\": sampleDate\n      });\n    }\n    return result;\n  }\n\n  private onExpandCollapseTree(item: ITreeItem, isExpanded: boolean) {\n    console.log((isExpanded ? \"item expanded: \" : \"item collapsed: \") + item);\n  }\n\n  private onItemSelected(items: ITreeItem[]) {\n    console.log(\"items selected: \" + items.length);\n  }\n\n  private renderCustomTreeItem(item: ITreeItem): JSX.Element {\n    return (\n      <span>\n        {\n          item.iconProps &&\n          <i className={\"ms-Icon ms-Icon--\" + item.iconProps.iconName} style={{ paddingRight: '4px' }} />\n        }\n        {item.label}\n      </span>\n    );\n  }\n\n  private _getPage(page: number) {\n    console.log('Page:', page);\n  }\n\n  // private _onFolderSelect = (folder: IFolder): void => {\n  //   console.log('selected folder', folder);\n  //\n}\n"
                   }
                 }
               }
             }
           ],
-          "ruleId": "@typescript-eslint/no-explicit-any",
-          "ruleIndex": 0,
+          "ruleId": "max-lines",
+          "ruleIndex": 17,
           "suppressions": []
         },
         {
           "level": "warning",
           "message": {
-            "text": "'itemdata' is never reassigned. Use 'const' instead."
+            "text": "Unexpected any. Specify a different type."
           },
           "locations": [
             {
@@ -22934,25 +22389,25 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1277,
-                  "startColumn": 60,
-                  "endLine": 1277,
-                  "endColumn": 68,
+                  "startLine": 2114,
+                  "startColumn": 42,
+                  "endLine": 2114,
+                  "endColumn": 45,
                   "snippet": {
-                    "text": "itemdata"
+                    "text": "any"
                   }
                 }
               }
             }
           ],
-          "ruleId": "prefer-const",
-          "ruleIndex": 17,
+          "ruleId": "@typescript-eslint/no-explicit-any",
+          "ruleIndex": 0,
           "suppressions": []
         },
         {
           "level": "warning",
           "message": {
-            "text": "Empty components are self-closing"
+            "text": "Unexpected any. Specify a different type."
           },
           "locations": [
             {
@@ -22962,149 +22417,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 1384,
-                  "startColumn": 23,
-                  "endLine": 1384,
-                  "endColumn": 34,
-                  "snippet": {
-                    "text": "<TextField>"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "react/self-closing-comp",
-          "ruleIndex": 18,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Unexpected any. Specify a different type."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 1714,
-                  "startColumn": 51,
-                  "endLine": 1714,
-                  "endColumn": 54,
-                  "snippet": {
-                    "text": "any"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-explicit-any",
-          "ruleIndex": 0,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "[\"loginName\"] is better written in dot notation."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 1714,
-                  "startColumn": 56,
-                  "endLine": 1714,
-                  "endColumn": 67,
-                  "snippet": {
-                    "text": "\"loginName\""
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "dot-notation",
-          "ruleIndex": 12,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "File has too many lines (3261). Maximum allowed is 2000."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2001,
-                  "startColumn": 1,
-                  "endLine": 3262,
-                  "endColumn": 1,
-                  "snippet": {
-                    "text": "              </div>\n            </div>\n          }\n          {controlVisibility.ListItemPicker &&\n            <div id=\"ListItemPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">List Item picker list data tester:\n\n                <ListItemPicker listId={'b1416fca-dc77-4198-a082-62a7657dcfa9'}\n                  columnInternalName=\"DateAndTime\"\n                  keyColumnInternalName=\"Id\"\n                  // filter={\"Title eq 'SPFx'\"}\n                  orderBy={'Title desc'}\n                  itemLimit={5}\n                  context={this.props.context}\n                  placeholder={'Select list items'}\n                  onSelectedItem={this.listItemPickerDataSelected} />\n\n              </div>\n            </div>\n          }\n          {controlVisibility.ListItemComments &&\n            <div id=\"ListItemCommentsDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">List Item Comments Tester\n                <ListItemComments webUrl='https://contoso.sharepoint.com/sites/ThePerspective'\n                  listId='6f151a33-a7af-4fae-b8c4-f2f04cbc690f'\n                  itemId={\"1\"}\n                  serviceScope={this.props.context.serviceScope}\n                  numberCommentsPerPage={10}\n                  label=\"ListItem Comments\"\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.ViewPicker &&\n            <div id=\"ViewPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">View picker tester:\n                <ViewPicker context={this.props.context}\n                  label=\"Select view(s)\"\n                  listId={\"9f3908cd-1e88-4ab3-ac42-08efbbd64ec9\"}\n                  placeholder={'Select list view(s)'}\n                  orderBy={1}\n                  multiSelect={true}\n                  onSelectionChanged={this.onViewPickerChange} />\n              </div>\n            </div>\n          }\n          {controlVisibility.FieldPicker &&\n            <div id=\"FieldPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">Field picker tester:\n                <FieldPicker\n                  context={this.props.context}\n                  label={'Select a field'}\n                  listId={this.state.selectedList}\n                  onSelectionChanged={(fields) => {\n                    console.log(fields);\n                  }}\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.IconPicker &&\n            <div id=\"IconPickerDiv\" className={styles.container}>\n              <div>Icon Picker</div>\n              <div>\n                <IconPicker\n                  renderOption=\"panel\"\n                  onSave={(value) => { console.log(value); }}\n                  currentIcon={'Warning'}\n                  buttonLabel=\"Icon Picker\" />\n              </div>\n              <IconPicker buttonLabel={'Icon'}\n                onChange={(iconName: string) => { console.log(iconName); }}\n                onCancel={() => { console.log(\"Panel closed\"); }}\n                onSave={(iconName: string) => { console.log(iconName); }} />\n            </div>\n          }\n          {controlVisibility.ComboBoxListItemPicker &&\n            <div id=\"ComboBoxListItemPickerDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">ComboBoxListItemPicker:\n\n                <ComboBoxListItemPicker listId={this.state.comboBoxListItemPickerListId}\n                  columnInternalName='Title'\n                  keyColumnInternalName='Id'\n                  orderBy='Title desc'\n                  multiSelect={true}\n                  onSelectedItem={(data) => {\n                    console.log(`Item(s):`, data);\n                  }}\n                  defaultSelectedItems={this.state.comboBoxListItemPickerIds}\n                  webUrl={this.props.context.pageContext.web.absoluteUrl}\n                  spHttpClient={this.props.context.spHttpClient} />\n\n                <PrimaryButton text=\"Change List\" onClick={() => {\n                  this.setState({\n                    comboBoxListItemPickerListId: '71210430-8436-4962-a14d-5525475abd6b'\n                  });\n                }} />\n                <PrimaryButton text=\"Change default items\" onClick={() => {\n                  this.setState({\n                    comboBoxListItemPickerIds: [{ Id: 2, Title: '222' }]\n                  });\n                }} />\n\n              </div>\n            </div>\n          }\n          {controlVisibility.IFrameDialog &&\n            <div id=\"IFrameDialogDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">iframe dialog tester:\n                <PrimaryButton\n                  text=\"Open iframe Dialog\"\n                  onClick={() => { this.setState({ iFrameDialogOpened: true }); }} />\n                <IFrameDialog\n                  url={iframeUrl}\n                  iframeOnLoad={(iframe: any) => { console.log('iframe loaded'); }}\n                  hidden={!this.state.iFrameDialogOpened}\n                  onDismiss={() => { this.setState({ iFrameDialogOpened: false }); }}\n                  modalProps={{\n                    isBlocking: true,\n                    styles: {\n                      root: {\n                        backgroundColor: '#00ff00'\n                      },\n                      main: {\n                        backgroundColor: '#ff0000'\n                      }\n                    }\n                  }}\n                  dialogContentProps={{\n                    type: DialogType.close,\n                    showCloseButton: true\n                  }}\n                  width={'570px'}\n                  height={'315px'} />\n              </div>\n            </div>\n          }\n          {controlVisibility.IFramePanel &&\n            <div id=\"IFramePanelDiv\" className={styles.container}>\n              <div className=\"ms-font-m\">iframe Panel tester:\n                <PrimaryButton\n                  text=\"Open iframe Panel\"\n                  onClick={() => { this.setState({ iFramePanelOpened: true }); }} />\n                <IFramePanel\n                  url={iframeUrl}\n                  type={PanelType.medium}\n                  //  height=\"300px\"\n                  headerText=\"iframe panel title\"\n                  closeButtonAriaLabel=\"Close\"\n                  isOpen={this.state.iFramePanelOpened}\n                  onDismiss={() => { this.setState({ iFramePanelOpened: false }); }}\n                  iframeOnLoad={(iframe: any) => { console.log('iframe loaded'); }}\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.ImagePicker &&\n            <div id=\"ImagePickerDiv\" className={styles.container}>\n              <ImagePicker\n                context={this.props.context}\n                onFileSelected={(file) => { console.log(file); this.setState({ selectedUrlImagePicker: file.fileAbsoluteUrl }); }}\n                onDeleteFile={() => { console.log('file deleted'); }}\n                selectedFileUrl={this.state.selectedUrlImagePicker}\n              />\n            </div>\n          }\n          {controlVisibility.FolderPicker &&\n            <div id=\"FolderPickerDiv\" className={styles.container}>\n              <FolderPicker context={this.props.context}\n                rootFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                onSelect={this._onFolderSelect}\n                label='Folder Picker'\n                required={true}\n                canCreateFolders={true}\n              ></FolderPicker>\n            </div>\n          }\n          <div id=\"FilterBarDiv\" className={styles.container} hidden={!controlVisibility.FilterBar}>\n            <FilterBar items={this.state.filters} inlineItemCount={3} onClearFilters={this.onClearFilters} onRemoveFilter={this.onRemoveFilter} />\n            <button onClick={this.addFilter}>Add new filter</button>\n          </div>\n          {controlVisibility.Carousel &&\n\n            <div id=\"CarouselDiv\" className={styles.container}>\n              <div>\n                <h3>Carousel with fixed elements:</h3>\n                <Carousel\n                  buttonsLocation={CarouselButtonsLocation.top}\n                  buttonsDisplay={CarouselButtonsDisplay.block}\n\n                  contentContainerStyles={styles.carouselContent}\n                  containerButtonsStyles={styles.carouselButtonsContainer}\n\n                  isInfinite={true}\n\n                  element={this.carouselElements}\n                  onMovePrevClicked={(index: number) => { console.log(`Prev button clicked: ${index}`); }}\n                />\n              </div>\n              <div>\n                <h3>Carousel with CarouselImage elements:</h3>\n                <Carousel\n                  buttonsLocation={CarouselButtonsLocation.center}\n                  buttonsDisplay={CarouselButtonsDisplay.buttonsOnly}\n\n                  contentContainerStyles={styles.carouselImageContent}\n                  //containerButtonsStyles={styles.carouselButtonsContainer}\n\n                  isInfinite={true}\n                  indicatorShape={CarouselIndicatorShape.circle}\n                  indicatorsDisplay={CarouselIndicatorsDisplay.block}\n                  pauseOnHover={true}\n\n                  element={[\n                    {\n                      imageSrc: 'https://images.unsplash.com/photo-1588614959060-4d144f28b207?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3078&q=80',\n                      title: 'Colosseum',\n                      description: 'This is Colosseum',\n                      url: 'https://en.wikipedia.org/wiki/Colosseum',\n                      showDetailsOnHover: true,\n                      imageFit: ImageFit.cover\n                    },\n                    {\n                      imageSrc: 'https://www.telegraph.co.uk/content/dam/science/2018/06/20/stonehenge-2326750_1920_trans%2B%2BZgEkZX3M936N5BQK4Va8RWtT0gK_6EfZT336f62EI5U.jpg',\n                      title: 'Stonehenge',\n                      description: 'This is Stonehendle',\n                      url: 'https://en.wikipedia.org/wiki/Stonehenge',\n                      showDetailsOnHover: true,\n                      imageFit: ImageFit.cover\n                    },\n                    {\n                      imageSrc: 'https://upload.wikimedia.org/wikipedia/commons/thumb/a/af/All_Gizah_Pyramids.jpg/2560px-All_Gizah_Pyramids.jpg',\n                      title: 'Pyramids of Giza',\n                      description: 'This are Pyramids of Giza (Egypt)',\n                      url: 'https://en.wikipedia.org/wiki/Egyptian_pyramids',\n                      showDetailsOnHover: true,\n                      imageFit: ImageFit.cover\n                    }\n                  ]}\n                  onMoveNextClicked={(index: number) => { console.log(`Next button clicked: ${index}`); }}\n                  onMovePrevClicked={(index: number) => { console.log(`Prev button clicked: ${index}`); }}\n                  rootStyles={mergeStyles({\n                    backgroundColor: '#C3C3C3'\n                  })}\n                />\n              </div>\n              <div>\n                <h3>Carousel with triggerPageElement:</h3>\n                <Carousel\n                  buttonsLocation={CarouselButtonsLocation.bottom}\n                  buttonsDisplay={CarouselButtonsDisplay.buttonsOnly}\n\n                  contentContainerStyles={styles.carouselContent}\n\n                  canMoveNext={this.state.canMoveNext}\n                  canMovePrev={this.state.canMovePrev}\n                  triggerPageEvent={this.triggerNextElement}\n                  element={this.state.currentCarouselElement}\n                />\n              </div>\n              <div>\n                <h3>Carousel with minimal configuration:</h3>\n                <Carousel\n                  element={this.carouselElements}\n                  contentHeight={200}\n                />\n              </div>\n            </div>\n          }\n          {controlVisibility.SiteBreadcrumb &&\n            <div id=\"SiteBreadcrumbDiv\" className={styles.container}>\n              <div className={styles.siteBreadcrumb}>\n                <SiteBreadcrumb context={this.props.context} />\n              </div>\n            </div>\n          }\n          {controlVisibility.FilePicker &&\n            <div id=\"FilePickerDiv\" className={styles.container}>\n              <div>\n                <h3>File Picker</h3>\n                <TextField\n                  label=\"Default SiteFileTab Folder\"\n                  onChange={debounce((ev, newVal) => { this.setState({ filePickerDefaultFolderAbsolutePath: newVal }); }, 500)}\n                  styles={{ root: { marginBottom: 10 } }}\n                />\n                <FilePicker\n                  bingAPIKey=\"<BING API KEY>\"\n                  //webAbsoluteUrl=\"https://023xn.sharepoint.com/sites/test1\"\n                  //defaultFolderAbsolutePath={\"https://aterentiev.sharepoint.com/sites/SPFxinTeamsDemo/Shared%20Documents/General\"}\n                  //accepts={[\".gif\", \".jpg\", \".jpeg\", \".bmp\", \".dib\", \".tif\", \".tiff\", \".ico\", \".png\", \".jxr\", \".svg\"]}\n                  buttonLabel=\"Add File\"\n                  buttonIconProps={{ iconName: 'Add', styles: { root: { fontSize: 42 } } }}\n                  onSave={this._onFilePickerSave}\n                  onChange={(filePickerResult: IFilePickerResult[]) => { console.log(filePickerResult); }}\n                  context={this.props.context}\n                  hideRecentTab={false}\n                  includePageLibraries={true}\n                  checkIfFileExists={false}\n                />\n                {\n                  this.state.filePickerResult &&\n                  <div>\n                    <div>\n                      FileName: {this.state.filePickerResult[0].fileName}\n                    </div>\n                    <div>\n                      File size: {GeneralHelper.formatBytes(this.state.filePickerResult[0].fileSize, 2)}\n                    </div>\n                  </div>\n                }\n              </div>\n\n              <div>\n                <h3>File Picker with target folder browser</h3>\n                <FilePicker\n                  bingAPIKey=\"<BING API KEY>\"\n                  //accepts={[\".gif\", \".jpg\", \".jpeg\", \".bmp\", \".dib\", \".tif\", \".tiff\", \".ico\", \".png\", \".jxr\", \".svg\"]}\n                  buttonLabel=\"Upload image\"\n                  buttonIcon=\"FileImage\"\n                  onSave={this._onFilePickerSave}\n                  onChange={(filePickerResult: IFilePickerResult[]) => { console.log(filePickerResult); }}\n                  context={this.props.context}\n                  hideRecentTab={false}\n                  renderCustomUploadTabContent={() => (\n                    <FolderExplorer context={this.props.context}\n                      rootFolder={this.rootFolder}\n                      defaultFolder={this.rootFolder}\n                      onSelect={this._onFolderSelect}\n                      canCreateFolders={true}\n                    />)}\n                />\n              </div>\n              <p><a href=\"javascript:;\" onClick={this.deleteItem}>Deletes second item</a></p>\n            </div>\n          }\n          {controlVisibility.Progress &&\n            <div id=\"ProgressDiv\" className={styles.container}>\n              <Progress title={'Progress Test'}\n                showOverallProgress={true}\n                showIndeterminateOverallProgress={false}\n                hideNotStartedActions={false}\n                actions={this.state.progressActions}\n                currentActionIndex={this.state.currentProgressActionIndex}\n                longRunningText={'This operation takes longer than expected'}\n                longRunningTextDisplayDelay={7000}\n                height={'350px'}\n                inProgressIconName={'ChromeBackMirrored'} />\n              <PrimaryButton text={'Start Progress'} onClick={this._startProgress} />\n            </div>\n          }\n          {controlVisibility.ProgressStepsIndicator &&\n            <div id=\"ProgressStepsIndicatorDiv\" className={styles.container}>\n              <ProgressStepsIndicator steps={this.progressSteps} currentStep={0} themeVariant={this.props.themeVariant} />\n            </div>\n          }\n          {controlVisibility.Toast &&\n            <div id=\"ToastDiv\" className={styles.container}>\n              <h3>Toast</h3>\n              <Toast\n                title=\"Decision saved\"\n                body=\"This native Fluent UI toast will dismiss after five seconds.\"\n                subtitle=\"Controls Test\"\n                intent=\"success\"\n                dismissible\n                autoDismiss\n                duration={5}\n                durationUnit=\"seconds\"\n              />\n            </div>\n          }\n          {controlVisibility.GridLayout &&\n            <div id=\"GridLayoutDiv\" className={styles.container}>\n              <div className=\"ms-font-l\">Grid Layout</div>\n              <GridLayout\n                ariaLabel={\"List of content, use right and left arrow keys to navigate, arrow down to access details.\"}\n                items={sampleGridData}\n                onRenderGridItem={(item: any, finalSize: ISize, isCompact: boolean) => this._onRenderGridItem(item, finalSize, isCompact)}\n                itemMinWidth={250}\n                itemMaxWidth={600}\n                itemPadding={60}\n                //compactThreshold={220}\n                //rowsPerPage={1}\n                />\n            </div>\n          }\n          {controlVisibility.HoverReactionsBar &&\n            <div ref={this.divRefAddReaction} id=\"HoverReactionsBarDiv\" className={styles.container}>\n              <PrimaryButton text=\"Open HoverReactionsBar\" onClick={() => { this.setState({ isOpenHoverReactionBar: true }); }} />\n              <HoverReactionsBar\n                isOpen={this.state.isOpenHoverReactionBar}\n                onSelect={(emoji, emojiInfo) => { console.log(emoji); }}\n                onDismiss={(): void => {\n                  this.setState({ isOpenHoverReactionBar: false });\n                }}\n                target={this.divRefAddReaction.current as HTMLDivElement} />\n            </div>\n          }\n          {controlVisibility.FolderExplorer &&\n            <div id=\"FolderExplorerDiv\" className={styles.container}>\n              <FolderExplorer\n                context={this.props.context}\n                rootFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                defaultFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                onSelect={this._onFolderSelect}\n                canCreateFolders={true}\n                orderby='Name' //'ListItemAllFields/Created'\n                orderAscending={true}\n                showFiles={true}\n                onFileClick={this._onFileClick}\n              />\n            </div>\n          }\n          {controlVisibility.TreeView &&\n            <div id=\"TreeViewDiv\" className={styles.container}>\n              <h3>Tree View</h3>\n              <TreeView items={this.treeitems}\n                defaultExpanded={false}\n                selectionMode={TreeViewSelectionMode.Multiple}\n                showCheckboxes={true}\n                treeItemActionsDisplayMode={TreeItemActionsDisplayMode.ContextualMenu}\n                defaultSelectedKeys={this.state.treeViewSelectedKeys}\n                onExpandCollapse={this.onExpandCollapseTree}\n                onSelect={this.onItemSelected}\n                defaultExpandedChildren={true}\n                theme={this.props.themeVariant}\n              //expandToSelected={true}\n              // onRenderItem={this.renderCustomTreeItem}\n              />\n              <PrimaryButton onClick={() => { this.setState({ treeViewSelectedKeys: [] }); }}>Clear selection</PrimaryButton>\n            </div>\n          }\n          {controlVisibility.Pagination &&\n            <div id=\"PaginationDiv\" className={styles.container}>\n              <Pagination\n                currentPage={3}\n                onChange={(page) => (this._getPage(page))}\n                totalPages={this.props.paginationTotalPages || 13}\n              //limiter={3}\n              // hideFirstPageJump\n              //hideLastPageJump\n              //limiterIcon={\"NumberedListText\"}\n              />\n            </div>\n          }\n          {controlVisibility.FieldCollectionData &&\n            <div id=\"FieldCollectionDataDiv\" className={styles.container}>\n              <FieldCollectionData\n                key={\"FieldCollectionData\"}\n                label={\"Fields Collection\"}\n                itemsPerPage={3}\n                manageBtnLabel={\"Manage\"}\n                onChanged={(value) => { console.log(value); }}\n                panelHeader={\"Manage values\"}\n                enableSorting={true}\n                panelProps={{ type: PanelType.custom, customWidth: \"98vw\" }}\n                fields={[\n                  { id: \"Field1\", title: \"String field\", type: CustomCollectionFieldType.string, required: true },\n                  { id: \"Field2\", title: \"Number field\", type: CustomCollectionFieldType.number },\n                  { id: \"Field3\", title: \"URL field\", type: CustomCollectionFieldType.url },\n                  { id: \"Field4\", title: \"Boolean field\", type: CustomCollectionFieldType.boolean },\n                  {\n                    id: \"Field5\", title: \"People picker\", type: CustomCollectionFieldType.peoplepicker, required: true,\n                    minimumUsers: 2, minimumUsersMessage: \"2 Users is the minimum\", maximumUsers: 3,\n                  },\n                  {\n                    id: \"Field6\", title: \"Combo Single\", type: CustomCollectionFieldType.combobox, required: true,\n                    multiSelect: false, options: [{ key: \"choice 1\", text: \"choice 1\" }, { key: \"choice 2\", text: \"choice 2\" }, { key: \"choice 3\", text: \"choice 3\" }]\n                  },\n                  {\n                    id: \"Field7\", title: \"Combo Multi\", type: CustomCollectionFieldType.combobox,\n                    allowFreeform: true, multiSelect: true, options: [{ key: \"choice 1\", text: \"choice 1\" }, { key: \"choice 2\", text: \"choice 2\" }, { key: \"choice 3\", text: \"choice 3\" }]\n                  },\n                  { id: \"Field8\", title: \"Date field\", type: CustomCollectionFieldType.date, placeholder: \"Select a date\" }\n                ]}\n                value={this.getRandomCollectionFieldData()}\n\n                // value = {null}\n                context={this.props.context as any} //error when this is omitted and people picker is used\n                usePanel={true}\n                noDataMessage=\"No data is selected\" //overrides the default message\n              />\n            </div>\n          }\n          {controlVisibility.ContentTypePicker &&\n            <ContentTypePicker\n              context={this.props.context}\n            // group=\"Content Feedback\"\n            // includeHidden={false}\n            // includeReadOnly={false}\n            // label=\"Select your content type\"\n            // multiSelect={false}\n            // orderBy={ContentTypesOrderBy.Name}\n            // listId=\"00000000-0000-0000-0000-000000000000\"\n            // onSelectionChanged={this.onContentTypePickerChanged}\n            // showBlankOption={true}\n            />\n          }\n          {controlVisibility.Dashboard &&\n            <div id=\"DashboardDiv\" className={styles.container}>\n              <Dashboard\n                widgets={[{\n                  title: \"Card 1\",\n                  desc: \"Last updated Monday, April 4 at 11:15 AM (PT)\",\n                  widgetActionGroup: calloutItemsExample,\n                  size: WidgetSize.Quadruple,\n                  body: [\n                    {\n                      id: \"t1\",\n                      title: \"Tab 1\",\n                      content: (\n                        <Flex\n                          vAlign=\"center\"\n                          hAlign=\"center\"\n                          styles={{ height: \"100%\", border: \"1px dashed rgb(179, 176, 173)\" }}\n                        >\n                          <NorthstarText size=\"large\" weight=\"semibold\">\n                            Content #1\n                          </NorthstarText>\n                        </Flex>\n                      ),\n                    },\n                    {\n                      id: \"t2\",\n                      title: \"Tab 2\",\n                      content: (\n                        <Flex\n                          vAlign=\"center\"\n                          hAlign=\"center\"\n                          styles={{ height: \"100%\", border: \"1px dashed rgb(179, 176, 173)\" }}\n                        >\n                          <NorthstarText size=\"large\" weight=\"semibold\">\n                            Content #2\n                          </NorthstarText>\n                        </Flex>\n                      ),\n                    },\n                    {\n                      id: \"t3\",\n                      title: \"Tab 3\",\n                      content: (\n                        <Flex\n                          vAlign=\"center\"\n                          hAlign=\"center\"\n                          styles={{ height: \"100%\", border: \"1px dashed rgb(179, 176, 173)\" }}\n                        >\n                          <NorthstarText size=\"large\" weight=\"semibold\">\n                            Content #3\n                          </NorthstarText>\n                        </Flex>\n                      ),\n                    },\n                  ],\n                  link: linkExample,\n                },\n                {\n                  title: \"Card 2\",\n                  size: WidgetSize.Single,\n                  link: customizedLinkExample,\n                  rowSpan: 2\n                },\n                {\n                  title: \"Card 3\",\n                  size: WidgetSize.Double,\n                  link: linkExample,\n                },\n                {\n                  title: \"Card 4\",\n                  size: WidgetSize.Single,\n                  link: customizedLinkExample,\n                },\n                {\n                  title: \"Card 5\",\n                  size: WidgetSize.Single,\n                  link: linkExample,\n                },\n                {\n                  title: \"Card 6\",\n                  size: WidgetSize.Single,\n                  link: linkExample,\n                }]} />\n            </div>\n          }\n          {controlVisibility.Toolbar &&\n            <div id=\"ToolbarDiv\" className={styles.container}>\n              <div>\n                <h3>Uncontrolled toolbar</h3>\n                <Toolbar actionGroups={{\n                  'group1': {\n                    'action1': {\n                      title: 'Edit',\n                      iconName: 'Edit',\n                      onClick: () => { console.log('Edit action click'); }\n                    },\n                    'action2': {\n                      title: 'New',\n                      iconName: 'Add',\n                      onClick: () => { console.log('New action click'); }\n                    }\n                  }\n                }}\n                  filters={toolbarFilters}\n                  onSelectedFiltersChange={this.onToolbarSelectedFiltersChange}\n                />\n              </div>\n              <div>\n                <h3>Controlled toolbar</h3>\n                <Toolbar actionGroups={{\n                  'group1': {\n                    'action1': {\n                      title: 'Edit',\n                      iconName: 'Edit',\n                      onClick: () => { console.log('Edit action click'); }\n                    },\n                    'action2': {\n                      title: 'New',\n                      iconName: 'Add',\n                      onClick: () => { console.log('New action click'); }\n                    }\n                  }\n                }}\n                  filters={toolbarFilters}\n                  selectedFilterIds={this.state.selectedFilters}\n                  onSelectedFiltersChange={this.onToolbarSelectedFiltersChange} />\n              </div>\n              <div>Selected filter IDs: {this.state.selectedFilters.join(\", \")}</div>\n              <PrimaryButton text='Toggle filter1' onClick={() => this.toggleToolbarFilter(\"filter1\")} />\n              <PrimaryButton text='Toggle filter2' onClick={() => this.toggleToolbarFilter(\"filter2\")} />\n            </div>\n          }\n          {controlVisibility.AnimatedDialog &&\n            <div id=\"AnimatedDialogDiv\" className={styles.container}>\n              <h3>Animated Dialogs</h3>\n\n              {/* Multiple elements added only for demo - can be controlled with fewer elements */}\n\n              <PrimaryButton text='Show animated dialog' onClick={() => { this.setState({ showAnimatedDialog: true }); }} />\n              {/* Normal animated dialog */}\n              <AnimatedDialog\n                hidden={!this.state.showAnimatedDialog}\n                onDismiss={() => { this.setState({ showAnimatedDialog: false }); }}\n                dialogContentProps={animatedDialogContentProps}\n                modalProps={animatedModalProps}\n              >\n                <DialogFooter>\n                  <PrimaryButton onClick={() => { this.setState({ showAnimatedDialog: false }); }} text=\"Yes\" />\n                  <DefaultButton onClick={() => { this.setState({ showAnimatedDialog: false }); }} text=\"No\" />\n                </DialogFooter>\n              </AnimatedDialog>\n              <br />\n              <br />\n\n              <PrimaryButton text='Show animated dialog with icon' onClick={() => { this.setState({ showCustomisedAnimatedDialog: true }); }} />\n              {/* Animated dialog with icon */}\n              <AnimatedDialog\n                hidden={!this.state.showCustomisedAnimatedDialog}\n                onDismiss={() => { this.setState({ showCustomisedAnimatedDialog: false }); }}\n                dialogContentProps={customizedAnimatedDialogContentProps}\n                modalProps={customizedAnimatedModalProps}\n                dialogAnimationInType='fadeInDown'\n                dialogAnimationOutType='fadeOutDown'\n                iconName='UnknownSolid'\n                iconAnimationType='zoomInDown'\n                showAnimatedDialogFooter={true}\n                okButtonText=\"Yes\"\n                cancelButtonText=\"No\"\n                onOkClick={() => timeout(1500)}\n                onSuccess={() => {\n                  this.setState({ showCustomisedAnimatedDialog: false });\n                  this.setState({ showSuccessDialog: true });\n                }}\n                onError={() => {\n                  this.setState({ showCustomisedAnimatedDialog: false });\n                  this.setState({ showErrorDialog: true });\n                }}>\n                <div className={styles.dialogContent}>\n                  <span>Do you like the animated dialog?</span>\n                </div>\n              </AnimatedDialog>\n\n              {/* Success animated dialog */}\n              <AnimatedDialog\n                hidden={!this.state.showSuccessDialog}\n                onDismiss={() => { this.setState({ showSuccessDialog: false }); }}\n                dialogContentProps={successDialogContentProps}\n                modalProps={customizedAnimatedModalProps}\n                iconName='CompletedSolid'\n              >\n                <div className={styles.dialogContent}><span>Thank you.</span></div>\n                <div className={styles.dialogFooter}>\n                  <PrimaryButton onClick={() => { this.setState({ showSuccessDialog: false }); }} text=\"OK\" >\n                  </PrimaryButton>\n                </div>\n              </AnimatedDialog>\n\n              {/* Error animated dialog */}\n              <AnimatedDialog\n                hidden={!this.state.showErrorDialog}\n                onDismiss={() => { this.setState({ showErrorDialog: false }); }}\n                dialogContentProps={errorDialogContentProps}\n                modalProps={customizedAnimatedModalProps}\n                iconName='StatusErrorFull'\n              >\n                <div className={styles.dialogContent}><span>Ther was an error.</span></div>\n                <div className={styles.dialogFooter}>\n                  <PrimaryButton onClick={() => { this.setState({ showErrorDialog: false }); }} text=\"OK\" >\n                  </PrimaryButton>\n                </div>\n              </AnimatedDialog>\n            </div>\n          }\n          {controlVisibility.LivePersona &&\n            <div id=\"LivePersonaDiv\" className={styles.container}>\n              <LivePersona upn=\"meganb@contoso.onmicrosoft.com\"\n                template={\n                  <>\n                    <Persona text=\"Megan Bowen\" secondaryText=\"meganb@contoso.onmicrosoft.com\" coinSize={48} />\n                  </>\n                }\n                serviceScope={this.props.context.serviceScope}\n              />\n            </div>\n          }\n          {controlVisibility.LocationPicker &&\n            <div id=\"LocationPickerDiv\" className={styles.container}>\n              <LocationPicker context={this.props.context} label=\"Location\" onChange={(locValue: ILocationPickerItem) => { console.log(locValue.DisplayName + \", \" + locValue.Address.Street); }}></LocationPicker>\n            </div>\n          }\n          {controlVisibility.ModernTaxonomyPicker &&\n            <div id=\"ModernTaxonomyPickerDiv\" className={styles.container}>\n              <ModernTaxonomyPicker\n                allowMultipleSelections={true}\n                termSetId={this.termSetId}\n                panelTitle=\"Panel title\"\n                label={\"Modern Taxonomy Picker\"}\n                context={this.props.context}\n                required={false}\n                disabled={false}\n                customPanelWidth={400}\n              />\n            </div>\n          }\n          {controlVisibility.MonacoEditor &&\n            <div id=\"MonacoEditorDiv\" className={styles.container}>\n              <MonacoEditor value={\"\"}\n                showMiniMap={true}\n                onValueChange={(value, validationErrors) => { console.log(value); console.log(validationErrors); }}\n                language={\"javascript\"} />\n            </div>\n          }\n          {controlVisibility.AdaptiveCardHost &&\n            <div id=\"AdaptiveCardHostDiv\" className={styles.container}>\n              <h3>Adaptive Card Host</h3>\n              <AdaptiveCardHost\n                card={{\n                  \"$schema\": \"http://adaptivecards.io/schemas/adaptive-card.json\",\n                  \"type\": \"AdaptiveCard\",\n                  \"version\": \"1.0\",\n                  \"body\": [\n                    {\n                      \"type\": \"TextBlock\",\n                      \"size\": \"medium\",\n                      \"weight\": \"bolder\",\n                      \"text\": \" ${ParticipantInfoForm.title}\",\n                      \"horizontalAlignment\": \"center\",\n                      \"wrap\": true,\n                      \"style\": \"heading\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Name\",\n                      \"style\": \"text\",\n                      \"id\": \"SimpleVal\",\n                      \"isRequired\": true,\n                      \"errorMessage\": \"Name is required\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Homepage\",\n                      \"style\": \"url\",\n                      \"id\": \"UrlVal\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Email\",\n                      \"style\": \"email\",\n                      \"id\": \"EmailVal\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Phone\",\n                      \"style\": \"tel\",\n                      \"id\": \"TelVal\"\n                    },\n                    {\n                      \"type\": \"Input.Text\",\n                      \"label\": \"Comments\",\n                      \"style\": \"text\",\n                      \"isMultiline\": true,\n                      \"id\": \"MultiLineVal\"\n                    },\n                    {\n                      \"type\": \"Input.Number\",\n                      \"label\": \"Quantity\",\n                      \"min\": -5,\n                      \"max\": 5,\n                      \"value\": 1,\n                      \"id\": \"NumVal\",\n                      \"errorMessage\": \"The quantity must be between -5 and 5\"\n                    },\n                    {\n                      \"type\": \"Input.Date\",\n                      \"label\": \"Due Date\",\n                      \"id\": \"DateVal\",\n                      \"value\": \"2017-09-20\"\n                    },\n                    {\n                      \"type\": \"Input.Time\",\n                      \"label\": \"Start time\",\n                      \"id\": \"TimeVal\",\n                      \"value\": \"16:59\"\n                    },\n                    {\n                      \"type\": \"TextBlock\",\n                      \"size\": \"medium\",\n                      \"weight\": \"bolder\",\n                      \"text\": \"${Survey.title} \",\n                      \"horizontalAlignment\": \"center\",\n                      \"wrap\": true,\n                      \"style\": \"heading\"\n                    },\n                    {\n                      \"type\": \"Input.ChoiceSet\",\n                      \"id\": \"CompactSelectVal\",\n                      \"label\": \"${Survey.questions[0].question}\",\n                      \"style\": \"compact\",\n                      \"value\": \"1\",\n                      \"choices\": [\n                        {\n                          \"$data\": \"${Survey.questions[0].items}\",\n                          \"title\": \"${choice}\",\n                          \"value\": \"${value}\"\n                        }\n                      ]\n                    },\n                    {\n                      \"type\": \"Input.ChoiceSet\",\n                      \"id\": \"SingleSelectVal\",\n                      \"label\": \"${Survey.questions[1].question}\",\n                      \"style\": \"expanded\",\n                      \"value\": \"1\",\n                      \"choices\": [\n                        {\n                          \"$data\": \"${Survey.questions[1].items}\",\n                          \"title\": \"${choice}\",\n                          \"value\": \"${value}\"\n                        }\n                      ]\n                    },\n                    {\n                      \"type\": \"Input.ChoiceSet\",\n                      \"id\": \"MultiSelectVal\",\n                      \"label\": \"${Survey.questions[2].question}\",\n                      \"isMultiSelect\": true,\n                      \"value\": \"1,3\",\n                      \"choices\": [\n                        {\n                          \"$data\": \"${Survey.questions[2].items}\",\n                          \"title\": \"${choice}\",\n                          \"value\": \"${value}\"\n                        }\n                      ]\n                    },\n                    {\n                      \"type\": \"TextBlock\",\n                      \"size\": \"medium\",\n                      \"weight\": \"bolder\",\n                      \"text\": \"Input.Toggle\",\n                      \"horizontalAlignment\": \"center\",\n                      \"wrap\": true,\n                      \"style\": \"heading\"\n                    },\n                    {\n                      \"type\": \"Input.Toggle\",\n                      \"label\": \"Please accept the terms and conditions:\",\n                      \"title\": \"${Survey.questions[3].question}\",\n                      \"valueOn\": \"true\",\n                      \"valueOff\": \"false\",\n                      \"id\": \"AcceptsTerms\",\n                      \"isRequired\": true,\n                      \"errorMessage\": \"Accepting the terms and conditions is required\"\n                    },\n                    {\n                      \"type\": \"Input.Toggle\",\n                      \"label\": \"How do you feel about red cars?\",\n                      \"title\": \"${Survey.questions[4].question}\",\n                      \"valueOn\": \"RedCars\",\n                      \"valueOff\": \"NotRedCars\",\n                      \"id\": \"ColorPreference\"\n                    }\n                  ],\n                  \"actions\": [\n                    {\n                      \"type\": \"Action.Submit\",\n                      \"title\": \"Submit\",\n                      \"data\": {\n                        \"id\": \"1234567890\"\n                      }\n                    },\n                    {\n                      \"type\": \"Action.ShowCard\",\n                      \"title\": \"Show Card\",\n                      \"card\": {\n                        \"type\": \"AdaptiveCard\",\n                        \"body\": [\n                          {\n                            \"type\": \"Input.Text\",\n                            \"label\": \"enter comment\",\n                            \"style\": \"text\",\n                            \"id\": \"CommentVal\"\n                          }\n                        ],\n                        \"actions\": [\n                          {\n                            \"type\": \"Action.Submit\",\n                            \"title\": \"OK\"\n                          }\n                        ]\n                      }\n                    }\n                  ]\n                }}\n                data={{\n                  \"$root\": {\n                    \"ParticipantInfoForm\": {\n                      \"title\": \"Input.Text elements\"\n                    },\n                    \"Survey\": {\n                      \"title\": \"Input ChoiceSet\",\n                      \"questions\": [\n                        {\n                          \"question\": \"What color do you want? (compact)\",\n                          \"items\": [\n                            {\n                              \"choice\": \"Red\",\n                              \"value\": \"1\"\n                            },\n                            {\n                              \"choice\": \"Green\",\n                              \"value\": \"2\"\n                            },\n                            {\n                              \"choice\": \"Blue\",\n                              \"value\": \"3\"\n                            }\n                          ]\n                        },\n                        {\n                          \"question\": \"What color do you want? (expanded)\",\n                          \"items\": [\n                            {\n                              \"choice\": \"Red\",\n                              \"value\": \"1\"\n                            },\n                            {\n                              \"choice\": \"Green\",\n                              \"value\": \"2\"\n                            },\n                            {\n                              \"choice\": \"Blue\",\n                              \"value\": \"3\"\n                            }\n                          ]\n                        },\n                        {\n                          \"question\": \"What color do you want? (multiselect)\",\n                          \"items\": [\n                            {\n                              \"choice\": \"Red\",\n                              \"value\": \"1\"\n                            },\n                            {\n                              \"choice\": \"Green\",\n                              \"value\": \"2\"\n                            },\n                            {\n                              \"choice\": \"Blue\",\n                              \"value\": \"3\"\n                            }\n                          ]\n                        },\n                        {\n                          \"question\": \"I accept the terms and conditions (True/False)\"\n                        },\n                        {\n                          \"question\": \"Red cars are better than other cars\"\n                        }\n                      ]\n                    }\n                  }\n                }}\n                theme={this.props.themeVariant}\n                themeType={AdaptiveCardHostThemeType.SharePoint}\n                onInvokeAction={(action) => alert(JSON.stringify(action))}\n                onError={(error) => console.log(error.message)}\n                onSetCustomElements={(registry: CardObjectRegistry<CardElement>) => { }}\n                onSetCustomActions={(registry: CardObjectRegistry<Action>) => { }}\n                onUpdateHostCapabilities={(hostCapabilities: HostCapabilities) => {\n                  hostCapabilities.setCustomProperty(\"CustomPropertyName\", Date.now);\n                }}\n                context={this.props.context}\n              />\n            </div>\n          }\n          {controlVisibility.VariantThemeProvider &&\n            <div id=\"VariantThemeProviderDiv\" className={styles.container}>\n              <h3>Variant Theme Provider</h3>\n              <VariantThemeProvider variantType={VariantType.Strong}>\n                <Stack tokens={{ childrenGap: 5, padding: 5 }}>\n                  <Label>This Web Part implements an example on how to use the 'Fluent UI' theme library and how to apply/generate theme variation for the Web Part itself.</Label>\n                  <PrimaryButton>Primary Button</PrimaryButton>\n                  <DefaultButton>Default Button</DefaultButton>\n                  <Link>Link</Link>\n                </Stack>\n              </VariantThemeProvider>\n            </div>\n          }\n          {controlVisibility.EnhancedThemeProvider &&\n            <div id=\"EnhancedThemeProviderDiv\" className={styles.container}>\n              <h3>Enhanced Theme Provider</h3>\n              <EnhancedThemeProvider applyTo=\"element\" context={this.props.context} theme={this.props.themeVariant}>\n                <ControlsTestEnhancedThemeProviderFunctionComponent />\n                <ControlsTestEnhancedThemeProvider />\n              </EnhancedThemeProvider>\n            </div>\n          }\n          {controlVisibility.AdaptiveCardDesignerHost &&\n            <div id=\"AdaptiveCardDesignerHostDiv\" className={styles.container}>\n              <h3>Adaptive Card Designer Host</h3>\n              <AdaptiveCardDesignerHost\n                headerText={`Adaptive Card Designer`}\n                buttonText=\"Open Designer\"\n                card={{ \"$schema\": \"http://adaptivecards.io/schemas/adaptive-card.json\", \"type\": \"AdaptiveCard\", \"version\": \"1.5\", \"body\": [{ \"type\": \"ColumnSet\", \"columns\": [{ \"width\": \"auto\", \"items\": [{ \"type\": \"Image\", \"size\": \"Small\", \"style\": \"Person\", \"url\": \"/_layouts/15/userphoto.aspx?size=M&username=${$root['@context']['userInfo']['email']}\" }], \"type\": \"Column\" }, { \"width\": \"stretch\", \"items\": [{ \"type\": \"TextBlock\", \"text\": \"${$root['@context']['userInfo']['displayName']}\", \"weight\": \"Bolder\" }, { \"type\": \"TextBlock\", \"spacing\": \"None\", \"text\": \"${$root['@context']['userInfo']['email']}\" }], \"type\": \"Column\" }] }] }}\n                data={undefined}\n                context={this.props.context}\n                theme={this.props.themeVariant}\n                onSave={(payload: object) => alert(JSON.stringify(payload))}\n                snippets={[{\n                  name: \"Persona\",\n                  category: \"Snippets\",\n                  payload: {\n                    type: \"ColumnSet\",\n                    columns: [\n                      {\n                        width: \"auto\",\n                        items: [\n                          {\n                            type: \"Image\",\n                            size: \"Small\",\n                            style: \"Person\",\n                            url: \"/_layouts/15/userphoto.aspx?size=M&username=${$root['@context']['userInfo']['email']}\"\n                          }\n                        ]\n                      },\n                      {\n                        width: \"stretch\",\n                        items: [\n                          {\n                            type: \"TextBlock\",\n                            text: \"${$root['@context']['userInfo']['displayName']}\",\n                            weight: \"Bolder\"\n                          },\n                          {\n                            type: \"TextBlock\",\n                            spacing: \"None\",\n                            text: \"${$root['@context']['userInfo']['email']}\"\n                          }\n                        ]\n                      }\n                    ]\n                  }\n                }]}\n              />\n            </div>\n          }\n          {controlVisibility.ShareDialog &&\n            <div id=\"ShareDialogDiv\" className={styles.container}>\n              <PrimaryButton text=\"Open Share dialog\" onClick={() => { this.setState({ isOpenShareDialog: true }); }} />\n              <ShareDialog\n                isOpen={this.state.isOpenShareDialog}\n                onClose={() => this.setState({ isOpenShareDialog: false })}\n                options={{\n                  siteUrl: this.props.context.pageContext.web.absoluteUrl,\n                  listId: 'b1416fca-dc77-4198-a082-62a7657dcfa9',\n                  itemId: 1,\n                  name: 'Document Name'\n                }} />\n            </div>\n          }\n          {controlVisibility.TaxonomyTree &&\n            <div id=\"TaxonomyTreeDiv\" className={styles.container} hidden={!controlVisibility.TaxonomyTree}>\n              <h3>Modern Taxonomy Tree</h3>\n              {this.state.termStoreInfo && (\n                <TaxonomyTree\n                  languageTag={this.state.termStoreInfo.defaultLanguageTag}\n                  onLoadMoreData={this.spTaxonomyService.getTerms}\n                  pageSize={50}\n                  setTerms={(value) => this.setState({ testTerms: value as any })}\n                  termStoreInfo={this.state.termStoreInfo}\n                  termSetInfo={this.state.termSetInfo}\n                  terms={this.state.testTerms as any[]}\n                  onRenderActionButton={() => <button>test button</button>}\n                  hideDeprecatedTerms={false}\n                  showIcons={true}\n                />\n              )}\n            </div>\n          }\n          {controlVisibility.ListToolbar &&\n            <div id=\"ListToolbarDiv\" className={styles.container}>\n              <h3>ListToolbar</h3>\n              <ListToolbar\n                context={this.props.context}\n                theme={this.props.themeVariant as any}\n                items={[\n                  { key: 'new', label: 'New', icon: <span>+</span>, onClick: () => console.log('New clicked'), group: 'actions' },\n                  { key: 'edit', label: 'Edit', icon: <span>✎</span>, onClick: () => console.log('Edit clicked'), group: 'actions' },\n                  { key: 'delete', label: 'Delete', icon: <span>🗑</span>, onClick: () => console.log('Delete clicked'), appearance: 'subtle', group: 'danger' },\n                ]}\n                farItems={[\n                  { key: 'filter', label: 'Filter', icon: <span>🔍</span>, onClick: () => console.log('Filter clicked'), isFarItem: true },\n                  { key: 'settings', label: 'Settings', icon: <span>⚙</span>, onClick: () => console.log('Settings clicked'), isFarItem: true },\n                ]}\n                totalCount={10}\n                showGroupDividers={true}\n                ariaLabel=\"List Toolbar\"\n              />\n            </div>\n          }\n          {controlVisibility.TestControl &&\n            <div id=\"TestControlDiv\" className={styles.container}>\n              <TestControl context={this.props.context} themeVariant={this.props.themeVariant} />\n            </div>\n          }\n          {controlVisibility.UploadFiles &&\n            <div id=\"UploadFilesDiv\" className={styles.container}>\n              <h3>Upload Files</h3>\n              <EnhancedThemeProvider theme={this.props.themeVariant} context={this.props.context}>\n                <Stack>\n                  <UploadFiles\n                    context={this.props.context}\n                    title=\"Upload Files\"\n                    onUploadFiles={(files) => {\n                      console.log(\"files\", files);\n                    }}\n                    themeVariant={this.props.themeVariant}\n                  />\n                </Stack>\n              </EnhancedThemeProvider>\n            </div>\n          }\n          {controlVisibility.UserPicker &&\n            <div id=\"UserPickerDiv\" className={styles.container}>\n              <UserPicker\n                context={this.props.context}\n                secondaryTextPropertyName=\"mail\"\n                theme={this.props.themeVariant}\n                placeholder={\"Search User\"}\n              // label={\n              //   <div>\n              //     <Person20Filled color={tokens.colorBrandForeground1} />\n              //     <Body1>Select User</Body1>\n              //   </div>\n              // }\n              // onSelectedUsers={onSelectedUsers}\n              // onRemoveSelectedUser={onRemovedUser}\n              />\n            </div>\n          }\n          {\n            controlVisibility.Calendar &&\n            <div id=\"CalendarDiv\" className={styles.container}>\n              <TestCalendarControl\n                  context={this.props.context} theme={this.props.themeVariant as any}   hasTeamsContext={false} themeString={'default'} title={'Calendar'} appHostName={EAppHostName.SharePoint} />\n            </div>\n\n          }\n          {\n            controlVisibility.SPFilePicker &&\n            <div id=\"SPFilePickerDiv\" className={styles.container}>\n              <TestSPFilePickerControl context={this.props.context} />\n            </div>\n\n          }\n          {controlVisibility.WorldMap &&\n            <div id=\"WorldMapDiv\" className={styles.container}>\n              <WorldMap description={'World Map Sample'} isDarkTheme={false} hasTeamsContext={false} title={'Microsoft Locations Worldwide'}     />\n            </div>\n          }\n        </div>\n      </React.Suspense>\n    );\n  }\n\n  private getRandomCollectionFieldData = () => {\n    let result = [];\n    for (let i = 1; i < 16; i++) {\n\n      const sampleDate = new Date();\n      sampleDate.setDate(sampleDate.getDate() + i);\n\n      result.push({\n        \"Field1\": `String${i}`,\n        \"Field2\": i,\n        \"Field3\": \"https://pnp.github.io/\",\n        \"Field4\": true,\n        \"Field5\": null as any,\n        \"Field6\": { key: \"choice 1\", text: \"choice 1\" },\n        \"Field7\": [{ key: \"choice 1\", text: \"choice 1\" }, { key: \"choice 2\", text: \"choice 2\" }],\n        \"Field8\": sampleDate\n      });\n    }\n    return result;\n  }\n\n  private onExpandCollapseTree(item: ITreeItem, isExpanded: boolean) {\n    console.log((isExpanded ? \"item expanded: \" : \"item collapsed: \") + item);\n  }\n\n  private onItemSelected(items: ITreeItem[]) {\n    console.log(\"items selected: \" + items.length);\n  }\n\n  private renderCustomTreeItem(item: ITreeItem): JSX.Element {\n    return (\n      <span>\n        {\n          item.iconProps &&\n          <i className={\"ms-Icon ms-Icon--\" + item.iconProps.iconName} style={{ paddingRight: '4px' }} />\n        }\n        {item.label}\n      </span>\n    );\n  }\n\n  private _getPage(page: number) {\n    console.log('Page:', page);\n  }\n\n  // private _onFolderSelect = (folder: IFolder): void => {\n  //   console.log('selected folder', folder);\n  //\n}\n"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "max-lines",
-          "ruleIndex": 19,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Unexpected any. Specify a different type."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2115,
-                  "startColumn": 42,
-                  "endLine": 2115,
-                  "endColumn": 45,
-                  "snippet": {
-                    "text": "any"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "@typescript-eslint/no-explicit-any",
-          "ruleIndex": 0,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Unexpected any. Specify a different type."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2152,
+                  "startLine": 2151,
                   "startColumn": 42,
-                  "endLine": 2152,
+                  "endLine": 2151,
                   "endColumn": 45,
                   "snippet": {
                     "text": "any"
@@ -23117,34 +22432,6 @@
           "ruleIndex": 0,
           "suppressions": []
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Empty components are self-closing"
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2169,
-                  "startColumn": 15,
-                  "endLine": 2178,
-                  "endColumn": 16,
-                  "snippet": {
-                    "text": "<FolderPicker context={this.props.context}\n                rootFolder={{\n                  Name: 'Documents',\n                  ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`\n                }}\n                onSelect={this._onFolderSelect}\n                label='Folder Picker'\n                required={true}\n                canCreateFolders={true}\n              >"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "react/self-closing-comp",
-          "ruleIndex": 18,
-          "suppressions": []
-        },
         {
           "level": "warning",
           "message": {
@@ -23158,9 +22445,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 2336,
+                  "startLine": 2335,
                   "startColumn": 26,
-                  "endLine": 2336,
+                  "endLine": 2335,
                   "endColumn": 40,
                   "snippet": {
                     "text": "\"javascript:;\""
@@ -23170,7 +22457,7 @@
             }
           ],
           "ruleId": "no-script-url",
-          "ruleIndex": 20,
+          "ruleIndex": 18,
           "suppressions": []
         },
         {
@@ -23186,9 +22473,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 2380,
+                  "startLine": 2379,
                   "startColumn": 42,
-                  "endLine": 2380,
+                  "endLine": 2379,
                   "endColumn": 45,
                   "snippet": {
                     "text": "any"
@@ -23214,9 +22501,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 2487,
+                  "startLine": 2486,
                   "startColumn": 48,
-                  "endLine": 2487,
+                  "endLine": 2486,
                   "endColumn": 51,
                   "snippet": {
                     "text": "any"
@@ -23229,90 +22516,6 @@
           "ruleIndex": 0,
           "suppressions": []
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Empty components are self-closing"
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2699,
-                  "startColumn": 19,
-                  "endLine": 2699,
-                  "endColumn": 110,
-                  "snippet": {
-                    "text": "<PrimaryButton onClick={() => { this.setState({ showSuccessDialog: false }); }} text=\"OK\" >"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "react/self-closing-comp",
-          "ruleIndex": 18,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Empty components are self-closing"
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2714,
-                  "startColumn": 19,
-                  "endLine": 2714,
-                  "endColumn": 108,
-                  "snippet": {
-                    "text": "<PrimaryButton onClick={() => { this.setState({ showErrorDialog: false }); }} text=\"OK\" >"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "react/self-closing-comp",
-          "ruleIndex": 18,
-          "suppressions": []
-        },
-        {
-          "level": "warning",
-          "message": {
-            "text": "Empty components are self-closing"
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 2734,
-                  "startColumn": 15,
-                  "endLine": 2734,
-                  "endColumn": 195,
-                  "snippet": {
-                    "text": "<LocationPicker context={this.props.context} label=\"Location\" onChange={(locValue: ILocationPickerItem) => { console.log(locValue.DisplayName + \", \" + locValue.Address.Street); }}>"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "react/self-closing-comp",
-          "ruleIndex": 18,
-          "suppressions": []
-        },
         {
           "level": "warning",
           "message": {
@@ -23326,7 +22529,7 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3028,
+                  "startLine": 3025,
                   "startColumn": 80,
                   "snippet": {
                     "text": "'Fluent UI' theme library and how to apply/generate theme variation for the Web Part itself.</Label>"
@@ -23336,7 +22539,7 @@
             }
           ],
           "ruleId": "react/no-unescaped-entities",
-          "ruleIndex": 21,
+          "ruleIndex": 19,
           "suppressions": []
         },
         {
@@ -23352,7 +22555,7 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3028,
+                  "startLine": 3025,
                   "startColumn": 90,
                   "snippet": {
                     "text": "' theme library and how to apply/generate theme variation for the Web Part itself.</Label>"
@@ -23362,7 +22565,7 @@
             }
           ],
           "ruleId": "react/no-unescaped-entities",
-          "ruleIndex": 21,
+          "ruleIndex": 19,
           "suppressions": []
         },
         {
@@ -23378,9 +22581,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3116,
+                  "startLine": 3113,
                   "startColumn": 76,
-                  "endLine": 3116,
+                  "endLine": 3113,
                   "endColumn": 79,
                   "snippet": {
                     "text": "any"
@@ -23406,9 +22609,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3119,
+                  "startLine": 3116,
                   "startColumn": 50,
-                  "endLine": 3119,
+                  "endLine": 3116,
                   "endColumn": 53,
                   "snippet": {
                     "text": "any"
@@ -23434,9 +22637,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3132,
+                  "startLine": 3129,
                   "startColumn": 51,
-                  "endLine": 3132,
+                  "endLine": 3129,
                   "endColumn": 54,
                   "snippet": {
                     "text": "any"
@@ -23462,9 +22665,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3192,
+                  "startLine": 3189,
                   "startColumn": 82,
-                  "endLine": 3192,
+                  "endLine": 3189,
                   "endColumn": 85,
                   "snippet": {
                     "text": "any"
@@ -23490,9 +22693,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3213,
+                  "startLine": 3210,
                   "startColumn": 3,
-                  "endLine": 3213,
+                  "endLine": 3210,
                   "endColumn": 42,
                   "snippet": {
                     "text": "private getRandomCollectionFieldData = "
@@ -23505,34 +22708,6 @@
           "ruleIndex": 9,
           "suppressions": []
         },
-        {
-          "level": "warning",
-          "message": {
-            "text": "'result' is never reassigned. Use 'const' instead."
-          },
-          "locations": [
-            {
-              "physicalLocation": {
-                "artifactLocation": {
-                  "uri": "src/webparts/controlsTest/components/ControlsTest.tsx",
-                  "index": 914
-                },
-                "region": {
-                  "startLine": 3214,
-                  "startColumn": 9,
-                  "endLine": 3214,
-                  "endColumn": 15,
-                  "snippet": {
-                    "text": "result"
-                  }
-                }
-              }
-            }
-          ],
-          "ruleId": "prefer-const",
-          "ruleIndex": 17,
-          "suppressions": []
-        },
         {
           "level": "warning",
           "message": {
@@ -23546,9 +22721,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3225,
+                  "startLine": 3222,
                   "startColumn": 27,
-                  "endLine": 3225,
+                  "endLine": 3222,
                   "endColumn": 30,
                   "snippet": {
                     "text": "any"
@@ -23574,9 +22749,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3234,
+                  "startLine": 3231,
                   "startColumn": 3,
-                  "endLine": 3234,
+                  "endLine": 3231,
                   "endColumn": 31,
                   "snippet": {
                     "text": "private onExpandCollapseTree"
@@ -23602,9 +22777,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3238,
+                  "startLine": 3235,
                   "startColumn": 3,
-                  "endLine": 3238,
+                  "endLine": 3235,
                   "endColumn": 25,
                   "snippet": {
                     "text": "private onItemSelected"
@@ -23630,9 +22805,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 3254,
+                  "startLine": 3251,
                   "startColumn": 3,
-                  "endLine": 3254,
+                  "endLine": 3251,
                   "endColumn": 19,
                   "snippet": {
                     "text": "private _getPage"
@@ -23658,9 +22833,9 @@
                   "index": 914
                 },
                 "region": {
-                  "startLine": 841,
+                  "startLine": 840,
                   "startColumn": 35,
-                  "endLine": 841,
+                  "endLine": 840,
                   "endColumn": 38,
                   "snippet": {
                     "text": "any"
@@ -23871,10 +23046,7 @@
                   "startLine": 49,
                   "startColumn": 22,
                   "endLine": 49,
-                  "endColumn": 25,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 25
                 }
               }
             }
@@ -23904,16 +23076,13 @@
                   "startLine": 65,
                   "startColumn": 5,
                   "endLine": 65,
-                  "endColumn": 50,
-                  "snippet": {
-                    "text": "expect(listView.state('columns')).to.be.null;"
-                  }
+                  "endColumn": 50
                 }
               }
             }
           ],
           "ruleId": "no-unused-expressions",
-          "ruleIndex": 22,
+          "ruleIndex": 20,
           "suppressions": [
             {
               "kind": "inSource",
@@ -23937,16 +23106,13 @@
                   "startLine": 73,
                   "startColumn": 5,
                   "endLine": 73,
-                  "endColumn": 50,
-                  "snippet": {
-                    "text": "expect(listView.state('columns')).to.be.null;"
-                  }
+                  "endColumn": 50
                 }
               }
             }
           ],
           "ruleId": "no-unused-expressions",
-          "ruleIndex": 22,
+          "ruleIndex": 20,
           "suppressions": [
             {
               "kind": "inSource",
@@ -23970,10 +23136,7 @@
                   "startLine": 91,
                   "startColumn": 48,
                   "endLine": 91,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24003,10 +23166,7 @@
                   "startLine": 97,
                   "startColumn": 98,
                   "endLine": 97,
-                  "endColumn": 101,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 101
                 }
               }
             }
@@ -24036,10 +23196,7 @@
                   "startLine": 108,
                   "startColumn": 46,
                   "endLine": 108,
-                  "endColumn": 49,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 49
                 }
               }
             }
@@ -24069,10 +23226,7 @@
                   "startLine": 109,
                   "startColumn": 46,
                   "endLine": 109,
-                  "endColumn": 49,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 49
                 }
               }
             }
@@ -24102,10 +23256,7 @@
                   "startLine": 118,
                   "startColumn": 48,
                   "endLine": 118,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24135,10 +23286,7 @@
                   "startLine": 119,
                   "startColumn": 48,
                   "endLine": 119,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24168,10 +23316,7 @@
                   "startLine": 120,
                   "startColumn": 48,
                   "endLine": 120,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24201,10 +23346,7 @@
                   "startLine": 122,
                   "startColumn": 48,
                   "endLine": 122,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24234,10 +23376,7 @@
                   "startLine": 123,
                   "startColumn": 48,
                   "endLine": 123,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24267,10 +23406,7 @@
                   "startLine": 125,
                   "startColumn": 48,
                   "endLine": 125,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24300,10 +23436,7 @@
                   "startLine": 127,
                   "startColumn": 48,
                   "endLine": 127,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24333,10 +23466,7 @@
                   "startLine": 128,
                   "startColumn": 48,
                   "endLine": 128,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24366,10 +23496,7 @@
                   "startLine": 130,
                   "startColumn": 48,
                   "endLine": 130,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24399,10 +23526,7 @@
                   "startLine": 138,
                   "startColumn": 48,
                   "endLine": 138,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24432,10 +23556,7 @@
                   "startLine": 141,
                   "startColumn": 29,
                   "endLine": 141,
-                  "endColumn": 32,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 32
                 }
               }
             }
@@ -24465,10 +23586,7 @@
                   "startLine": 141,
                   "startColumn": 92,
                   "endLine": 141,
-                  "endColumn": 95,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 95
                 }
               }
             }
@@ -24498,10 +23616,7 @@
                   "startLine": 144,
                   "startColumn": 48,
                   "endLine": 144,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24531,10 +23646,7 @@
                   "startLine": 145,
                   "startColumn": 48,
                   "endLine": 145,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24564,10 +23676,7 @@
                   "startLine": 147,
                   "startColumn": 46,
                   "endLine": 147,
-                  "endColumn": 49,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 49
                 }
               }
             }
@@ -24597,10 +23706,7 @@
                   "startLine": 150,
                   "startColumn": 29,
                   "endLine": 150,
-                  "endColumn": 32,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 32
                 }
               }
             }
@@ -24630,10 +23736,7 @@
                   "startLine": 150,
                   "startColumn": 92,
                   "endLine": 150,
-                  "endColumn": 95,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 95
                 }
               }
             }
@@ -24663,10 +23766,7 @@
                   "startLine": 151,
                   "startColumn": 48,
                   "endLine": 151,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24696,10 +23796,7 @@
                   "startLine": 152,
                   "startColumn": 48,
                   "endLine": 152,
-                  "endColumn": 51,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 51
                 }
               }
             }
@@ -24729,10 +23826,7 @@
                   "startLine": 154,
                   "startColumn": 46,
                   "endLine": 154,
-                  "endColumn": 49,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 49
                 }
               }
             }
@@ -24762,10 +23856,7 @@
                   "startLine": 157,
                   "startColumn": 29,
                   "endLine": 157,
-                  "endColumn": 32,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 32
                 }
               }
             }
@@ -24795,10 +23886,7 @@
                   "startLine": 157,
                   "startColumn": 92,
                   "endLine": 157,
-                  "endColumn": 95,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 95
                 }
               }
             }
@@ -24828,10 +23916,7 @@
                   "startLine": 159,
                   "startColumn": 46,
                   "endLine": 159,
-                  "endColumn": 49,
-                  "snippet": {
-                    "text": "any"
-                  }
+                  "endColumn": 49
                 }
               }
             }
@@ -24980,1443 +24065,6 @@
           "ruleId": "@typescript-eslint/explicit-function-return-type",
           "ruleIndex": 9
         }
-      ],
-      "invocations": [
-        {
-          "toolConfigurationNotifications": [
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@microsoft/spfx/pair-react-dom-render-unmount')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/adaptiveCardHost/fluentUI/Actions.tsx",
-                      "index": 45
-                    },
-                    "region": {
-                      "startLine": 114,
-                      "startColumn": 3,
-                      "snippet": {
-                        "text": "// eslint-disable-next-line @microsoft/spfx/pair-react-dom-render-unmount"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@microsoft/spfx/pair-react-dom-render-unmount')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/adaptiveCardHost/fluentUI/Elements.tsx",
-                      "index": 46
-                    },
-                    "region": {
-                      "startLine": 26,
-                      "startColumn": 40,
-                      "snippet": {
-                        "text": "// eslint-disable-line @microsoft/spfx/pair-react-dom-render-unmount"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-prototype-builtins')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/toolbar/ToolbarFilter.tsx",
-                      "index": 185
-                    },
-                    "region": {
-                      "startLine": 86,
-                      "startColumn": 47,
-                      "snippet": {
-                        "text": "// eslint-disable-line no-prototype-builtins"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/dynamicForm/dynamicField/IDynamicFieldProps.ts",
-                      "index": 290
-                    },
-                    "region": {
-                      "startLine": 48,
-                      "startColumn": 14,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'dot-notation')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/locationPicker/LocationPicker.tsx",
-                      "index": 302
-                    },
-                    "region": {
-                      "startLine": 110,
-                      "startColumn": 83,
-                      "snippet": {
-                        "text": "// eslint-disable-line dot-notation"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'dot-notation')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/locationPicker/LocationPicker.tsx",
-                      "index": 302
-                    },
-                    "region": {
-                      "startLine": 230,
-                      "startColumn": 159,
-                      "snippet": {
-                        "text": "// eslint-disable-line dot-notation"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/richText/RichText.tsx",
-                      "index": 319
-                    },
-                    "region": {
-                      "startLine": 1030,
-                      "startColumn": 3,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/richText/RichText.tsx",
-                      "index": 319
-                    },
-                    "region": {
-                      "startLine": 1151,
-                      "startColumn": 3,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/services/SPTermStorePickerService.ts",
-                      "index": 323
-                    },
-                    "region": {
-                      "startLine": 261,
-                      "startColumn": 3,
-                      "snippet": {
-                        "text": "// eslint-disable-next-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'dot-notation')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/taxonomyPicker/TermPicker.tsx",
-                      "index": 326
-                    },
-                    "region": {
-                      "startLine": 221,
-                      "startColumn": 43,
-                      "snippet": {
-                        "text": "// eslint-disable-line dot-notation, @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'dot-notation')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/taxonomyPicker/TermPicker.tsx",
-                      "index": 326
-                    },
-                    "region": {
-                      "startLine": 232,
-                      "startColumn": 125,
-                      "snippet": {
-                        "text": "// eslint-disable-line dot-notation"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'dot-notation')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/taxonomyPicker/TermPicker.tsx",
-                      "index": 326
-                    },
-                    "region": {
-                      "startLine": 233,
-                      "startColumn": 60,
-                      "snippet": {
-                        "text": "// eslint-disable-line dot-notation"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-case-declarations')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/dynamicForm/dynamicField/DynamicField.tsx",
-                      "index": 353
-                    },
-                    "region": {
-                      "startLine": 287,
-                      "startColumn": 9,
-                      "snippet": {
-                        "text": "//eslint-disable-next-line no-case-declarations"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-case-declarations')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/dynamicForm/dynamicField/DynamicField.tsx",
-                      "index": 353
-                    },
-                    "region": {
-                      "startLine": 313,
-                      "startColumn": 9,
-                      "snippet": {
-                        "text": "//eslint-disable-next-line no-case-declarations"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/common/utilities/CustomFormatting.ts",
-                      "index": 359
-                    },
-                    "region": {
-                      "startLine": 87,
-                      "startColumn": 5,
-                      "snippet": {
-                        "text": "// eslint-disable-next-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@microsoft/spfx/no-async-await')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/dynamicForm/DynamicForm.tsx",
-                      "index": 361
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @microsoft/spfx/no-async-await */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'require-atomic-updates')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/dynamicForm/DynamicForm.tsx",
-                      "index": 361
-                    },
-                    "region": {
-                      "startLine": 851,
-                      "startColumn": 42,
-                      "snippet": {
-                        "text": "// eslint-disable-line require-atomic-updates"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/fieldCollectionData/collectionDataItem/CollectionDataItem.tsx",
-                      "index": 383
-                    },
-                    "region": {
-                      "startLine": 101,
-                      "startColumn": 110,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/HoverReactionsBar/components/reactionPicker/RenderEmoji.tsx",
-                      "index": 466
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-explicit-any */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-unused-expressions')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/HoverReactionsBar/components/reactionPicker/ReactionPicker.tsx",
-                      "index": 467
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable no-unused-expressions */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-unused-expressions')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/HoverReactionsBar/components/hoverReactionbarControl/HoverReactionBarControl.tsx",
-                      "index": 469
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable no-unused-expressions */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@rushstack/no-new-null')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/HoverReactionsBar/components/hoverReactionbarControl/HoverReactionBarControl.tsx",
-                      "index": 469
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @rushstack/no-new-null */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-vars')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/hooks/useSpAPI.ts",
-                      "index": 496
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-unused-vars */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-for-in-array')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/hooks/useSpAPI.ts",
-                      "index": 496
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-for-in-array */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/hooks/useSpAPI.ts",
-                      "index": 496
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-explicit-any */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/hooks/useUtils.ts",
-                      "index": 497
-                    },
-                    "region": {
-                      "startLine": 168,
-                      "startColumn": 29,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-vars')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/hooks/useUploadFile.ts",
-                      "index": 508
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-unused-vars */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/uploadFiles/UploadFile.tsx",
-                      "index": 514
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-explicit-any */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-var-requires')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/imagePicker/selectFromSharePoint.tsx",
-                      "index": 517
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-var-requires */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-floating-promises')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/KPIControl/Kpis.tsx",
-                      "index": 535
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-floating-promises */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-deprecated')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/listItemComments/components/Comments/useListItemCommentsStyles.ts",
-                      "index": 570
-                    },
-                    "region": {
-                      "startLine": 164,
-                      "startColumn": 7,
-                      "snippet": {
-                        "text": "// eslint-disable-next-line @typescript-eslint/no-deprecated"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/explicit-function-return-type')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/ProgressStepsIndicator/ProgressStepsIndicatorStyles.ts",
-                      "index": 650
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/explicit-function-return-type */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/explicit-function-return-type')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/TermSetNavigation/utils/useUtils.ts",
-                      "index": 708
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/explicit-function-return-type */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/explicit-function-return-type')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/TermSetNavigation/hooks/useSessionStorage.ts",
-                      "index": 709
-                    },
-                    "region": {
-                      "startLine": 8,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/explicit-function-return-type */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/explicit-function-return-type')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/TermSetNavigation/hooks/useGraphTaxonomyAPI.ts",
-                      "index": 710
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/explicit-function-return-type */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-vars')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/FileCommandBar/FileCommandBar.tsx",
-                      "index": 749
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-unused-vars */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-floating-promises')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/FileCommandBar/FileCommandBar.tsx",
-                      "index": 749
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-floating-promises */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-use-before-define')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/FileCommandBar/FileCommandBar.tsx",
-                      "index": 749
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-use-before-define */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-empty-function')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/DocumentList/useDocumentListStyles.ts",
-                      "index": 754
-                    },
-                    "region": {
-                      "startLine": 17,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-empty-function */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-undef')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/DocumentList/DocumentList.tsx",
-                      "index": 755
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable no-undef */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/explicit-function-return-type')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/DocumentList/DocumentList.tsx",
-                      "index": 755
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/explicit-function-return-type */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/DocumentList/DocumentList.tsx",
-                      "index": 755
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-explicit-any */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-floating-promises')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/uploadFiles/components/UploadFiles/UploadFilesControl.tsx",
-                      "index": 763
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-floating-promises */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/IUserPickerProps.ts",
-                      "index": 776
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-explicit-any */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-var-requires')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/atoms/globalState.ts",
-                      "index": 778
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-var-requires */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-case-declarations')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/hooks/useGraphUserAPI.ts",
-                      "index": 783
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable no-case-declarations */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-vars')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/userCard/UserCard.tsx",
-                      "index": 790
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-unused-vars */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-floating-promises')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/PopUpMenu.tsx",
-                      "index": 792
-                    },
-                    "region": {
-                      "startLine": 1,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-floating-promises */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from 'no-unused-expressions')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/UserPickerControl.tsx",
-                      "index": 795
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable no-unused-expressions */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-floating-promises')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/userPicker/UserPickerControl.tsx",
-                      "index": 795
-                    },
-                    "region": {
-                      "startLine": 3,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-floating-promises */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-floating-promises')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/worldMap/WorldMapControl.tsx",
-                      "index": 819
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-floating-promises */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-vars')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/ListToolbar/ListToolbar.tsx",
-                      "index": 835
-                    },
-                    "region": {
-                      "startLine": 2,
-                      "startColumn": 1,
-                      "snippet": {
-                        "text": "/* eslint-disable @typescript-eslint/no-unused-vars */"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-explicit-any')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/webparts/controlsTest/propertyPane/PropertyPaneControlToggles.ts",
-                      "index": 916
-                    },
-                    "region": {
-                      "startLine": 13,
-                      "startColumn": 5,
-                      "snippet": {
-                        "text": "// eslint-disable-next-line @typescript-eslint/no-explicit-any"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-expressions')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/listView/ListView.test.tsx",
-                      "index": 930
-                    },
-                    "region": {
-                      "startLine": 65,
-                      "startColumn": 51,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-unused-expressions, no-unused-expressions"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            },
-            {
-              "level": "warning",
-              "message": {
-                "text": "Unused eslint-disable directive (no problems were reported from '@typescript-eslint/no-unused-expressions')."
-              },
-              "locations": [
-                {
-                  "physicalLocation": {
-                    "artifactLocation": {
-                      "uri": "src/controls/listView/ListView.test.tsx",
-                      "index": 930
-                    },
-                    "region": {
-                      "startLine": 73,
-                      "startColumn": 51,
-                      "snippet": {
-                        "text": "// eslint-disable-line @typescript-eslint/no-unused-expressions, no-unused-expressions"
-                      }
-                    }
-                  }
-                }
-              ],
-              "descriptor": {
-                "id": "ESL0999"
-              }
-            }
-          ],
-          "executionSuccessful": true
-        }
       ]
     }
   ]