yarn upgrade --latest

bootstrap still held back

ts/components/ButtonToolbar.svelte

@@ -95,7 +95,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </div>
 
 <style lang="scss">
-    @use 'scrollbar';
+    @use "scrollbar";
 
     .nightMode {
         @include scrollbar.night-mode;

ts/components/DropdownItem.svelte

@@ -39,7 +39,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use 'button-mixins' as button;
+    @use "button-mixins" as button;
 
     button {
         display: flex;

ts/congrats/congrats-base.scss

@@ -1,5 +1,5 @@
-@use 'core';
+@use "core";
-@use 'scrollbar';
+@use "scrollbar";
 
 .night-mode {
     @include scrollbar.night-mode;

ts/editable/editable-base.scss

@@ -1,4 +1,4 @@
-@use 'scrollbar';
+@use "scrollbar";
 
 anki-editable {
     display: block;

ts/editor/AutocompleteItem.svelte

@@ -46,7 +46,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </button>
 
 <style lang="scss">
-    @use 'button-mixins' as button;
+    @use "button-mixins" as button;
 
     .autocomplete-item {
         padding: 1px 7px 2px;

ts/editor/fields.scss

@@ -1,9 +1,9 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'base';
+@use "base";
-@use 'scrollbar';
+@use "scrollbar";
-@use 'button-mixins';
+@use "button-mixins";
 
 html,
 body {

ts/graphs/CumulativeOverlay.svelte

@@ -1,9 +1,11 @@
-<path class="cumulative-overlay" />
-
 <!--
 Copyright: Ankitects Pty Ltd and contributors
 License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
+<script lang="ts"></script>
+
+<path class="cumulative-overlay" />
+
 <style lang="scss">
     :global(:root) {
         --area-fill: #000000;

ts/graphs/HoverColumns.svelte

@@ -1,9 +1,11 @@
-<g class="hover-columns" />
-
 <!--
 Copyright: Ankitects Pty Ltd and contributors
 License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
+<script lang="ts"></script>
+
+<g class="hover-columns" />
+
 <style lang="scss">
     .hover-columns {
         :global(rect) {

ts/graphs/InputBox.svelte

@@ -1,11 +1,14 @@
-<div>
-    <slot />
-</div>
-
 <!--
 Copyright: Ankitects Pty Ltd and contributors
 License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
+<script lang="ts">
+</script>
+
+<div>
+    <slot />
+</div>
+
 <style lang="scss">
     div {
         display: flex;

ts/graphs/graphs-base.scss

@@ -1,5 +1,5 @@
-@use 'base';
+@use "base";
-@use 'scrollbar';
+@use "scrollbar";
 
 .night-mode {
     @include scrollbar.night-mode;

ts/lib/i18n_helpers.ts

@@ -5,7 +5,7 @@
 // so you should not need to access this file directly.
 
 import "intl-pluralrules";
-import { FluentBundle, FluentResource, FluentNumber } from "@fluent/bundle/compat";
+import { FluentBundle, FluentResource, FluentNumber } from "@fluent/bundle";
 
 type RecordVal = number | string | FluentNumber;
 

ts/licenses.json

@@ -1,5 +1,5 @@
 {
-    "@fluent/bundle@0.15.1": {
+    "@fluent/bundle@0.17.0": {
         "licenses": "Apache-2.0",
         "repository": "https://github.com/projectfluent/fluent.js",
         "publisher": "Mozilla",
@@ -7,7 +7,7 @@
         "path": "node_modules/@fluent/bundle",
         "licenseFile": "node_modules/@fluent/bundle/README.md"
     },
-    "@mdi/svg@5.9.55": {
+    "@mdi/svg@6.1.95": {
         "licenses": "Apache-2.0",
         "repository": "https://github.com/Templarian/MaterialDesign-SVG",
         "publisher": "Austin Andrews",
@@ -120,17 +120,17 @@
         "path": "node_modules/@types/long",
         "licenseFile": "node_modules/@types/long/LICENSE"
     },
-    "@types/marked@2.0.5": {
+    "@types/marked@3.0.1": {
         "licenses": "MIT",
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
         "path": "node_modules/@types/marked",
         "licenseFile": "node_modules/@types/marked/LICENSE"
     },
-    "@types/node@16.10.1": {
+    "@types/node@16.10.2": {
         "licenses": "MIT",
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
-        "path": "node_modules/protobufjs/node_modules/@types/node",
+        "path": "node_modules/@types/node",
-        "licenseFile": "node_modules/protobufjs/node_modules/@types/node/LICENSE"
+        "licenseFile": "node_modules/@types/node/LICENSE"
     },
     "bootstrap-icons@1.5.0": {
         "licenses": "MIT",
@@ -147,7 +147,7 @@
         "path": "node_modules/bootstrap",
         "licenseFile": "node_modules/bootstrap/LICENSE"
     },
-    "codemirror@5.63.0": {
+    "codemirror@5.63.1": {
         "licenses": "MIT",
         "repository": "https://github.com/codemirror/CodeMirror",
         "publisher": "Marijn Haverbeke",
@@ -498,7 +498,7 @@
         "path": "node_modules/long",
         "licenseFile": "node_modules/long/LICENSE"
     },
-    "marked@2.0.5": {
+    "marked@3.0.4": {
         "licenses": "MIT",
         "repository": "https://github.com/markedjs/marked",
         "publisher": "Christopher Jeffrey",

ts/package.json

@@ -11,19 +11,16 @@
         "@bazel/worker": "=4.3.0",
         "@pyoner/svelte-types": "^3.4.4-2",
         "@sqltools/formatter": "^1.2.2",
-        "@tsconfig/svelte": "^1.0.10",
         "@types/bootstrap": "^5.0.12",
         "@types/codemirror": "^5.60.0",
-        "@types/d3": "^6.3.0",
+        "@types/d3": "^7.0.0",
         "@types/diff": "^5.0.0",
-        "@types/jest": "^26.0.22",
+        "@types/jest": "^27.0.2",
         "@types/jquery": "^3.5.0",
         "@types/jqueryui": "^1.12.13",
         "@types/lodash": "^4.14.162",
         "@types/long": "^4.0.1",
-        "@types/node": "^14.14.20",
+        "@types/node": "^16.10.2",
-        "@types/react": "^16.9.53",
-        "@types/react-dom": "^16.9.8",
         "@typescript-eslint/eslint-plugin": "^4.22.0",
         "@typescript-eslint/parser": "^4.22.0",
         "chalk": "^4.1.0",
@@ -31,17 +28,17 @@
         "diff": "^5.0.0",
         "escodegen": "^2.0.0",
         "eslint": "^7.24.0",
-        "espree": "^7.3.1",
+        "espree": "^9.0.0",
         "estraverse": "^5.2.0",
         "glob": "^7.1.6",
-        "jest-cli": "^27.0.0-next.7",
+        "jest-cli": "^27.2.4",
         "jsdoc": "^3.6.6",
-        "license-checker-rseidelsohn": "^1.2.2",
+        "license-checker-rseidelsohn": "^2.1.1",
         "minimist": "^1.2.5",
         "patch-package": "^6.4.7",
-        "prettier": "=2.3.0",
+        "prettier": "2.4.1",
-        "prettier-plugin-svelte": "=2.3.0",
+        "prettier-plugin-svelte": "2.4.0",
-        "sass": "=1.32.12",
+        "sass": "1.42.1",
         "semver": "^7.3.4",
         "svelte": "^3.25.0",
         "svelte-check": "^2.2.6",
@@ -57,21 +54,21 @@
         "postinstall": "patch-package"
     },
     "dependencies": {
-        "@fluent/bundle": "^0.15.1",
+        "@fluent/bundle": "^0.17.0",
-        "@mdi/svg": "^5.9.55",
+        "@mdi/svg": "^6.1.95",
         "@popperjs/core": "^2.9.2",
         "@types/lodash-es": "^4.17.4",
-        "@types/marked": "^2.0.2",
         "bootstrap": "=5.0.2",
+        "@types/marked": "^3.0.1",
         "bootstrap-icons": "^1.4.0",
-        "codemirror": "^5.61.1",
+        "codemirror": "^5.63.1",
         "css-browser-selector": "^0.6.5",
         "d3": "^7.0.0",
         "intl-pluralrules": "^1.2.2",
         "jquery": "^3.5.1",
         "jquery-ui-dist": "^1.12.1",
         "lodash-es": "^4.17.21",
-        "marked": "=2.0.5",
+        "marked": "3.0.4",
         "mathjax": "^3.1.2",
         "mathjax-full": "^3.2.0",
         "protobufjs": "^6.10.2"

ts/reviewer/tsconfig.json

@@ -1,5 +1,5 @@
 {
     "extends": "../tsconfig.json",
     "include": ["*"],
-    "references": [{ "path": "../lib" }],
+    "references": [{ "path": "../lib" }]
 }

ts/sass/base.scss

@@ -1,4 +1,4 @@
-@use 'vars';
+@use "vars";
 
 $body-color: var(--text-fg);
 $body-bg: var(--window-bg);

ts/sass/bootstrap-dark.scss

@@ -1,8 +1,8 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'vars';
+@use "vars";
-@use 'fusion-vars';
+@use "fusion-vars";
 
 @mixin night-mode {
     input,

ts/sass/buttons.scss

@@ -1,4 +1,4 @@
-@use 'fusion-vars';
+@use "fusion-vars";
 
 .isWin {
     button {

ts/sass/core.scss

@@ -1,7 +1,7 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'vars';
+@use "vars";
 
 * {
     box-sizing: border-box;

ts/sass/scrollbar.scss

@@ -1,8 +1,8 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use 'vars';
+@use "vars";
-@use 'fusion-vars';
+@use "fusion-vars";
 
 @mixin night-mode {
     &::-webkit-scrollbar {

ts/tsconfig.json

@@ -20,6 +20,7 @@
         "module": "es6",
         "lib": [
             "es2017",
+            "es2018.intl",
             "es2019.array",
             "es2018.promise",
             "es2020.promise",