feat: ui update

- cherry-picked multiple dependency updates
- cherry-picked branch removing contract explorer
- re-added external package to use contract explorer
- merged in UI updates

Author: zachfedor

environments.toml

@@ -83,6 +83,7 @@ default = true
 # soroban-increment-contract = { id = "C567..." }
 # soroban-token-contract = { id = "C678..." }
 # eurc = { id = "C789..." }
+guess_the_number = { client = true, constructor_args = "--admin me", after_deploy = "reset" }
 
 ### Production environment configuration
 [production.network]

package-lock.json

@@ -11,7 +11,8 @@
     "preview": "vite preview",
     "lint": "eslint .",
     "format": "prettier . --write",
-    "prepare": "husky"
+    "prepare": "husky",
+    "typecheck": "tsc"
   },
   "workspaces": [
     "packages/*"
@@ -22,16 +23,17 @@
     "@stellar/stellar-sdk": "^14.4.3",
     "@stellar/stellar-xdr-json": "^23.0.0",
     "@tanstack/react-query": "^5.90.17",
+    "@theahaco/contract-explorer": "^1.1.0",
     "@theahaco/ts-config": "^1.2.0",
     "lossless-json": "^4.3.0",
-    "react": "^19.2.3",
-    "react-dom": "^19.2.3",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
     "react-router-dom": "^7.12.0",
     "zod": "^4.3.5"
   },
   "devDependencies": {
     "@types/lodash": "^4.17.23",
-    "@types/react": "^19.2.8",
+    "@types/react": "^19.2.10",
     "@types/react-dom": "^19.2.3",
     "@types/react-router-dom": "^5.3.3",
     "@vitejs/plugin-react": "^5.1.2",

package.json

@@ -0,0 +1,64 @@
+/** GLOBAL */
+/* Typography Color */
+body {
+	color: var(--sds-clr-gray-12);
+}
+
+/* External link icons */
+a[target]::after {
+	content: " ";
+	background: var(--sds-clr-lilac-11);
+	width: 1em;
+	height: 1em;
+	display: inline-block;
+	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 17 17 7m0 0H7m10 0v10'%3E%3C/path%3E%3C/svg%3E");
+	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 17 17 7m0 0H7m10 0v10'%3E%3C/path%3E%3C/svg%3E");
+}
+a[target]:hover::after {
+	background: var(--sds-clr-lilac-12);
+}
+a[target]:disabled::after {
+	background: var(--sds-clr-lilac-08);
+}
+
+a:has(button) {
+	text-decoration: none;
+}
+a[target]:has(button)::after {
+	content: unset;
+	-webkit-mask-image: unset;
+	mask-image: unset;
+}
+
+/** HEADER */
+.AppLayout :global(.Layout__header) {
+	border-bottom: 1px solid var(--sds-clr-gray-06);
+	padding: 1rem 3rem;
+}
+
+.AppLayout :global(.Layout__header) :global(.Layout__inset) {
+	gap: 2rem;
+}
+
+.AppLayout :global(.Layout__header--center) {
+	flex-direction: row;
+	justify-content: start;
+}
+
+/** FOOTER */
+.AppLayout :global(.Layout__footer__content) {
+	flex-direction: row-reverse;
+}
+
+/** SDS FIXES */
+:global(.sds-theme-light) ol li::before,
+:global(.sds-theme-dark) ol li::before {
+	content: unset;
+}
+
+* {
+	transition:
+		background-color var(--sds-anim-transition-default),
+		border-color var(--sds-anim-transition-default),
+		color var(--sds-anim-transition-default);
+}