diff --git a/tools/ui-components/package-lock.json b/tools/ui-components/package-lock.json
index 0cc9f9d0f23..639f89fa45b 100644
--- a/tools/ui-components/package-lock.json
+++ b/tools/ui-components/package-lock.json
@@ -1615,12 +1615,12 @@
       "dev": true
     },
     "@fullhuman/postcss-purgecss": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-3.1.3.tgz",
-      "integrity": "sha512-kwOXw8fZ0Lt1QmeOOrd+o4Ibvp4UTEBFQbzvWldjlKv5n+G9sXfIPn1hh63IQIL8K8vbvv1oYMJiIUbuy9bGaA==",
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-4.0.3.tgz",
+      "integrity": "sha512-/EnQ9UDWGGqHkn1UKAwSgh+gJHPKmD+Z+5dQ4gWT4qq2NUyez3zqAfZNwFH3eSgmgO+wjTXfhlLchx2M9/K+7Q==",
       "dev": true,
       "requires": {
-        "purgecss": "^3.1.3"
+        "purgecss": "^4.0.3"
       }
     },
     "@istanbuljs/load-nyc-config": {
@@ -4262,6 +4262,12 @@
         "readable-stream": "^2.0.6"
       }
     },
+    "arg": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.0.tgz",
+      "integrity": "sha512-4P8Zm2H+BRS+c/xX1LrHw0qKpEhdlZjLCgWy+d78T9vqa2Z2SiD2wMrYuWIAFy5IZUD7nnNXroRttz+0RzlrzQ==",
+      "dev": true
+    },
     "argparse": {
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
@@ -8409,6 +8415,15 @@
       "integrity": "sha512-aqXhGP7//Gui2+UrEtvxZxSquQVXTpZ7KDxfCcKAF3Vysvw0CViVaW9RZ1j1xlIYqaaaipBoqdqeibkc18PNvA==",
       "dev": true
     },
+    "import-cwd": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-3.0.0.tgz",
+      "integrity": "sha512-4pnzH16plW+hgvRECbDWpQl3cqtvSofHWh44met7ESfZ8UZOWWddm8hEyDTqREJ9RbYHY8gi8DqmaelApoOGMg==",
+      "dev": true,
+      "requires": {
+        "import-from": "^3.0.0"
+      }
+    },
     "import-fresh": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -8427,6 +8442,15 @@
         }
       }
     },
+    "import-from": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/import-from/-/import-from-3.0.0.tgz",
+      "integrity": "sha512-CiuXOFFSzkU5x/CR0+z7T91Iht4CXgfCxVOFRhh2Zyhg5wOpWvvDLQUsWl+gcN+QscYBjez8hDCt85O7RLDttQ==",
+      "dev": true,
+      "requires": {
+        "resolve-from": "^5.0.0"
+      }
+    },
     "imurmurhash": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
@@ -8689,12 +8713,6 @@
         "is-window": "^1.0.2"
       }
     },
-    "is-dotfile": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
-      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=",
-      "dev": true
-    },
     "is-extendable": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
@@ -9155,6 +9173,12 @@
         "dotenv-expand": "^5.1.0"
       }
     },
+    "lilconfig": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.0.3.tgz",
+      "integrity": "sha512-EHKqr/+ZvdKCifpNrJCKxBTgk5XupZA3y/aCPY9mxfgBzmgh93Mt/WqjjQ38oMxXuvDokaKiM3lAgvSH2sjtHg==",
+      "dev": true
+    },
     "lines-and-columns": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.1.6.tgz",
@@ -10265,35 +10289,6 @@
         "is-hexadecimal": "^1.0.0"
       }
     },
-    "parse-glob": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
-      "dev": true,
-      "requires": {
-        "glob-base": "^0.3.0",
-        "is-dotfile": "^1.0.0",
-        "is-extglob": "^1.0.0",
-        "is-glob": "^2.0.0"
-      },
-      "dependencies": {
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
-          "dev": true
-        },
-        "is-glob": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-          "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
-          "dev": true,
-          "requires": {
-            "is-extglob": "^1.0.0"
-          }
-        }
-      }
-    },
     "parse-json": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
@@ -10581,43 +10576,6 @@
         }
       }
     },
