Add whatinput dependency for more responsive focus styling

app/javascript/packs/application.js

@@ -9,3 +9,5 @@ loadPolyfills().then(() => {
 }).catch(e => {
   console.error(e);
 });
+
+require('what-input');

package.json

@@ -168,7 +168,8 @@
     "webpack-bundle-analyzer": "^4.1.0",
     "webpack-cli": "^3.3.12",
     "webpack-merge": "^5.4.0",
-    "wicg-inert": "^3.1.0"
+    "wicg-inert": "^3.1.0",
+    "what-input": "^4.3.1"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^5.11.6",

yarn.lock

@@ -11149,6 +11149,10 @@ websocket-extensions@>=0.1.1:
   resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.4.tgz#7f8473bc839dfd87608adb95d7eb075211578a42"
   integrity sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==
 
+what-input@^4.3.1:
+  version "4.3.1"
+  resolved "https://registry.yarnpkg.com/what-input/-/what-input-4.3.1.tgz#b8ea7554ba1d9171887c4c6addf28185fec3d31d"
+
 whatwg-encoding@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz#5abacf777c32166a51d085d6b4f3e7d27113ddb0"