Merge pull request #6002 from mikeyhenein/frontend-deps

Frontend: refresh dependencies, react-intl 12, vitest 5, happy-dom 21; fix Tabler 1.7 regressions

frontend/package.json

@@ -32,7 +32,7 @@
 		"react": "^19.3.0",
 		"react-bootstrap": "^2.10.10",
 		"react-dom": "^19.3.0",
-		"react-intl": "^10.2.0",
+		"react-intl": "^12.1.5",
 		"react-markdown": "^10.1.0",
 		"react-qr-code": "^2.2.0",
 		"react-router-dom": "^7.18.4",
@@ -54,7 +54,7 @@
 		"@types/react-dom": "^19.3.0",
 		"@types/react-table": "^7.7.20",
 		"@vitejs/plugin-react": "^6.1.1",
-		"happy-dom": "^20.14.5",
+		"happy-dom": "^21.0.4",
 		"postcss": "^8.5.28",
 		"postcss-simple-vars": "^7.0.1",
 		"sass": "^1.104.1",
@@ -62,6 +62,6 @@
 		"typescript": "7.0.2",
 		"vite": "^8.3.0",
 		"vite-plugin-checker": "^0.14.5",
-		"vitest": "^4.1.11"
+		"vitest": "^5.0.5"
 	}
 }

frontend/src/App.css

@@ -115,4 +115,31 @@ label.row {
   :host, :root {
     margin-left: 0;
   }
+}
+
+/* Keep Tabler 1.5's behaviour on Tabler 1.6/1.7. App.css loads before the
+   dynamically imported Tabler CSS, hence the doubled :root selectors. */
+
+/* 1.6 dropped the reserved scrollbar gutter, so the layout shifted 7px between short and long pages */
+html {
+	scrollbar-gutter: stable;
+}
+@supports not (scrollbar-gutter: stable) {
+	html {
+		overflow-y: scroll;
+	}
+}
+
+/* 1.6+ mixes the focus ring 50% with the background (75% dark, about 2.1:1 on white); restore full strength */
+:root:root {
+	--tblr-focus-ring-opacity: 1;
+	--tblr-focus-ring-opacity-dark: 1;
+}
+
+/* Coloured primary buttons (btn-primary + bg-<colour>) got a blue primary border in 1.7 */
+.btn-primary[class*=" bg-"] {
+	--tblr-btn-border-color: transparent;
+	--tblr-btn-hover-border-color: transparent;
+	--tblr-btn-active-border-color: transparent;
+	--tblr-btn-box-shadow: var(--tblr-shadow-input);
 }