-    "postcss-functions": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-functions/-/postcss-functions-3.0.0.tgz",
-      "integrity": "sha1-DpTQFERwCkgd4g3k1V+yZAVkJQ4=",
-      "dev": true,
-      "requires": {
-        "glob": "^7.1.2",
-        "object-assign": "^4.1.1",
-        "postcss": "^6.0.9",
-        "postcss-value-parser": "^3.3.0"
-      },
-      "dependencies": {
-        "postcss": {
-          "version": "6.0.23",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.23.tgz",
-          "integrity": "sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==",
-          "dev": true,
-          "requires": {
-            "chalk": "^2.4.1",
-            "source-map": "^0.6.1",
-            "supports-color": "^5.4.0"
-          }
-        },
-        "postcss-value-parser": {
-          "version": "3.3.1",
-          "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
-          "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==",
-          "dev": true
-        },
-        "source-map": {
-          "version": "0.6.1",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-          "dev": true
-        }
-      }
-    },
     "postcss-import": {
       "version": "14.0.2",
       "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-14.0.2.tgz",
@@ -10639,6 +10597,17 @@
         "postcss": "^8.1.6"
       }
     },
+    "postcss-load-config": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-3.1.0.tgz",
+      "integrity": "sha512-ipM8Ds01ZUophjDTQYSVP70slFSYg3T0/zyfII5vzhN6V57YSxMgG5syXuwi5VtS8wSf3iL30v0uBdoIVx4Q0g==",
+      "dev": true,
+      "requires": {
+        "import-cwd": "^3.0.0",
+        "lilconfig": "^2.0.3",
+        "yaml": "^1.10.2"
+      }
+    },
     "postcss-loader": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-4.2.0.tgz",
@@ -11102,9 +11071,9 @@
       "dev": true
     },
     "purgecss": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/purgecss/-/purgecss-3.1.3.tgz",
-      "integrity": "sha512-hRSLN9mguJ2lzlIQtW4qmPS2kh6oMnA9RxdIYK8sz18QYqd6ePp4GNDl18oWHA1f2v2NEQIh51CO8s/E3YGckQ==",
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/purgecss/-/purgecss-4.0.3.tgz",
+      "integrity": "sha512-PYOIn5ibRIP34PBU9zohUcCI09c7drPJJtTDAc0Q6QlRz2/CHQ8ywGLdE7ZhxU2VTqB7p5wkvj5Qcm05Rz3Jmw==",
       "dev": true,
       "requires": {
         "commander": "^6.0.0",
@@ -12912,38 +12881,42 @@
       }
     },
     "tailwindcss": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-2.1.4.tgz",
-      "integrity": "sha512-fh1KImDLg6se/Suaelju/5oFbqq1b0ntagmGLu0aG9LlnNPGHgO1n/4E57CbKcCtyz/VYnvVXUiWmfyfBBZQ6g==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-2.2.0.tgz",
+      "integrity": "sha512-vzyictuac60cUfky6R4gFW98glcc/UxpaCH+Mt9dq+LEPdZq2Dpvo5iYpPaemutOIjfeiY0Y8j0ZgJG3wBaFDQ==",
       "dev": true,
       "requires": {
-        "@fullhuman/postcss-purgecss": "^3.1.3",
+        "@fullhuman/postcss-purgecss": "^4.0.3",
+        "arg": "^5.0.0",
         "bytes": "^3.0.0",
-        "chalk": "^4.1.0",
+        "chalk": "^4.1.1",
         "chokidar": "^3.5.1",
         "color": "^3.1.3",
+        "cosmiconfig": "^7.0.0",
         "detective": "^5.2.0",
         "didyoumean": "^1.2.1",
         "dlv": "^1.1.3",
         "fast-glob": "^3.2.5",
-        "fs-extra": "^9.1.0",
+        "fs-extra": "^10.0.0",
+        "glob-parent": "^6.0.0",
         "html-tags": "^3.1.0",
+        "is-glob": "^4.0.1",
         "lodash": "^4.17.21",
         "lodash.topath": "^4.5.2",
-        "modern-normalize": "^1.0.0",
+        "modern-normalize": "^1.1.0",
         "node-emoji": "^1.8.1",
         "normalize-path": "^3.0.0",
-        "object-hash": "^2.1.1",
-        "parse-glob": "^3.0.4",
-        "postcss-functions": "^3",
+        "object-hash": "^2.2.0",
         "postcss-js": "^3.0.3",
+        "postcss-load-config": "^3.0.1",
         "postcss-nested": "5.0.5",
-        "postcss-selector-parser": "^6.0.4",
+        "postcss-selector-parser": "^6.0.6",
         "postcss-value-parser": "^4.1.0",
         "pretty-hrtime": "^1.0.3",
         "quick-lru": "^5.1.1",
         "reduce-css-calc": "^2.1.8",
-        "resolve": "^1.20.0"
+        "resolve": "^1.20.0",
+        "tmp": "^0.2.1"
       },
       "dependencies": {
         "ansi-styles": {
@@ -12980,12 +12953,65 @@
           "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
           "dev": true
         },
+        "cosmiconfig": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.0.0.tgz",
+          "integrity": "sha512-pondGvTuVYDk++upghXJabWzL6Kxu6f26ljFw64Swq9v6sQPUL3EUlVDV56diOjpCayKihL6hVe8exIACU4XcA==",
+          "dev": true,
+          "requires": {
+            "@types/parse-json": "^4.0.0",
+            "import-fresh": "^3.2.1",
+            "parse-json": "^5.0.0",
+            "path-type": "^4.0.0",
+            "yaml": "^1.10.0"
+          }
+        },
+        "fs-extra": {
+          "version": "10.0.0",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.0.0.tgz",
+          "integrity": "sha512-C5owb14u9eJwizKGdchcDUQeFtlSHHthBk8pbX9Vc1PFZrLombudjDnNns88aYslCyF6IY5SUw3Roz6xShcEIQ==",
+          "dev": true,
+          "requires": {
+            "graceful-fs": "^4.2.0",
+            "jsonfile": "^6.0.1",
+            "universalify": "^2.0.0"
+          }
+        },
+        "glob-parent": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.0.tgz",
+          "integrity": "sha512-Hdd4287VEJcZXUwv1l8a+vXC1GjOQqXe+VS30w/ypihpcnu9M1n3xeYeJu5CBpeEQj2nAab2xxz28GuA3vp4Ww==",
+          "dev": true,
+          "requires": {
+            "is-glob": "^4.0.1"
+          }
+        },
         "has-flag": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
           "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
           "dev": true
         },
+        "jsonfile": {
+          "version": "6.1.0",
+          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+          "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+          "dev": true,
+          "requires": {
+            "graceful-fs": "^4.1.6",
+            "universalify": "^2.0.0"
+          }
+        },
+        "postcss-selector-parser": {
+          "version": "6.0.6",
+          "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.6.tgz",
+          "integrity": "sha512-9LXrvaaX3+mcv5xkg5kFwqSzSH1JIObIx51PrndZwlmznwXRfxMddDvo9gve3gVR8ZTKgoFDdWkbRFmEhT4PMg==",
+          "dev": true,
+          "requires": {
+            "cssesc": "^3.0.0",
+            "util-deprecate": "^1.0.2"
+          }
+        },
         "supports-color": {
           "version": "7.2.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -13178,6 +13204,26 @@
       "dev": true,
       "optional": true
     },
+    "tmp": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
+      "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
+      "dev": true,
+      "requires": {
+        "rimraf": "^3.0.0"
+      },
+      "dependencies": {
+        "rimraf": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+          "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+          "dev": true,
+          "requires": {
+            "glob": "^7.1.3"
+          }
+        }
+      }
+    },
     "tmpl": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz",
diff --git a/tools/ui-components/package.json b/tools/ui-components/package.json
index 97bc070d615..5970c93985b 100644
--- a/tools/ui-components/package.json
+++ b/tools/ui-components/package.json
@@ -34,7 +34,7 @@
     "babel-loader": "8.2.2",
     "postcss": "8.3.5",
     "postcss-import": "14.0.2",
-    "tailwindcss": "2.1.4"
+    "tailwindcss": "2.2.0"
   },
   "scripts": {
     "storybook": "start-storybook -p 6006",