big refactor

add site.standard.publication
add subpages
option to hide profile
update svelte+sveltekit

package.json

···
 	"devDependencies": {
 		"@eslint/compat": "^1.2.5",
 		"@eslint/js": "^9.18.0",
-		"@sveltejs/adapter-auto": "^4.0.0",
 		"@sveltejs/adapter-cloudflare": "^7.2.4",
-		"@sveltejs/adapter-static": "^3.0.8",
-		"@sveltejs/kit": "^2.16.0",
+		"@sveltejs/kit": "^2.49.5",
 		"@sveltejs/vite-plugin-svelte": "^5.0.0",
 		"@tailwindcss/forms": "^0.5.10",
 		"@tailwindcss/vite": "^4.0.0",
···
 		"prettier": "^3.4.2",
 		"prettier-plugin-svelte": "^3.3.3",
 		"prettier-plugin-tailwindcss": "^0.6.11",
-		"svelte": "^5.45.8",
+		"svelte": "^5.46.4",
 		"svelte-check": "^4.0.0",
 		"tailwindcss": "^4.0.0",
 		"typescript": "^5.0.0",
···
 	"dependencies": {
 		"@atcute/client": "^3.1.0",
 		"@atcute/oauth-browser-client": "^1.0.13",
-		"@atproto/api": "^0.18.13",
+		"@atproto/api": "^0.18.16",
 		"@atproto/common-web": "^0.4.2",
 		"@cloudflare/workers-types": "^4.20260109.0",
 		"@ethercorps/sveltekit-og": "^4.2.1",

pnpm-lock.yaml

···
         specifier: ^1.0.13
         version: 1.0.18
       '@atproto/api':
-        specifier: ^0.18.13
-        version: 0.18.13
+        specifier: ^0.18.16
+        version: 0.18.16
       '@atproto/common-web':
         specifier: ^0.4.2
         version: 0.4.2
···
         version: 4.20260109.0
       '@ethercorps/sveltekit-og':
         specifier: ^4.2.1
-        version: 4.2.1(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))
+        version: 4.2.1(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))
       '@foxui/colors':
         specifier: ^0.4.7
-        version: 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
+        version: 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
       '@foxui/core':
         specifier: ^0.4.7
-        version: 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
+        version: 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
       '@foxui/social':
         specifier: ^0.4.7
-        version: 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
+        version: 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
       '@foxui/time':
         specifier: ^0.4.7
-        version: 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
+        version: 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
       '@tailwindcss/typography':
         specifier: ^0.5.16
         version: 0.5.16(tailwindcss@4.1.5)
···
         version: 2.12.0
       bits-ui:
         specifier: ^2.14.4
-        version: 2.14.4(@internationalized/date@3.8.0)(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)
+        version: 2.14.4(@internationalized/date@3.8.0)(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)
       clsx:
         specifier: ^2.1.1
         version: 2.1.1
···
         version: 16.5.0
       svelte-sonner:
         specifier: ^1.0.7
-        version: 1.0.7(svelte@5.45.8)
+        version: 1.0.7(svelte@5.46.4)
       tailwind-merge:
         specifier: ^3.4.0
         version: 3.4.0
···
       '@eslint/js':
         specifier: ^9.18.0
         version: 9.26.0
-      '@sveltejs/adapter-auto':
-        specifier: ^4.0.0
-        version: 4.0.0(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))
       '@sveltejs/adapter-cloudflare':
         specifier: ^7.2.4
-        version: 7.2.4(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(wrangler@4.54.0(@cloudflare/workers-types@4.20260109.0))
-      '@sveltejs/adapter-static':
-        specifier: ^3.0.8
-        version: 3.0.8(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))
+        version: 7.2.4(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(wrangler@4.54.0(@cloudflare/workers-types@4.20260109.0))
       '@sveltejs/kit':
-        specifier: ^2.16.0
-        version: 2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+        specifier: ^2.49.5
+        version: 2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       '@sveltejs/vite-plugin-svelte':
         specifier: ^5.0.0
-        version: 5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+        version: 5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       '@tailwindcss/forms':
         specifier: ^0.5.10
         version: 0.5.10(tailwindcss@4.1.5)
···
         version: 10.1.3(eslint@9.26.0(jiti@2.4.2))
       eslint-plugin-svelte:
         specifier: ^2.46.1
-        version: 2.46.1(eslint@9.26.0(jiti@2.4.2))(svelte@5.45.8)
+        version: 2.46.1(eslint@9.26.0(jiti@2.4.2))(svelte@5.46.4)
       globals:
         specifier: ^15.14.0
         version: 15.15.0
···
         version: 3.5.3
       prettier-plugin-svelte:
         specifier: ^3.3.3
-        version: 3.3.3(prettier@3.5.3)(svelte@5.45.8)
+        version: 3.3.3(prettier@3.5.3)(svelte@5.46.4)
       prettier-plugin-tailwindcss:
         specifier: ^0.6.11
-        version: 0.6.11(prettier-plugin-svelte@3.3.3(prettier@3.5.3)(svelte@5.45.8))(prettier@3.5.3)
+        version: 0.6.11(prettier-plugin-svelte@3.3.3(prettier@3.5.3)(svelte@5.46.4))(prettier@3.5.3)
       svelte:
-        specifier: ^5.45.8
-        version: 5.45.8
+        specifier: ^5.46.4
+        version: 5.46.4
       svelte-check:
         specifier: ^4.0.0
-        version: 4.1.7(picomatch@4.0.2)(svelte@5.45.8)(typescript@5.8.3)
+        version: 4.1.7(picomatch@4.0.2)(svelte@5.46.4)(typescript@5.8.3)
       tailwindcss:
         specifier: ^4.0.0
         version: 4.1.5
···
   '@atproto/api@0.15.27':
     resolution: {integrity: sha512-ok/WGafh1nz4t8pEQGtAF/32x2E2VDWU4af6BajkO5Gky2jp2q6cv6aB2A5yuvNNcc3XkYMYipsqVHVwLPMF9g==, tarball: https://registry.npmjs.org/@atproto/api/-/api-0.15.27.tgz}
 
-  '@atproto/api@0.18.13':
-    resolution: {integrity: sha512-CULZ01pSJDltLS/Gc9MMrhFzB6OM3ezyZw7KoeLT/sBfwgA1ddA4mWdTh7DIRosPRigXtA05bnoiCutZbQDo+Q==, tarball: https://registry.npmjs.org/@atproto/api/-/api-0.18.13.tgz}
+  '@atproto/api@0.18.16':
+    resolution: {integrity: sha512-tRGKSWr83pP5CQpSboePU21pE+GqLDYy1XHae4HH4hjaT0pr5V8wNgu70kbKB0B02GVUumeDRpJnlHKD+eMzLg==, tarball: https://registry.npmjs.org/@atproto/api/-/api-0.18.16.tgz}
 
   '@atproto/common-web@0.4.11':
     resolution: {integrity: sha512-VHejNmSABU8/03VrQ3e36AmT5U3UIeio+qSUqCrO1oNgrJcWfGy1rpj0FVtUugWF8Un29+yzkukzWGZfXL70rQ==, tarball: https://registry.npmjs.org/@atproto/common-web/-/common-web-0.4.11.tgz}
+
+  '@atproto/common-web@0.4.12':
+    resolution: {integrity: sha512-3aCJemqM/fkHQrVPbTCHCdiVstKFI+2LkFLvUhO6XZP0EqUZa/rg/CIZBKTFUWu9I5iYiaEiXL9VwcDRpEevSw==, tarball: https://registry.npmjs.org/@atproto/common-web/-/common-web-0.4.12.tgz}
 
   '@atproto/common-web@0.4.2':
     resolution: {integrity: sha512-vrXwGNoFGogodjQvJDxAeP3QbGtawgZute2ed1XdRO0wMixLk3qewtikZm06H259QDJVu6voKC5mubml+WgQUw==, tarball: https://registry.npmjs.org/@atproto/common-web/-/common-web-0.4.2.tgz}
···
   '@atproto/lex-data@0.0.7':
     resolution: {integrity: sha512-W/Q5o9o7n2Sv3UywckChu01X5lwQUtaiiOkGJLnRsdkQTyC6813nPgY+p2sG7NwwM+82lu+FUV9fE/Ul3VqaJw==, tarball: https://registry.npmjs.org/@atproto/lex-data/-/lex-data-0.0.7.tgz}
 
+  '@atproto/lex-data@0.0.8':
+    resolution: {integrity: sha512-1Y5tz7BkS7380QuLNXaE8GW8Xba+mRWugt8BKM4BUFYjjUZdmirU8lr72iM4XlEBrzRu8Cfvj+MbsbYaZv+IgA==, tarball: https://registry.npmjs.org/@atproto/lex-data/-/lex-data-0.0.8.tgz}
+
   '@atproto/lex-json@0.0.7':
     resolution: {integrity: sha512-bjNPD5M/MhLfjNM7tcxuls80UgXpHqxdOxDXEUouAtZQV/nIDhGjmNUvKxOmOgnDsiZRnT2g5y3onrnjH3a44g==, tarball: https://registry.npmjs.org/@atproto/lex-json/-/lex-json-0.0.7.tgz}
+
+  '@atproto/lex-json@0.0.8':
+    resolution: {integrity: sha512-w1Qmkae1QhmNz+i1Zm3xr3jp0UPPRENmdlpU0qIrdxWDo9W4Mzkeyc3eSoa+Zs+zN8xkRSQw7RLZte/B7Ipdwg==, tarball: https://registry.npmjs.org/@atproto/lex-json/-/lex-json-0.0.8.tgz}
 
   '@atproto/lexicon@0.4.14':
     resolution: {integrity: sha512-jiKpmH1QER3Gvc7JVY5brwrfo+etFoe57tKPQX/SmPwjvUsFnJAow5xLIryuBaJgFAhnTZViXKs41t//pahGHQ==, tarball: https://registry.npmjs.org/@atproto/lexicon/-/lexicon-0.4.14.tgz}
···
   '@speed-highlight/core@1.2.12':
     resolution: {integrity: sha512-uilwrK0Ygyri5dToHYdZSjcvpS2ZwX0w5aSt3GCEN9hrjxWCoeV4Z2DTXuxjwbntaLQIEEAlCeNQss5SoHvAEA==, tarball: https://registry.npmjs.org/@speed-highlight/core/-/core-1.2.12.tgz}
 
+  '@standard-schema/spec@1.1.0':
+    resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==, tarball: https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz}
+
   '@sveltejs/acorn-typescript@1.0.5':
     resolution: {integrity: sha512-IwQk4yfwLdibDlrXVE04jTZYlLnwsTT2PIOQQGNLWfjavGifnk1JD1LcZjZaBTRcxZu2FfPfNLOE04DSu9lqtQ==, tarball: https://registry.npmjs.org/@sveltejs/acorn-typescript/-/acorn-typescript-1.0.5.tgz}
     peerDependencies:
       acorn: ^8.9.0
 
-  '@sveltejs/adapter-auto@4.0.0':
-    resolution: {integrity: sha512-kmuYSQdD2AwThymQF0haQhM8rE5rhutQXG4LNbnbShwhMO4qQGnKaaTy+88DuNSuoQDi58+thpq8XpHc1+oEKQ==, tarball: https://registry.npmjs.org/@sveltejs/adapter-auto/-/adapter-auto-4.0.0.tgz}
-    peerDependencies:
-      '@sveltejs/kit': ^2.0.0
-
   '@sveltejs/adapter-cloudflare@7.2.4':
     resolution: {integrity: sha512-uD8VlOuGXGuZWL+zbBYSjtmC4WDtlonUodfqAZ/COd5uIy2Z0QptIicB/nkTrGNI9sbmzgf7z0N09CHyWYlUvQ==, tarball: https://registry.npmjs.org/@sveltejs/adapter-cloudflare/-/adapter-cloudflare-7.2.4.tgz}
     peerDependencies:
       '@sveltejs/kit': ^2.0.0
       wrangler: ^4.0.0
 
-  '@sveltejs/adapter-static@3.0.8':
-    resolution: {integrity: sha512-YaDrquRpZwfcXbnlDsSrBQNCChVOT9MGuSg+dMAyfsAa1SmiAhrA5jUYUiIMC59G92kIbY/AaQOWcBdq+lh+zg==, tarball: https://registry.npmjs.org/@sveltejs/adapter-static/-/adapter-static-3.0.8.tgz}
-    peerDependencies:
-      '@sveltejs/kit': ^2.0.0
-
-  '@sveltejs/kit@2.20.8':
-    resolution: {integrity: sha512-ep9qTxL7WALhfm0kFecL3VHeuNew8IccbYGqv5TqL/KSqWRKzEgDG8blNlIu1CkLTTua/kHjI+f5T8eCmWIxKw==, tarball: https://registry.npmjs.org/@sveltejs/kit/-/kit-2.20.8.tgz}
+  '@sveltejs/kit@2.49.5':
+    resolution: {integrity: sha512-dCYqelr2RVnWUuxc+Dk/dB/SjV/8JBndp1UovCyCZdIQezd8TRwFLNZctYkzgHxRJtaNvseCSRsuuHPeUgIN/A==, tarball: https://registry.npmjs.org/@sveltejs/kit/-/kit-2.49.5.tgz}
     engines: {node: '>=18.13'}
     hasBin: true
     peerDependencies:
-      '@sveltejs/vite-plugin-svelte': ^3.0.0 || ^4.0.0-next.1 || ^5.0.0
+      '@opentelemetry/api': ^1.0.0
+      '@sveltejs/vite-plugin-svelte': ^3.0.0 || ^4.0.0-next.1 || ^5.0.0 || ^6.0.0-next.0
       svelte: ^4.0.0 || ^5.0.0-next.0
-      vite: ^5.0.3 || ^6.0.0
+      typescript: ^5.3.3
+      vite: ^5.0.3 || ^6.0.0 || ^7.0.0-beta.0
+    peerDependenciesMeta:
+      '@opentelemetry/api':
+        optional: true
+      typescript:
+        optional: true
 
   '@sveltejs/vite-plugin-svelte-inspector@4.0.1':
     resolution: {integrity: sha512-J/Nmb2Q2y7mck2hyCX4ckVHcR5tu2J+MtBEQqpDrrgELZ2uvraQcK/ioCV61AqkdXFgriksOKIceDcQmqnGhVw==, tarball: https://registry.npmjs.org/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-4.0.1.tgz}
···
     resolution: {integrity: sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==, tarball: https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz}
     engines: {node: '>=8'}
 
-  devalue@5.1.1:
-    resolution: {integrity: sha512-maua5KUiapvEwiEAe+XnlZ3Rh0GD+qI1J/nb9vrJc3muPXvcF/8gXYTWF76+5DAqHyDUtOIImEuo0YKE9mshVw==, tarball: https://registry.npmjs.org/devalue/-/devalue-5.1.1.tgz}
-
-  devalue@5.6.0:
-    resolution: {integrity: sha512-BaD1s81TFFqbD6Uknni42TrolvEWA1Ih5L+OiHWmi4OYMJVwAYPGtha61I9KxTf52OvVHozHyjPu8zljqdF3uA==, tarball: https://registry.npmjs.org/devalue/-/devalue-5.6.0.tgz}
+  devalue@5.6.2:
+    resolution: {integrity: sha512-nPRkjWzzDQlsejL1WVifk5rvcFi/y1onBRxjaFMjZeR9mFpqu2gmAZ9xUB9/IEanEP/vBtGeGganC/GO1fmufg==, tarball: https://registry.npmjs.org/devalue/-/devalue-5.6.2.tgz}
 
   dom-serializer@2.0.0:
     resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==, tarball: https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz}
···
     resolution: {integrity: sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==, tarball: https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz}
     engines: {node: '>=6'}
 
-  import-meta-resolve@4.1.0:
-    resolution: {integrity: sha512-I6fiaX09Xivtk+THaMfAwnA3MVA5Big1WHF1Dfx9hFuvNIWpXnorlkzhcQf6ehrqQiiZECRt1poOAkPmer3ruw==, tarball: https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz}
-
   imurmurhash@0.1.4:
     resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==, tarball: https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz}
     engines: {node: '>=0.8.19'}
···
     peerDependencies:
       svelte: ^5.0.0
 
-  svelte@5.45.8:
-    resolution: {integrity: sha512-1Jh7FwVh/2Uxg0T7SeE1qFKMhwYH45b2v53bcZpW7qHa6O8iU1ByEj56PF0IQ6dU4HE5gRkic6h+vx+tclHeiw==, tarball: https://registry.npmjs.org/svelte/-/svelte-5.45.8.tgz}
+  svelte@5.46.4:
+    resolution: {integrity: sha512-VJwdXrmv9L8L7ZasJeWcCjoIuMRVbhuxbss0fpVnR8yorMmjNDwcjIH08vS6wmSzzzgAG5CADQ1JuXPS2nwt9w==, tarball: https://registry.npmjs.org/svelte/-/svelte-5.46.4.tgz}
     engines: {node: '>=18'}
 
   tabbable@6.2.0:
···
       tlds: 1.258.0
       zod: 3.24.4
 
-  '@atproto/api@0.18.13':
+  '@atproto/api@0.18.16':
     dependencies:
-      '@atproto/common-web': 0.4.11
+      '@atproto/common-web': 0.4.12
       '@atproto/lexicon': 0.6.0
       '@atproto/syntax': 0.4.2
       '@atproto/xrpc': 0.7.7
···
       '@atproto/lex-json': 0.0.7
       zod: 3.24.4
 
+  '@atproto/common-web@0.4.12':
+    dependencies:
+      '@atproto/lex-data': 0.0.8
+      '@atproto/lex-json': 0.0.8
+      zod: 3.24.4
+
   '@atproto/common-web@0.4.2':
     dependencies:
       graphemer: 1.4.0
···
       uint8arrays: 3.0.0
       unicode-segmenter: 0.14.5
 
+  '@atproto/lex-data@0.0.8':
+    dependencies:
+      '@atproto/syntax': 0.4.2
+      multiformats: 9.9.0
+      tslib: 2.8.1
+      uint8arrays: 3.0.0
+      unicode-segmenter: 0.14.5
+
   '@atproto/lex-json@0.0.7':
     dependencies:
       '@atproto/lex-data': 0.0.7
+      tslib: 2.8.1
+
+  '@atproto/lex-json@0.0.8':
+    dependencies:
+      '@atproto/lex-data': 0.0.8
       tslib: 2.8.1
 
   '@atproto/lexicon@0.4.14':
···
       '@eslint/core': 0.13.0
       levn: 0.4.1
 
-  '@ethercorps/sveltekit-og@4.2.1(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))':
+  '@ethercorps/sveltekit-og@4.2.1(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))':
     dependencies:
       '@resvg/resvg-wasm': 2.6.2
-      '@sveltejs/kit': 2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+      '@sveltejs/kit': 2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       '@takumi-rs/helpers': 0.55.4
       '@takumi-rs/image-response': 0.55.4
       '@takumi-rs/wasm': 0.55.4
···
 
   '@floating-ui/utils@0.2.10': {}
 
-  '@foxui/colors@0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)':
+  '@foxui/colors@0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)':
     dependencies:
-      '@foxui/core': 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
+      '@foxui/core': 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
       '@texel/color': 1.1.11
       '@use-gesture/vanilla': 10.3.1
-      bits-ui: 1.8.0(svelte@5.45.8)
-      svelte: 5.45.8
+      bits-ui: 1.8.0(svelte@5.46.4)
+      svelte: 5.46.4
       tailwindcss: 4.1.5
 
-  '@foxui/core@0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)':
+  '@foxui/core@0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)':
     dependencies:
-      '@number-flow/svelte': 0.3.9(svelte@5.45.8)
-      bits-ui: 1.8.0(svelte@5.45.8)
+      '@number-flow/svelte': 0.3.9(svelte@5.46.4)
+      bits-ui: 1.8.0(svelte@5.46.4)
       clsx: 2.1.1
-      mode-watcher: 1.1.0(svelte@5.45.8)
-      svelte: 5.45.8
-      svelte-sonner: 0.3.28(svelte@5.45.8)
+      mode-watcher: 1.1.0(svelte@5.46.4)
+      svelte: 5.46.4
+      svelte-sonner: 0.3.28(svelte@5.46.4)
       tailwind-merge: 3.4.0
       tailwind-variants: 1.0.0(tailwindcss@4.1.5)
       tailwindcss: 4.1.5
 
-  '@foxui/social@0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)':
+  '@foxui/social@0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)':
     dependencies:
       '@atproto/api': 0.15.27
-      '@foxui/core': 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
-      '@foxui/time': 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
+      '@foxui/core': 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
+      '@foxui/time': 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
       '@use-gesture/vanilla': 10.3.1
-      bits-ui: 1.8.0(svelte@5.45.8)
+      bits-ui: 1.8.0(svelte@5.46.4)
       emoji-picker-element: 1.28.1
       hls.js: 1.6.15
       is-emoji-supported: 0.0.5
       plyr: 3.8.4
-      svelte: 5.45.8
+      svelte: 5.46.4
       tailwindcss: 4.1.5
 
-  '@foxui/time@0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)':
+  '@foxui/time@0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)':
     dependencies:
-      '@foxui/core': 0.4.7(svelte@5.45.8)(tailwindcss@4.1.5)
-      '@number-flow/svelte': 0.3.9(svelte@5.45.8)
-      bits-ui: 1.8.0(svelte@5.45.8)
-      svelte: 5.45.8
+      '@foxui/core': 0.4.7(svelte@5.46.4)(tailwindcss@4.1.5)
+      '@number-flow/svelte': 0.3.9(svelte@5.46.4)
+      bits-ui: 1.8.0(svelte@5.46.4)
+      svelte: 5.46.4
       tailwindcss: 4.1.5
 
   '@humanfs/core@0.19.1': {}
···
 
   '@jridgewell/gen-mapping@0.3.13':
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.0
+      '@jridgewell/sourcemap-codec': 1.5.5
       '@jridgewell/trace-mapping': 0.3.31
 
   '@jridgewell/remapping@2.3.5':
···
   '@jridgewell/trace-mapping@0.3.31':
     dependencies:
       '@jridgewell/resolve-uri': 3.1.2
-      '@jridgewell/sourcemap-codec': 1.5.0
+      '@jridgewell/sourcemap-codec': 1.5.5
 
   '@jridgewell/trace-mapping@0.3.9':
     dependencies:
···
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.19.1
 
-  '@number-flow/svelte@0.3.9(svelte@5.45.8)':
+  '@number-flow/svelte@0.3.9(svelte@5.46.4)':
     dependencies:
       esm-env: 1.2.2
       number-flow: 0.5.8
-      svelte: 5.45.8
+      svelte: 5.46.4
 
   '@polka/url@1.0.0-next.29': {}
 
···
 
   '@speed-highlight/core@1.2.12': {}
 
-  '@sveltejs/acorn-typescript@1.0.5(acorn@8.14.1)':
-    dependencies:
-      acorn: 8.14.1
+  '@standard-schema/spec@1.1.0': {}
 
-  '@sveltejs/adapter-auto@4.0.0(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))':
+  '@sveltejs/acorn-typescript@1.0.5(acorn@8.15.0)':
     dependencies:
-      '@sveltejs/kit': 2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
-      import-meta-resolve: 4.1.0
+      acorn: 8.15.0
 
-  '@sveltejs/adapter-cloudflare@7.2.4(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(wrangler@4.54.0(@cloudflare/workers-types@4.20260109.0))':
+  '@sveltejs/adapter-cloudflare@7.2.4(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(wrangler@4.54.0(@cloudflare/workers-types@4.20260109.0))':
     dependencies:
       '@cloudflare/workers-types': 4.20260109.0
-      '@sveltejs/kit': 2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+      '@sveltejs/kit': 2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       worktop: 0.8.0-next.18
       wrangler: 4.54.0(@cloudflare/workers-types@4.20260109.0)
 
-  '@sveltejs/adapter-static@3.0.8(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))':
-    dependencies:
-      '@sveltejs/kit': 2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
-
-  '@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))':
+  '@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))':
     dependencies:
-      '@sveltejs/vite-plugin-svelte': 5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+      '@standard-schema/spec': 1.1.0
+      '@sveltejs/acorn-typescript': 1.0.5(acorn@8.15.0)
+      '@sveltejs/vite-plugin-svelte': 5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       '@types/cookie': 0.6.0
+      acorn: 8.15.0
       cookie: 0.6.0
-      devalue: 5.1.1
+      devalue: 5.6.2
       esm-env: 1.2.2
-      import-meta-resolve: 4.1.0
       kleur: 4.1.5
-      magic-string: 0.30.17
+      magic-string: 0.30.21
       mrmime: 2.0.1
       sade: 1.8.1
       set-cookie-parser: 2.7.1
       sirv: 3.0.1
-      svelte: 5.45.8
+      svelte: 5.46.4
       vite: 6.3.5(jiti@2.4.2)(lightningcss@1.29.2)
+    optionalDependencies:
+      typescript: 5.8.3
 
-  '@sveltejs/vite-plugin-svelte-inspector@4.0.1(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))':
+  '@sveltejs/vite-plugin-svelte-inspector@4.0.1(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))':
     dependencies:
-      '@sveltejs/vite-plugin-svelte': 5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+      '@sveltejs/vite-plugin-svelte': 5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       debug: 4.4.0
-      svelte: 5.45.8
+      svelte: 5.46.4
       vite: 6.3.5(jiti@2.4.2)(lightningcss@1.29.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))':
+  '@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))':
     dependencies:
-      '@sveltejs/vite-plugin-svelte-inspector': 4.0.1(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+      '@sveltejs/vite-plugin-svelte-inspector': 4.0.1(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
       debug: 4.4.0
       deepmerge: 4.3.1
       kleur: 4.1.5
       magic-string: 0.30.17
-      svelte: 5.45.8
+      svelte: 5.46.4
       vite: 6.3.5(jiti@2.4.2)(lightningcss@1.29.2)
       vitefu: 1.0.6(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
     transitivePeerDependencies:
···
 
   base64-js@0.0.8: {}
 
-  bits-ui@1.8.0(svelte@5.45.8):
+  bits-ui@1.8.0(svelte@5.46.4):
     dependencies:
       '@floating-ui/core': 1.7.3
       '@floating-ui/dom': 1.7.4
       '@internationalized/date': 3.8.0
       css.escape: 1.5.1
       esm-env: 1.2.2
-      runed: 0.23.4(svelte@5.45.8)
-      svelte: 5.45.8
-      svelte-toolbelt: 0.7.1(svelte@5.45.8)
+      runed: 0.23.4(svelte@5.46.4)
+      svelte: 5.46.4
+      svelte-toolbelt: 0.7.1(svelte@5.46.4)
       tabbable: 6.2.0
 
-  bits-ui@2.14.4(@internationalized/date@3.8.0)(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8):
+  bits-ui@2.14.4(@internationalized/date@3.8.0)(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4):
     dependencies:
       '@floating-ui/core': 1.7.3
       '@floating-ui/dom': 1.7.4
       '@internationalized/date': 3.8.0
       esm-env: 1.2.2
-      runed: 0.35.1(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)
-      svelte: 5.45.8
-      svelte-toolbelt: 0.10.6(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)
+      runed: 0.35.1(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)
+      svelte: 5.46.4
+      svelte-toolbelt: 0.10.6(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)
       tabbable: 6.2.0
     transitivePeerDependencies:
       - '@sveltejs/kit'
···
 
   detect-libc@2.0.4: {}
 
-  devalue@5.1.1: {}
-
-  devalue@5.6.0: {}
+  devalue@5.6.2: {}
 
   dom-serializer@2.0.0:
     dependencies:
···
     dependencies:
       eslint: 9.26.0(jiti@2.4.2)
 
-  eslint-plugin-svelte@2.46.1(eslint@9.26.0(jiti@2.4.2))(svelte@5.45.8):
+  eslint-plugin-svelte@2.46.1(eslint@9.26.0(jiti@2.4.2))(svelte@5.46.4):
     dependencies:
       '@eslint-community/eslint-utils': 4.7.0(eslint@9.26.0(jiti@2.4.2))
       '@jridgewell/sourcemap-codec': 1.5.0
···
       postcss-safe-parser: 6.0.0(postcss@8.5.3)
       postcss-selector-parser: 6.1.2
       semver: 7.7.1
-      svelte-eslint-parser: 0.43.0(svelte@5.45.8)
+      svelte-eslint-parser: 0.43.0(svelte@5.46.4)
     optionalDependencies:
-      svelte: 5.45.8
+      svelte: 5.46.4
     transitivePeerDependencies:
       - ts-node
 
···
 
   esrap@2.2.1:
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.0
+      '@jridgewell/sourcemap-codec': 1.5.5
 
   esrecurse@4.3.0:
     dependencies:
···
       parent-module: 1.0.1
       resolve-from: 4.0.0
 
-  import-meta-resolve@4.1.0: {}
-
   imurmurhash@0.1.4: {}
 
   inherits@2.0.4: {}
···
       pkg-types: 1.3.1
       ufo: 1.6.2
 
-  mode-watcher@1.1.0(svelte@5.45.8):
+  mode-watcher@1.1.0(svelte@5.46.4):
     dependencies:
-      runed: 0.25.0(svelte@5.45.8)
-      svelte: 5.45.8
-      svelte-toolbelt: 0.7.1(svelte@5.45.8)
+      runed: 0.25.0(svelte@5.46.4)
+      svelte: 5.46.4
+      svelte-toolbelt: 0.7.1(svelte@5.46.4)
 
   mri@1.2.0: {}
 
···
 
   prelude-ls@1.2.1: {}
 
-  prettier-plugin-svelte@3.3.3(prettier@3.5.3)(svelte@5.45.8):
+  prettier-plugin-svelte@3.3.3(prettier@3.5.3)(svelte@5.46.4):
     dependencies:
       prettier: 3.5.3
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  prettier-plugin-tailwindcss@0.6.11(prettier-plugin-svelte@3.3.3(prettier@3.5.3)(svelte@5.45.8))(prettier@3.5.3):
+  prettier-plugin-tailwindcss@0.6.11(prettier-plugin-svelte@3.3.3(prettier@3.5.3)(svelte@5.46.4))(prettier@3.5.3):
     dependencies:
       prettier: 3.5.3
     optionalDependencies:
-      prettier-plugin-svelte: 3.3.3(prettier@3.5.3)(svelte@5.45.8)
+      prettier-plugin-svelte: 3.3.3(prettier@3.5.3)(svelte@5.46.4)
 
   prettier@3.5.3: {}
 
···
     dependencies:
       queue-microtask: 1.2.3
 
-  runed@0.23.4(svelte@5.45.8):
+  runed@0.23.4(svelte@5.46.4):
     dependencies:
       esm-env: 1.2.2
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  runed@0.25.0(svelte@5.45.8):
+  runed@0.25.0(svelte@5.46.4):
     dependencies:
       esm-env: 1.2.2
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  runed@0.28.0(svelte@5.45.8):
+  runed@0.28.0(svelte@5.46.4):
     dependencies:
       esm-env: 1.2.2
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  runed@0.35.1(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8):
+  runed@0.35.1(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4):
     dependencies:
       dequal: 2.0.3
       esm-env: 1.2.2
       lz-string: 1.5.0
-      svelte: 5.45.8
+      svelte: 5.46.4
     optionalDependencies:
-      '@sveltejs/kit': 2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
+      '@sveltejs/kit': 2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2))
 
   sade@1.8.1:
     dependencies:
···
     dependencies:
       has-flag: 4.0.0
 
-  svelte-check@4.1.7(picomatch@4.0.2)(svelte@5.45.8)(typescript@5.8.3):
+  svelte-check@4.1.7(picomatch@4.0.2)(svelte@5.46.4)(typescript@5.8.3):
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
       chokidar: 4.0.3
       fdir: 6.4.4(picomatch@4.0.2)
       picocolors: 1.1.1
       sade: 1.8.1
-      svelte: 5.45.8
+      svelte: 5.46.4
       typescript: 5.8.3
     transitivePeerDependencies:
       - picomatch
 
-  svelte-eslint-parser@0.43.0(svelte@5.45.8):
+  svelte-eslint-parser@0.43.0(svelte@5.46.4):
     dependencies:
       eslint-scope: 7.2.2
       eslint-visitor-keys: 3.4.3
···
       postcss: 8.5.3
       postcss-scss: 4.0.9(postcss@8.5.3)
     optionalDependencies:
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  svelte-sonner@0.3.28(svelte@5.45.8):
+  svelte-sonner@0.3.28(svelte@5.46.4):
     dependencies:
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  svelte-sonner@1.0.7(svelte@5.45.8):
+  svelte-sonner@1.0.7(svelte@5.46.4):
     dependencies:
-      runed: 0.28.0(svelte@5.45.8)
-      svelte: 5.45.8
+      runed: 0.28.0(svelte@5.46.4)
+      svelte: 5.46.4
 
-  svelte-toolbelt@0.10.6(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8):
+  svelte-toolbelt@0.10.6(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4):
     dependencies:
       clsx: 2.1.1
-      runed: 0.35.1(@sveltejs/kit@2.20.8(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.45.8)
+      runed: 0.35.1(@sveltejs/kit@2.49.5(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.46.4)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)(typescript@5.8.3)(vite@6.3.5(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.46.4)
       style-to-object: 1.0.8
-      svelte: 5.45.8
+      svelte: 5.46.4
     transitivePeerDependencies:
       - '@sveltejs/kit'
 
-  svelte-toolbelt@0.7.1(svelte@5.45.8):
+  svelte-toolbelt@0.7.1(svelte@5.46.4):
     dependencies:
       clsx: 2.1.1
-      runed: 0.23.4(svelte@5.45.8)
+      runed: 0.23.4(svelte@5.46.4)
       style-to-object: 1.0.8
-      svelte: 5.45.8
+      svelte: 5.46.4
 
-  svelte@5.45.8:
+  svelte@5.46.4:
     dependencies:
       '@jridgewell/remapping': 2.3.5
-      '@jridgewell/sourcemap-codec': 1.5.0
-      '@sveltejs/acorn-typescript': 1.0.5(acorn@8.14.1)
+      '@jridgewell/sourcemap-codec': 1.5.5
+      '@sveltejs/acorn-typescript': 1.0.5(acorn@8.15.0)
       '@types/estree': 1.0.7
-      acorn: 8.14.1
+      acorn: 8.15.0
       aria-query: 5.3.2
       axobject-query: 4.1.0
       clsx: 2.1.1
-      devalue: 5.6.0
+      devalue: 5.6.2
       esm-env: 1.2.2
       esrap: 2.2.1
       is-reference: 3.0.3
       locate-character: 3.0.0
-      magic-string: 0.30.17
+      magic-string: 0.30.21
       zimmerframe: 1.1.2
 
   tabbable@6.2.0: {}

src/lib/EditableWebsite.svelte

···
-<script lang="ts">
-	import { client, login } from '$lib/oauth/auth.svelte.js';
-
-	import { Navbar, Button, toast, Toaster, Toggle, Sidebar } from '@foxui/core';
-	import { BlueskyLogin } from '@foxui/social';
-
-	import { COLUMNS, margin, mobileMargin } from '$lib';
-	import {
-		cardsEqual,
-		clamp,
-		compactItems,
-		fixCollisions,
-		setCanEdit,
-		setIsMobile,
-		setPositionOfNewItem,
-		simulateFinalPosition
-	} from './helper';
-	import Profile from './Profile.svelte';
-	import type { Item } from './types';
-	import { deleteRecord, putRecord } from './oauth/atproto';
-	import { innerWidth } from 'svelte/reactivity/window';
-	import { TID } from '@atproto/common-web';
-	import EditingCard from './cards/Card/EditingCard.svelte';
-	import { AllCardDefinitions, CardDefinitionsByType } from './cards';
-	import { tick, type Component } from 'svelte';
-	import type { CreationModalComponentProps } from './cards/types';
-	import { dev } from '$app/environment';
-	import { setDidContext, setHandleContext } from './website/context';
-	import BaseEditingCard from './cards/BaseCard/BaseEditingCard.svelte';
-	import Settings from './Settings.svelte';
-	import ImageDropper from './components/ImageDropper.svelte';
-
-	let {
-		handle,
-		did,
-		data,
-		items: originalItems,
-		settings
-	}: { handle: string; did: string; data: any; items: Item[]; settings: any } = $props();
-
-	// svelte-ignore state_referenced_locally
-	let items: Item[] = $state(originalItems);
-
-	let container: HTMLDivElement | undefined = $state();
-
-	let activeDragElement: {
-		element: HTMLDivElement | null;
-		item: Item | null;
-		w: number;
-		h: number;
-		x: number;
-		y: number;
-		mouseDeltaX: number;
-		mouseDeltaY: number;
-	} = $state({
-		element: null,
-		item: null,
-		w: 0,
-		h: 0,
-		x: -1,
-		y: -1,
-		mouseDeltaX: 0,
-		mouseDeltaY: 0
-	});
-
-	let showingMobileView = $state(false);
-	let isMobile = $derived(showingMobileView || (innerWidth.current ?? 1000) < 1024);
-
-	setIsMobile(() => isMobile);
-
-	setCanEdit(() => dev || (client.isLoggedIn && client.profile?.did === did));
-
-	// svelte-ignore state_referenced_locally
-	setDidContext(did);
-	// svelte-ignore state_referenced_locally
-	setHandleContext(handle);
-
-	const getX = (item: Item) => (isMobile ? (item.mobileX ?? item.x) : item.x);
-	const getY = (item: Item) => (isMobile ? (item.mobileY ?? item.y) : item.y);
-	const getW = (item: Item) => (isMobile ? (item.mobileW ?? item.w) : item.w);
-	const getH = (item: Item) => (isMobile ? (item.mobileH ?? item.h) : item.h);
-
-	let maxHeight = $derived(items.reduce((max, item) => Math.max(max, getY(item) + getH(item)), 0));
-
-	function newCard(type: string = 'link') {
-		// close sidebar if open
-		const popover = document.getElementById('mobile-menu');
-		if (popover) {
-			popover.hidePopover();
-		}
-
-		let item: Item = {
-			id: TID.nextStr(),
-			x: 0,
-			y: 0,
-			w: 2,
-			h: 2,
-			mobileH: 4,
-			mobileW: 4,
-			mobileX: 0,
-			mobileY: 0,
-			cardType: type,
-			cardData: {}
-		};
-		const cardDef = CardDefinitionsByType[type];
-		cardDef?.createNew?.(item);
-
-		newItem.item = item;
-
-		if (cardDef?.creationModalComponent) {
-			newItem.modal = cardDef.creationModalComponent;
-		} else {
-			saveNewItem();
-		}
-	}
-
-	async function saveNewItem() {
-		if (!newItem.item) return;
-		const item = newItem.item;
-
-		setPositionOfNewItem(item, items);
-
-		items = [...items, item];
-
-		const containerRect = container?.getBoundingClientRect();
-
-		newItem = {};
-
-		await tick();
-
-		// scroll to newly created card
-		if (!containerRect) return;
-		const currentMargin = isMobile ? mobileMargin : margin;
-		const currentY = isMobile ? item.mobileY : item.y;
-		const bodyRect = document.body.getBoundingClientRect();
-		const offset = containerRect.top - bodyRect.top;
-		const cellSize = (containerRect.width - currentMargin * 2) / COLUMNS;
-		window.scrollTo({ top: offset + cellSize * (currentY - 1), behavior: 'smooth' });
-	}
-
-	let isSaving = $state(false);
-
-	let newItem: { modal?: Component<CreationModalComponentProps>; item?: Item } = $state({});
-
-	async function save() {
-		isSaving = true;
-
-		const promises = [];
-		// find all cards that have been updated (where items differ from originalItems)
-		for (let item of items) {
-			const originalItem = originalItems.find((i) => cardsEqual(i, item));
-
-			if (!originalItem) {
-				console.log('updated or new item', item);
-				item.updatedAt = new Date().toISOString();
-				// run optional upload function for this card type
-				const cardDef = CardDefinitionsByType[item.cardType];
-
-				if (cardDef?.upload) {
-					item = await cardDef?.upload(item);
-				}
-
-				item.version = 1;
-
-				promises.push(
-					putRecord({
-						collection: 'app.blento.card',
-						rkey: item.id,
-						record: item
-					})
-				);
-			}
-		}
-
-		// delete items that are in originalItems but not in items
-		for (let originalItem of originalItems) {
-			const item = items.find((i) => i.id === originalItem.id);
-			if (!item) {
-				console.log('deleting item', originalItem);
-				promises.push(deleteRecord({ collection: 'app.blento.card', rkey: originalItem.id, did }));
-			}
-		}
-
-		await Promise.all(promises);
-
-		isSaving = false;
-
-		fetch('/' + handle + '/api/refreshData');
-		console.log('refreshing data');
-
-		toast('Saved', {
-			description: 'Your website has been saved!'
-		});
-	}
-
-	const sidebarItems = AllCardDefinitions.filter(
-		(cardDef) => cardDef.sidebarComponent || cardDef.sidebarButtonText
-	);
-
-	let showSettings = $state(false);
-
-	let debugPoint = $state({ x: 0, y: 0 });
-
-	function getDragXY(
-		e: DragEvent & {
-			currentTarget: EventTarget & HTMLDivElement;
-		}
-	) {
-		if (!container) return;
-
-		const x = e.clientX + activeDragElement.mouseDeltaX;
-		const y = e.clientY + activeDragElement.mouseDeltaY;
-
-		const rect = container.getBoundingClientRect();
-
-		debugPoint.x = x - rect.left;
-		debugPoint.y = y - rect.top + margin;
-		console.log(rect.top);
-
-		let gridX = clamp(
-			Math.floor(((x - rect.left) / rect.width) * 8),
-			0,
-			COLUMNS - (activeDragElement.w ?? 0)
-		);
-		gridX = Math.floor(gridX / 2) * 2;
-		let gridY = Math.max(
-			Math.round(((y - rect.top + margin) / (rect.width - margin)) * COLUMNS),
-			0
-		);
-		if (isMobile) {
-			gridX = Math.floor(gridX / 2) * 2;
-			gridY = Math.floor(gridY / 2) * 2;
-		}
-		return { x: gridX, y: gridY };
-	}
-</script>
-
-<svelte:body
-	onpaste={(event) => {
-		const target = event.target;
-
-		const active = document.activeElement;
-		const isEditable =
-			active instanceof HTMLInputElement ||
-			active instanceof HTMLTextAreaElement ||
-			active?.isContentEditable;
-
-		if (isEditable) {
-			// Let normal paste happen
-			return;
-		}
-
-		const text = event.clipboardData?.getData('text/plain');
-
-		if (!text) return;
-
-		try {
-			const url = new URL(text);
-
-			let item: Item = {
-				id: TID.nextStr(),
-				x: 0,
-				y: 0,
-				w: 2,
-				h: 2,
-				mobileH: 4,
-				mobileW: 4,
-				mobileX: 0,
-				mobileY: 0,
-				cardType: '',
-				cardData: {}
-			};
-
-			newItem.item = item;
-
-			for (const cardDef of AllCardDefinitions) {
-				if (cardDef.onUrlHandler?.(text, item)) {
-					item.cardType = cardDef.type;
-					saveNewItem();
-				}
-			}
-
-			newItem = {};
-		} catch (e) {
-			return;
-		}
-	}}
-/>
-
-<!-- <ImageDropper processImageFile={(file: File) => {}} /> -->
-
-{#if !dev}
-	<div
-		class="bg-base-200 dark:bg-base-800 fixed inset-0 z-50 inline-flex h-full w-full items-center justify-center p-4 text-center lg:hidden"
-	>
-		Editing on mobile is not supported yet. Please use a desktop browser.
-	</div>
-{/if}
-
-{#if showingMobileView}
-	<div
-		class="bg-base-200 dark:bg-base-900 pointer-events-none fixed inset-0 -z-10 h-full w-full"
-	></div>
-{/if}
-
-{#if newItem.modal && newItem.item}
-	<newItem.modal
-		oncreate={() => {
-			saveNewItem();
-		}}
-		bind:item={newItem.item}
-		oncancel={() => {
-			newItem = {};
-		}}
-	/>
-{/if}
-
-<div
-	class={[
-		'@container/wrapper relative w-full',
-		showingMobileView
-			? 'bg-base-50 dark:bg-base-950 my-4 min-h-[calc(100dhv-2em)] rounded-2xl lg:mx-auto lg:w-[400px]'
-			: ''
-	]}
->
-	<Profile {handle} {did} {data} />
-
-	<div class="mx-auto max-w-lg @5xl/wrapper:grid @5xl/wrapper:max-w-7xl @5xl/wrapper:grid-cols-4">
-		<div></div>
-		<!-- svelte-ignore a11y_no_static_element_interactions -->
-		<div
-			bind:this={container}
-			ondragover={(e) => {
-				e.preventDefault();
-
-				const cell = getDragXY(e);
-				if (!cell) return;
-
-				activeDragElement.x = cell.x;
-				activeDragElement.y = cell.y;
-
-				if (activeDragElement.item) {
-					if (isMobile) {
-						activeDragElement.item.mobileX = cell.x;
-						activeDragElement.item.mobileY = cell.y;
-					} else {
-						activeDragElement.item.x = cell.x;
-						activeDragElement.item.y = cell.y;
-					}
-
-					fixCollisions(items, activeDragElement.item, isMobile);
-				}
-
-				// Auto-scroll when dragging near top or bottom of viewport
-				const scrollZone = 100;
-				const scrollSpeed = 10;
-				const viewportHeight = window.innerHeight;
-
-				if (e.clientY < scrollZone) {
-					// Near top - scroll up
-					const intensity = 1 - e.clientY / scrollZone;
-					window.scrollBy(0, -scrollSpeed * intensity);
-				} else if (e.clientY > viewportHeight - scrollZone) {
-					// Near bottom - scroll down
-					const intensity = 1 - (viewportHeight - e.clientY) / scrollZone;
-					window.scrollBy(0, scrollSpeed * intensity);
-				}
-			}}
-			ondragend={async (e) => {
-				e.preventDefault();
-				const cell = getDragXY(e);
-				if (!cell) return;
-
-				if (activeDragElement.item) {
-					if (isMobile) {
-						activeDragElement.item.mobileX = cell.x;
-						activeDragElement.item.mobileY = cell.y;
-					} else {
-						activeDragElement.item.x = cell.x;
-						activeDragElement.item.y = cell.y;
-					}
-
-					fixCollisions(items, activeDragElement.item, isMobile);
-				}
-				activeDragElement.x = -1;
-				activeDragElement.y = -1;
-				activeDragElement.element = null;
-				return true;
-			}}
-			class="@container/grid relative col-span-3 px-2 py-8 @5xl/wrapper:px-8"
-		>
-			{#each items as item, i (item.id)}
-				<!-- {#if item !== activeDragElement.item} -->
-				<BaseEditingCard
-					bind:item={items[i]}
-					ondelete={() => {
-						items = items.filter((it) => it !== item);
-						compactItems(items, isMobile);
-					}}
-					onsetsize={(newW: number, newH: number) => {
-						if (isMobile) {
-							item.mobileW = newW;
-							item.mobileH = newH;
-						} else {
-							item.w = newW;
-							item.h = newH;
-						}
-
-						fixCollisions(items, item, isMobile);
-					}}
-					ondragstart={(e) => {
-						const target = e.currentTarget as HTMLDivElement;
-						activeDragElement.element = target;
-						activeDragElement.w = item.w;
-						activeDragElement.h = item.h;
-						activeDragElement.item = item;
-
-						const rect = target.getBoundingClientRect();
-						activeDragElement.mouseDeltaX = rect.left - e.clientX;
-						activeDragElement.mouseDeltaY = rect.top - e.clientY;
-						console.log(activeDragElement.mouseDeltaY);
-						console.log(rect.width);
-					}}
-				>
-					<EditingCard bind:item={items[i]} />
-				</BaseEditingCard>
-				<!-- {/if} -->
-			{/each}
-
-			<div style="height: {((maxHeight + 2) / 8) * 100}cqw;"></div>
-		</div>
-	</div>
-</div>
-
-<Settings bind:open={showSettings} />
-
-<Sidebar mobileOnly mobileClasses="lg:block p-4 gap-4">
-	<div class="flex flex-col gap-2">
-		{#each sidebarItems as cardDef}
-			{#if cardDef.sidebarComponent}
-				<cardDef.sidebarComponent onclick={() => newCard(cardDef.type)} />
-			{:else if cardDef.sidebarButtonText}
-				<Button onclick={() => newCard(cardDef.type)} variant="ghost" class="w-full justify-start"
-					>{cardDef.sidebarButtonText}</Button
-				>
-			{/if}
-		{/each}
-	</div>
-</Sidebar>
-
-{#if dev || (!client.isLoggedIn && !client.isInitializing) || client.profile?.did === did}
-	<Navbar
-		class={[
-			'dark:bg-base-900 bg-base-100 top-auto bottom-2 mx-4 mt-3 max-w-3xl rounded-full px-4 md:mx-auto lg:inline-flex',
-			!dev ? 'hidden' : ''
-		]}
-	>
-		<div class="flex items-center gap-2">
-			{#if dev}
-				<Button
-					size="iconLg"
-					variant="ghost"
-					class="mr-4 backdrop-blur-none"
-					onclick={() => {
-						showSettings = true;
-					}}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						fill="none"
-						viewBox="0 0 24 24"
-						stroke-width="1.5"
-						stroke="currentColor"
-					>
-						<path
-							stroke-linecap="round"
-							stroke-linejoin="round"
-							d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
-						/>
-						<path
-							stroke-linecap="round"
-							stroke-linejoin="round"
-							d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
-						/>
-					</svg>
-				</Button>
-			{/if}
-
-			<Button
-				size="iconLg"
-				variant="ghost"
-				class="backdrop-blur-none"
-				onclick={() => {
-					newCard('text');
-				}}
-			>
-				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
-					><path
-						fill="none"
-						stroke="currentColor"
-						stroke-linecap="round"
-						stroke-linejoin="round"
-						stroke-width="1.5"
-						d="m15 16l2.536-7.328a1.02 1.02 1 0 1 1.928 0L22 16m-6.303-2h5.606M2 16l4.039-9.69a.5.5 0 0 1 .923 0L11 16m-7.696-3h6.392"
-					/></svg
-				>
-			</Button>
-			<Button
-				size="iconLg"
-				variant="ghost"
-				class="backdrop-blur-none"
-				onclick={() => {
-					newCard('link');
-				}}
-			>
-				<svg
-					xmlns="http://www.w3.org/2000/svg"
-					fill="none"
-					viewBox="-2 -2 28 28"
-					stroke-width="1.5"
-					stroke="currentColor"
-				>
-					<path
-						stroke-linecap="round"
-						stroke-linejoin="round"
-						d="M13.19 8.688a4.5 4.5 0 0 1 1.242 7.244l-4.5 4.5a4.5 4.5 0 0 1-6.364-6.364l1.757-1.757m13.35-.622 1.757-1.757a4.5 4.5 0 0 0-6.364-6.364l-4.5 4.5a4.5 4.5 0 0 0 1.242 7.244"
-					/>
-				</svg>
-			</Button>
-
-			<Button
-				size="iconLg"
-				variant="ghost"
-				class="backdrop-blur-none"
-				onclick={() => {
-					newCard('image');
-				}}
-			>
-				<svg
-					xmlns="http://www.w3.org/2000/svg"
-					fill="none"
-					viewBox="0 0 24 24"
-					stroke-width="1.5"
-					stroke="currentColor"
-				>
-					<path
-						stroke-linecap="round"
-						stroke-linejoin="round"
-						d="m2.25 15.75 5.159-5.159a2.25 2.25 0 0 1 3.182 0l5.159 5.159m-1.5-1.5 1.409-1.409a2.25 2.25 0 0 1 3.182 0l2.909 2.909m-18 3.75h16.5a1.5 1.5 0 0 0 1.5-1.5V6a1.5 1.5 0 0 0-1.5-1.5H3.75A1.5 1.5 0 0 0 2.25 6v12a1.5 1.5 0 0 0 1.5 1.5Zm10.5-11.25h.008v.008h-.008V8.25Zm.375 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Z"
-					/>
-				</svg>
-			</Button>
-
-			<Button size="iconLg" variant="ghost" class="backdrop-blur-none" popovertarget="mobile-menu">
-				<svg
-					xmlns="http://www.w3.org/2000/svg"
-					fill="none"
-					viewBox="0 0 24 24"
-					stroke-width="1.5"
-					stroke="currentColor"
-				>
-					<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
-				</svg>
-			</Button>
-
-			<!-- for special stuff -->
-			{#if handle === 'blento.app'}
-				<Button
-					size="iconLg"
-					variant="ghost"
-					class="backdrop-blur-none"
-					onclick={() => {
-						newCard('updatedBlentos');
-					}}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						fill="none"
-						viewBox="0 0 24 24"
-						stroke-width="1.5"
-						stroke="currentColor"
-					>
-						<path
-							stroke-linecap="round"
-							stroke-linejoin="round"
-							d="M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.894 20.567 16.5 21.75l-.394-1.183a2.25 2.25 0 0 0-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 0 0 1.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 0 0 1.423 1.423l1.183.394-1.183.394a2.25 2.25 0 0 0-1.423 1.423Z"
-						/>
-					</svg>
-				</Button>
-			{/if}
-		</div>
-		<div class="flex items-center gap-2">
-			<Toggle
-				class="hidden bg-transparent backdrop-blur-none lg:block dark:bg-transparent"
-				bind:pressed={showingMobileView}
-			>
-				<svg
-					xmlns="http://www.w3.org/2000/svg"
-					fill="none"
-					viewBox="0 0 24 24"
-					stroke-width="1.5"
-					stroke="currentColor"
-					class="size-6"
-				>
-					<path
-						stroke-linecap="round"
-						stroke-linejoin="round"
-						d="M10.5 1.5H8.25A2.25 2.25 0 0 0 6 3.75v16.5a2.25 2.25 0 0 0 2.25 2.25h7.5A2.25 2.25 0 0 0 18 20.25V3.75a2.25 2.25 0 0 0-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"
-					/>
-				</svg>
-			</Toggle>
-			{#if client.isLoggedIn}
-				<Button
-					disabled={isSaving}
-					onclick={async () => {
-						save();
-					}}>{isSaving ? 'Saving...' : 'Save'}</Button
-				>
-			{:else}
-				<BlueskyLogin
-					login={async (handle) => {
-						await login(handle);
-						return true;
-					}}
-				/>
-			{/if}
-		</div>
-	</Navbar>
-{/if}
-
-<Toaster />

src/lib/Head.svelte

···
-<script lang="ts">
-	let { favicon, title, image }: { favicon: string | null; title: string | null; image?: string } =
-		$props();
-</script>
-
-<svelte:head>
-	{#if favicon}
-		<link rel="icon" href={favicon} />
-	{/if}
-
-	{#if title}
-		<title>{title}</title>
-	{/if}
-
-	{#if image}
-		<meta property="og:image" content={image} />
-		<meta name="twitter:image" content={image} />
-		<meta name="twitter:card" content="summary_large_image" />
-	{/if}
-</svelte:head>

src/lib/Profile.svelte

···
-<script lang="ts">
-	import Head from './Head.svelte';
-
-	import { marked } from 'marked';
-	import { client, login } from './oauth';
-	import { Button, Subheading } from '@foxui/core';
-	import { BlueskyLogin } from '@foxui/social';
-	import { env } from '$env/dynamic/public';
-	let {
-		handle,
-		did,
-		data,
-		showEditButton = false
-	}: { handle: string; did: string; data: any; showEditButton?: boolean } = $props();
-
-	// svelte-ignore state_referenced_locally
-	const profileData = data?.data?.['app.bsky.actor.profile']?.self?.value;
-
-	const renderer = new marked.Renderer();
-	renderer.link = ({ href, title, text }) =>
-		`<a target="_blank" href="${href}" title="${title}">${text}</a>`;
-</script>
-
-<Head
-	favicon={profileData?.avatar?.ref?.$link ? 'https://cdn.bsky.app/img/avatar/plain/' + did + '/' + profileData.avatar.ref.$link : null}
-	title={profileData?.displayName || handle}
-	image={'/' + handle + '/og.png'}
-/>
-
-<!-- lg:fixed lg:h-screen lg:w-1/4 lg:max-w-none lg:px-12 lg:pt-24 xl:w-1/3 -->
-<div
-	class="mx-auto flex max-w-lg flex-col justify-between px-8 @5xl/wrapper:fixed @5xl/wrapper:h-screen @5xl/wrapper:w-1/4 @5xl/wrapper:max-w-none @5xl/wrapper:px-12"
->
-	<div class="flex flex-col gap-4 pt-16 pb-8 @5xl/wrapper:h-screen @5xl/wrapper:pt-24">
-		{#if profileData?.avatar?.ref?.$link}
-			<img
-				class="size-32 rounded-full @5xl/wrapper:size-44 border border-base-400 dark:border-base-800"
-				src={'https://cdn.bsky.app/img/avatar/plain/' + did + '/' + profileData.avatar.ref.$link}
-				alt=""
-			/>
-		{:else}
-			<div class="bg-base-300 dark:bg-base-700 size-32 rounded-full @5xl/wrapper:size-44"></div>
-		{/if}
-		<div class="text-4xl font-bold wrap-anywhere">
-			{profileData?.displayName || handle}
-		</div>
-
-		<div class="scrollbar -mx-4 flex-grow overflow-y-scroll px-4 overflow-x-hidden">
-			<div
-				class="text-base-600 dark:text-base-400 prose dark:prose-invert prose-a:text-accent-500 prose-a:no-underline"
-			>
-				{@html marked.parse(profileData?.description ?? '', { renderer })}
-			</div>
-		</div>
-
-		{#if showEditButton && client.isLoggedIn && client.profile?.did === did}
-			<div>
-				<Button href="{env.PUBLIC_IS_SELFHOSTED ? '' : client.profile?.handle}/edit" class="mt-2">
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						fill="none"
-						viewBox="0 0 24 24"
-						stroke-width="1.5"
-						stroke="currentColor"
-					>
-						<path
-							stroke-linecap="round"
-							stroke-linejoin="round"
-							d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
-						/>
-					</svg>
-
-					Edit Your Website</Button
-				>
-			</div>
-		{/if}
-
-		{#if !env.PUBLIC_IS_SELFHOSTED && handle === 'blento.app' && client.profile?.handle !== handle}
-			{#if !client.isInitializing && !client.isLoggedIn}
-				<div>
-					<div class="my-4 text-sm">
-						To create your own blento, sign in with your bluesky account
-					</div>
-					<BlueskyLogin
-						login={async (handle) => {
-							await login(handle);
-							return true;
-						}}
-					/>
-				</div>
-			{:else if client.isLoggedIn}
-				<div>
-					<Button href={'/' + client.profile?.handle} class="mt-2">
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							fill="none"
-							viewBox="0 0 24 24"
-							stroke-width="1.5"
-							stroke="currentColor"
-						>
-							<path
-								stroke-linecap="round"
-								stroke-linejoin="round"
-								d="m4.5 19.5 15-15m0 0H8.25m11.25 0v11.25"
-							/>
-						</svg>
-
-						Open Your Blento</Button
-					>
-				</div>
-			{/if}
-		{/if}
-		<div class="hidden text-xs font-light @5xl/wrapper:block">
-			made with <a
-				href="https://blento.app"
-				target="_blank"
-				class="hover:text-accent-600 dark:hover:text-accent-400 font-medium transition-colors duration-200"
-				>blento</a
-			>
-		</div>
-	</div>
-</div>
-
-<style>
-	.scrollbar::-webkit-scrollbar-track {
-		background-color: transparent;
-	}
-
-	@supports (scrollbar-width: auto) {
-		.scrollbar {
-			scrollbar-color: var(--color-base-400) transparent;
-			scrollbar-width: thin;
-		}
-
-		:global(.dark .scrollbar) {
-			scrollbar-color: var(--color-base-800) transparent;
-		}
-	}
-
-	@supports not (scrollbar-width: auto) {
-		:global(.scrollbar::-webkit-scrollbar) {
-			width: 14px;
-			height: 14px;
-		}
-	}
-
-	.scrollbar::-webkit-scrollbar-thumb {
-		background-color: var(--color-base-400);
-		border-radius: 20px;
-		border: 4px solid transparent;
-		background-clip: content-box;
-	}
-
-	.scrollbar::-webkit-scrollbar-thumb:hover {
-		background-color: var(--color-base-500);
-	}
-
-	/* Dark mode rules */
-	:global(.dark .scrollbar::-webkit-scrollbar-thumb) {
-		background-color: var(--color-base-800);
-	}
-
-	:global(.dark .scrollbar::-webkit-scrollbar-thumb:hover) {
-		background-color: var(--color-base-700);
-	}
-</style>

src/lib/Settings.svelte

···
-<script lang="ts">
-	import { Modal } from '@foxui/core';
-
-	export type Settings = {
-		title: string;
-	};
-
-	let { open = $bindable(), settings }: { open: boolean; settings: Settings } = $props();
-</script>
-
-<Modal bind:open>Settings</Modal>

src/lib/Website.svelte

···
-<script lang="ts">
-	import Card from './cards/Card/Card.svelte';
-	import Profile from './Profile.svelte';
-	import { setIsMobile, sortItems } from './helper';
-	import type { Item } from './types';
-	import { innerWidth } from 'svelte/reactivity/window';
-	import { setDidContext, setHandleContext } from './website/context';
-	import BaseCard from './cards/BaseCard/BaseCard.svelte';
-	import { onMount } from 'svelte';
-	import { describeRepo } from './oauth/atproto';
-
-	let { handle, did, items, data }: { handle: string; did: string; items: Item[]; data: any } =
-		$props();
-
-	let isMobile = $derived((innerWidth.current ?? 1000) < 1024);
-
-	setIsMobile(() => isMobile);
-
-	// svelte-ignore state_referenced_locally
-	setDidContext(did);
-	// svelte-ignore state_referenced_locally
-	setHandleContext(handle);
-
-
-	let maxHeight = $derived(
-		items.reduce(
-			(max, item) => Math.max(max, isMobile ? item.mobileY + item.mobileH : item.y + item.h),
-			0
-		)
-	);
-
-	let container: HTMLDivElement | undefined = $state();
-
-	onMount(() => {
-		describeRepo({did});
-	});
-</script>
-
-<div class="@container/wrapper relative w-full">
-	<Profile {handle} {did} {data} showEditButton={true} />
-
-	<div class="mx-auto max-w-lg lg:grid lg:max-w-none lg:grid-cols-4">
-		<div></div>
-		<div
-			bind:this={container}
-			class="@container/grid relative col-span-3 px-2 py-8 lg:px-8"
-		>
-			{#each items.toSorted(sortItems) as item}
-				<BaseCard {item}>
-					<Card {item} />
-				</BaseCard>
-			{/each}
-			<div style="height: {(maxHeight / 8) * 100}cqw;"></div>
-		</div>
-	</div>
-
-	<div class="mx-auto block pb-8 text-center text-xs font-light @5xl/wrapper:hidden">
-		made with <a
-			href="https://blento.app"
-			target="_blank"
-			class="hover:text-accent-600 dark:hover:text-accent-400 font-medium transition-colors duration-200"
-			>blento</a
-		>
-	</div>
-</div>

src/lib/cards/ATProtoCollectionsCard/ATProtoCollectionsCard.svelte

···
 <script lang="ts">
-	import { getAdditionalUserData } from '$lib/helper';
 	import { onMount } from 'svelte';
 	import type { ContentComponentProps } from '../types';
 	import { CardDefinitionsByType } from '..';
-	import { getDidContext, getHandleContext } from '$lib/website/context';
+	import { getAdditionalUserData, getDidContext, getHandleContext } from '$lib/website/context';
 	import { Badge, Button } from '@foxui/core';
 
 	let { item }: ContentComponentProps = $props();

src/lib/cards/BaseCard/BaseEditingCard.svelte

···
 	import BaseCard from './BaseCard.svelte';
 	import type { Item } from '$lib/types';
 	import { Button, Popover } from '@foxui/core';
-	import { getCanEdit, getIsMobile } from '$lib/helper';
 	import { ColorSelect } from '@foxui/colors';
 	import { CardDefinitionsByType, getColor } from '..';
 	import { COLUMNS } from '$lib';
+	import { getCanEdit, getIsMobile } from '$lib/website/context';
 
 	let colorsChoices = [
 		{ class: 'text-base-500', label: 'base' },

src/lib/cards/BlueskyMediaCard/BlueskyMediaCard.svelte

···
 <script lang="ts">
 	import { getDidContext } from '$lib/website/context';
-	import { getImageBlobUrl } from '$lib/website/utils';
+	import { getImageBlobUrl } from '$lib/oauth/utils';
 	import type { ContentComponentProps } from '../types';
 	import Video from './Video.svelte';
 
···
 		}
 		return item.cardData.image;
 	}
-
-	$inspect(item.cardData);
 </script>
 
 {#if item.cardData.image}

src/lib/cards/BlueskyMediaCard/CreateBlueskyMediaCardModal.svelte

···
 	import { onMount } from 'svelte';
 	import { AtpBaseClient } from '@atproto/api';
 	import { getDidContext } from '$lib/website/context';
-	import { getImageBlobUrl } from '$lib/website/utils';
 
 	let { item = $bindable(), oncreate, oncancel }: CreationModalComponentProps = $props();
 

src/lib/cards/BlueskyPostCard/BlueskyPostCard.svelte

···
 <script lang="ts">
-	import { getAdditionalUserData } from '$lib/helper';
 	import type { Item } from '$lib/types';
 	import { onMount } from 'svelte';
 	import { BlueskyPost } from '../../components/bluesky-post';
-	import { getDidContext, getHandleContext } from '$lib/website/context';
+	import { getAdditionalUserData, getDidContext, getHandleContext } from '$lib/website/context';
 	import { CardDefinitionsByType } from '..';
 
 	let { item }: { item: Item } = $props();

src/lib/cards/GameCards/DinoGameCard/DinoGameCard.svelte

···
 <script lang="ts">
+	import { isTyping } from '$lib/helper';
 	import type { ContentComponentProps } from '../../types';
 	import { onMount, onDestroy } from 'svelte';
 
···
 	}
 
 	function handleKeyDown(e: KeyboardEvent) {
+		if(isTyping()) return;
+
 		if (e.code === 'Space' || e.code === 'ArrowUp' || e.code === 'KeyW') {
 			e.preventDefault();
 			jump();

src/lib/cards/GameCards/DinoGameCard/index.ts

···
-import type { CardDefinition } from '../types';
+import type { CardDefinition } from '$lib/cards/types';
 import DinoGameCard from './DinoGameCard.svelte';
 import SidebarItemDinoGameCard from './SidebarItemDinoGameCard.svelte';
 

src/lib/cards/ImageCard/ImageCard.svelte

···
 <script lang="ts">
 	import { getDidContext } from '$lib/website/context';
-	import { getImageBlobUrl } from '$lib/website/utils';
+	import { getImageBlobUrl } from '$lib/oauth/utils';
 	import type { ContentComponentProps } from '../types';
 
 	let { item = $bindable(), ...rest }: ContentComponentProps = $props();

src/lib/cards/ImageCard/index.ts

···
-import { uploadBlob } from '$lib/website/utils';
+import { uploadBlob } from '$lib/oauth/utils';
 import type { CardDefinition } from '../types';
 import CreateImageCardModal from './CreateImageCardModal.svelte';
 import ImageCard from './ImageCard.svelte';

src/lib/cards/LinkCard/EditingLinkCard.svelte

···
 <script lang="ts">
 	import { browser } from '$app/environment';
-	import { getIsMobile } from '$lib/helper';
+	import { getIsMobile } from '$lib/website/context';
 	import type { ContentComponentProps } from '../types';
 	import PlainTextEditor from '../utils/PlainTextEditor.svelte';
 

src/lib/cards/LinkCard/LinkCard.svelte

···
 <script lang="ts">
 	import { browser } from '$app/environment';
-	import { getIsMobile } from '$lib/helper';
+	import { getIsMobile } from '$lib/website/context';
 	import type { ContentComponentProps } from '../types';
 
 	let { item }: ContentComponentProps = $props();

src/lib/cards/LivestreamCard/LivestreamCard.svelte

···
 <script lang="ts">
 	import { onMount } from 'svelte';
 	import Icon from './Icon.svelte';
-	import { getDidContext, getHandleContext } from '$lib/website/context';
-	import { listRecords } from '$lib/oauth/atproto';
-	import { getAdditionalUserData, getIsMobile } from '$lib/helper';
+	import { getAdditionalUserData, getDidContext, getHandleContext, getIsMobile } from '$lib/website/context';
 	import type { ContentComponentProps } from '../types';
-	import { getImageBlobUrl } from '$lib/website/utils';
 	import { RelativeTime } from '@foxui/time';
-	import { online } from 'svelte/reactivity/window';
 	import { Badge } from '@foxui/core';
 	import { CardDefinitionsByType } from '..';
+	import { browser } from '$app/environment';
 
 	let { item = $bindable() }: ContentComponentProps = $props();
 
···
 				</a>
 			</div>
 
-			{#if ((isMobile() && item.mobileH >= 4) || (!isMobile() && item.h >= 2)) && latestLivestream?.thumb}
+			{#if browser && ((isMobile() && item.mobileH >= 7) || (!isMobile() && item.h >= 4)) && latestLivestream?.thumb}
 				<a href={latestLivestream?.href} target="_blank" rel="noopener noreferrer">
 					<img
 						class="my-4 max-h-32 w-full rounded-xl object-cover"

src/lib/cards/LivestreamCard/index.ts

···
 import { client } from '$lib/oauth';
 import { listRecords } from '$lib/oauth/atproto';
-import { getImageBlobUrl } from '$lib/website/utils';
+import { getImageBlobUrl } from '$lib/oauth/utils';
 import EmbedCard from '../EmbedCard/EmbedCard.svelte';
 import type { CardDefinition } from '../types';
 import LivestreamCard from './LivestreamCard.svelte';

src/lib/cards/SpecialCards/UpdatedBlentos/UpdatedBlentosCard.svelte

···
 <script lang="ts">
 	import type { ContentComponentProps } from '$lib/cards/types';
-	import { getAdditionalUserData } from '$lib/helper';
-	import { getProfile } from '$lib/oauth/atproto';
+	import { getAdditionalUserData } from '$lib/website/context';
 	import type { ProfileViewDetailed } from '@atproto/api/dist/client/types/app/bsky/actor/defs';
 	import { onMount } from 'svelte';
 

src/lib/helper.ts

···
-import { createContext } from 'svelte';
-import type { Item } from './types';
+import type { Item, WebsiteData } from './types';
 import { COLUMNS } from '$lib';
 
 export function clamp(value: number, min: number, max: number): number {
···
 		a.y === b.y &&
 		a.mobileX === b.mobileX &&
 		a.mobileY === b.mobileY &&
-		a.color === b.color
+		a.color === b.color &&
+		a.page === b.page
 	);
 }
 
···
 	}
 }
 
-export const [getIsMobile, setIsMobile] = createContext<() => boolean>();
-
-export const [getCanEdit, setCanEdit] = createContext<() => boolean>();
-
-export const [getAdditionalUserData, setAdditionalUserData] =
-	createContext<Record<string, unknown>>();
-
 export async function refreshData(data: { updatedAt?: number; handle: string }) {
 	const FIVE_MINUTES = 5 * 60 * 1000;
 	const now = Date.now();
···
 		console.log('data still fresh, skipping refreshing', data.handle);
 	}
 }
+
+export function getName(data: WebsiteData): string {
+	return (data.publication?.name ?? data.profile.displayName) || data.handle;
+}
+
+export function getDescription(data: WebsiteData): string {
+	return data.publication?.description ?? data.profile.description ?? '';
+}
+
+export function getHideProfile(data: WebsiteData): boolean {
+	if (data?.publication?.preferences?.hideProfile === false) return false;
+	if (data?.publication?.preferences?.hideProfile === true) return true;
+
+	return data.page !== 'blento.self';
+}
+
+export function isTyping() {
+	const active = document.activeElement;
+
+	const isEditable =
+		active instanceof HTMLInputElement ||
+		active instanceof HTMLTextAreaElement ||
+		// @ts-expect-error this fine
+		active?.isContentEditable;
+
+	return isEditable;
+}

src/lib/oauth/atproto.ts

···
 import { AtpBaseClient } from '@atproto/api';
 import { client } from './auth.svelte';
+import type { Record as ListRecord } from '@atproto/api/dist/client/types/com/atproto/repo/listRecords';
+import type { At } from '@atcute/client/lexicons';
 
 export async function resolveHandle({ handle }: { handle: string }) {
 	const agent = new AtpBaseClient({ service: 'https://api.bsky.app' });
···
 	did,
 	collection,
 	cursor,
-	limit = 100
+	limit = 0
 }: {
 	did: string;
 	collection: string;
···
 
 	const agent = new AtpBaseClient({ service: pds });
 
-	const room = await agent.com.atproto.repo.listRecords({
-		repo: did,
-		collection,
-		limit,
-		cursor
-	});
+	const allRecords = [];
 
-	// convert to { [rkey]: record }
-	const records = room.data.records.reduce(
-		(acc, record) => {
-			acc[parseUri(record.uri).rkey] = record;
-			return acc;
-		},
-		{} as Record<string, ListRecord>
-	);
+	let currentCursor = cursor;
+	do {
+		const response = await agent.com.atproto.repo.listRecords({
+			repo: did,
+			collection,
+			limit: limit || 100,
+			cursor: currentCursor
+		});
+		allRecords.push(...response.data.records);
+		currentCursor = response.data.cursor;
+	} while (currentCursor && (!limit || allRecords.length < limit));
 
-	return records;
+	return allRecords;
 }
-
-import type { Record as ListRecord } from '@atproto/api/dist/client/types/com/atproto/repo/listRecords';
-import { parseUri } from '$lib/website/utils';
 
 export async function getRecord({
 	did,
···
 	const response = await client.rpc.call('com.atproto.repo.putRecord', {
 		data: {
 			collection,
-			repo: client.profile.did,
+			repo: client.profile.did as At.Identifier,
 			rkey,
 			record: {
 				...record
···
 	const response = await client.rpc.call('com.atproto.repo.deleteRecord', {
 		data: {
 			collection,
-			repo: did,
+			repo: did as At.Identifier,
 			rkey
 		}
 	});
···
 	});
 
 	return repo;
-}
+}

src/lib/types.ts

···
+import type { At } from '@atcute/client/lexicons';
+import type { ProfileViewDetailed } from '@atproto/api/dist/client/types/app/bsky/actor/defs';
+
 export type Item = {
 	id: string;
 
···
 	updatedAt?: string;
 
 	version?: number;
+
+	page?: string;
+};
+
+export type WebsiteData = {
+	page: string;
+	did: string;
+	handle: string;
+
+	cards: Item[];
+	publication:
+		| {
+				url?: string;
+				name?: string;
+				description?: string;
+				icon?: At.Blob;
+				preferences?: {
+					hideProfile?: boolean;
+				};
+		  }
+		| undefined;
+	profile: ProfileViewDetailed;
+
+	additionalData: Record<string, unknown>;
+	updatedAt: number;
+	version?: number;
+};
+
+export type UserCache = {
+	get: (key: string) => string;
+	put: (key: string, value: string) => void;
 };

src/lib/website/Context.svelte

···
+<script lang="ts">
+	import type { WebsiteData } from '$lib/types';
+	import type { Snippet } from 'svelte';
+	import { setAdditionalUserData, setCanEdit, setDidContext, setHandleContext } from './context';
+	import { dev } from '$app/environment';
+	import { client } from '$lib/oauth';
+
+	let {
+		data,
+		children
+	}: {
+		data: WebsiteData;
+		children: Snippet<[]>;
+	} = $props();
+
+	// svelte-ignore state_referenced_locally
+	setAdditionalUserData(data.additionalData);
+
+	setCanEdit(() => dev || (client.isLoggedIn && client.profile?.did === data.did));
+
+	// svelte-ignore state_referenced_locally
+	setDidContext(data.did);
+	// svelte-ignore state_referenced_locally
+	setHandleContext(data.handle);
+</script>
+
+{@render children()}

src/lib/website/EditableWebsite.svelte

···
+<script lang="ts">
+	import { client, login } from '$lib/oauth/auth.svelte.js';
+
+	import { Navbar, Button, toast, Toaster, Toggle, Sidebar } from '@foxui/core';
+	import { BlueskyLogin } from '@foxui/social';
+
+	import { COLUMNS, margin, mobileMargin } from '$lib';
+	import {
+		cardsEqual,
+		clamp,
+		compactItems,
+		fixCollisions,
+		getDescription,
+		getHideProfile,
+		getName,
+		isTyping,
+		setPositionOfNewItem
+	} from '../helper';
+	import Profile from './Profile.svelte';
+	import type { Item, WebsiteData } from '../types';
+	import { deleteRecord, putRecord } from '../oauth/atproto';
+	import { innerWidth } from 'svelte/reactivity/window';
+	import { TID } from '@atproto/common-web';
+	import EditingCard from '../cards/Card/EditingCard.svelte';
+	import { AllCardDefinitions, CardDefinitionsByType } from '../cards';
+	import { tick, type Component } from 'svelte';
+	import type { CreationModalComponentProps } from '../cards/types';
+	import { dev } from '$app/environment';
+	import { setIsMobile } from './context';
+	import BaseEditingCard from '../cards/BaseCard/BaseEditingCard.svelte';
+	import Context from './Context.svelte';
+	import Settings from './Settings.svelte';
+	import Head from './Head.svelte';
+
+	let {
+		data
+	}: {
+		data: WebsiteData;
+	} = $props();
+
+	// svelte-ignore state_referenced_locally
+	let items: Item[] = $state(data.cards);
+
+	// svelte-ignore state_referenced_locally
+	let publication = $state(JSON.stringify(data.publication));
+
+	let container: HTMLDivElement | undefined = $state();
+
+	let activeDragElement: {
+		element: HTMLDivElement | null;
+		item: Item | null;
+		w: number;
+		h: number;
+		x: number;
+		y: number;
+		mouseDeltaX: number;
+		mouseDeltaY: number;
+	} = $state({
+		element: null,
+		item: null,
+		w: 0,
+		h: 0,
+		x: -1,
+		y: -1,
+		mouseDeltaX: 0,
+		mouseDeltaY: 0
+	});
+
+	let showingMobileView = $state(false);
+	let isMobile = $derived(showingMobileView || (innerWidth.current ?? 1000) < 1024);
+
+	setIsMobile(() => isMobile);
+
+	const getY = (item: Item) => (isMobile ? (item.mobileY ?? item.y) : item.y);
+	const getH = (item: Item) => (isMobile ? (item.mobileH ?? item.h) : item.h);
+
+	let maxHeight = $derived(items.reduce((max, item) => Math.max(max, getY(item) + getH(item)), 0));
+
+	function newCard(type: string = 'link') {
+		// close sidebar if open
+		const popover = document.getElementById('mobile-menu');
+		if (popover) {
+			popover.hidePopover();
+		}
+
+		let item: Item = {
+			id: TID.nextStr(),
+			x: 0,
+			y: 0,
+			w: 2,
+			h: 2,
+			mobileH: 4,
+			mobileW: 4,
+			mobileX: 0,
+			mobileY: 0,
+			cardType: type,
+			cardData: {},
+			version: 2,
+			page: data.page
+		};
+		const cardDef = CardDefinitionsByType[type];
+		cardDef?.createNew?.(item);
+
+		newItem.item = item;
+
+		if (cardDef?.creationModalComponent) {
+			newItem.modal = cardDef.creationModalComponent;
+		} else {
+			saveNewItem();
+		}
+	}
+
+	async function saveNewItem() {
+		if (!newItem.item) return;
+		const item = newItem.item;
+
+		setPositionOfNewItem(item, items);
+
+		items = [...items, item];
+
+		const containerRect = container?.getBoundingClientRect();
+
+		newItem = {};
+
+		await tick();
+
+		// scroll to newly created card
+		if (!containerRect) return;
+		const currentMargin = isMobile ? mobileMargin : margin;
+		const currentY = isMobile ? item.mobileY : item.y;
+		const bodyRect = document.body.getBoundingClientRect();
+		const offset = containerRect.top - bodyRect.top;
+		const cellSize = (containerRect.width - currentMargin * 2) / COLUMNS;
+		window.scrollTo({ top: offset + cellSize * (currentY - 1), behavior: 'smooth' });
+	}
+
+	let isSaving = $state(false);
+
+	let newItem: { modal?: Component<CreationModalComponentProps>; item?: Item } = $state({});
+
+	async function save() {
+		isSaving = true;
+
+		const promises = [];
+		// find all cards that have been updated (where items differ from originalItems)
+		for (let item of items) {
+			const originalItem = data.cards.find((i) => cardsEqual(i, item));
+
+			if (!originalItem) {
+				console.log('updated or new item', item);
+				item.updatedAt = new Date().toISOString();
+				// run optional upload function for this card type
+				const cardDef = CardDefinitionsByType[item.cardType];
+
+				if (cardDef?.upload) {
+					item = await cardDef?.upload(item);
+				}
+
+				item.page = data.page;
+				item.version = 2;
+
+				promises.push(
+					putRecord({
+						collection: 'app.blento.card',
+						rkey: item.id,
+						record: item
+					})
+				);
+			}
+		}
+
+		// delete items that are in originalItems but not in items
+		for (let originalItem of data.cards) {
+			const item = items.find((i) => i.id === originalItem.id);
+			if (!item) {
+				console.log('deleting item', originalItem);
+				promises.push(
+					deleteRecord({ collection: 'app.blento.card', rkey: originalItem.id, did: data.did })
+				);
+			}
+		}
+
+		console.log(publication, data.publication);
+		if (!publication || publication !== JSON.stringify(data.publication)) {
+			data.publication ??= {
+				name: getName(data),
+				description: getDescription(data),
+				preferences: {
+					hideProfile: getHideProfile(data)
+				}
+			};
+
+			if (!data.publication.url) {
+				data.publication.url = 'https://blento.app/' + data.handle;
+
+				if (data.page !== 'blento.self') {
+					data.publication.url += '/' + data.page.replace('blento.', '');
+				}
+			}
+			promises.push(
+				putRecord({
+					collection: 'site.standard.publication',
+					rkey: data.page,
+					record: data.publication
+				})
+			);
+
+			publication = JSON.stringify(data.publication);
+
+			console.log('updating or adding publication', data.publication);
+		}
+
+		await Promise.all(promises);
+
+		isSaving = false;
+
+		fetch('/' + data.handle + '/api/refreshData').then(() => {
+			console.log('data refreshed!');
+		});
+		console.log('refreshing data');
+
+		toast('Saved', {
+			description: 'Your website has been saved!'
+		});
+	}
+
+	const sidebarItems = AllCardDefinitions.filter(
+		(cardDef) => cardDef.sidebarComponent || cardDef.sidebarButtonText
+	);
+
+	let showSettings = $state(false);
+
+	let debugPoint = $state({ x: 0, y: 0 });
+
+	function getDragXY(
+		e: DragEvent & {
+			currentTarget: EventTarget & HTMLDivElement;
+		}
+	) {
+		if (!container) return;
+
+		const x = e.clientX + activeDragElement.mouseDeltaX;
+		const y = e.clientY + activeDragElement.mouseDeltaY;
+
+		const rect = container.getBoundingClientRect();
+
+		debugPoint.x = x - rect.left;
+		debugPoint.y = y - rect.top + margin;
+		console.log(rect.top);
+
+		let gridX = clamp(
+			Math.floor(((x - rect.left) / rect.width) * 8),
+			0,
+			COLUMNS - (activeDragElement.w ?? 0)
+		);
+		gridX = Math.floor(gridX / 2) * 2;
+		let gridY = Math.max(
+			Math.round(((y - rect.top + margin) / (rect.width - margin)) * COLUMNS),
+			0
+		);
+		if (isMobile) {
+			gridX = Math.floor(gridX / 2) * 2;
+			gridY = Math.floor(gridY / 2) * 2;
+		}
+		return { x: gridX, y: gridY };
+	}
+</script>
+
+<svelte:body
+	onpaste={(event) => {
+		if (isTyping()) return;
+
+		const text = event.clipboardData?.getData('text/plain');
+
+		if (!text) return;
+
+		try {
+			const url = new URL(text);
+
+			let item: Item = {
+				id: TID.nextStr(),
+				x: 0,
+				y: 0,
+				w: 2,
+				h: 2,
+				mobileH: 4,
+				mobileW: 4,
+				mobileX: 0,
+				mobileY: 0,
+				cardType: '',
+				cardData: {}
+			};
+
+			newItem.item = item;
+
+			for (const cardDef of AllCardDefinitions) {
+				if (cardDef.onUrlHandler?.(text, item)) {
+					item.cardType = cardDef.type;
+					saveNewItem();
+					return;
+				}
+			}
+
+			newItem = {};
+		} catch (e) {
+			return;
+		}
+	}}
+/>
+
+<Head
+	favicon={data.profile.avatar ?? null}
+	title={getName(data)}
+	image={'/' + data.handle + '/og.png'}
+/>
+
+<Settings bind:open={showSettings} bind:data />
+
+<Context {data}>
+	<!-- <ImageDropper processImageFile={(file: File) => {}} /> -->
+
+	{#if !dev}
+		<div
+			class="bg-base-200 dark:bg-base-800 fixed inset-0 z-50 inline-flex h-full w-full items-center justify-center p-4 text-center lg:hidden"
+		>
+			Editing on mobile is not supported yet. Please use a desktop browser.
+		</div>
+	{/if}
+
+	{#if showingMobileView}
+		<div
+			class="bg-base-200 dark:bg-base-900 pointer-events-none fixed inset-0 -z-10 h-full w-full"
+		></div>
+	{/if}
+
+	{#if newItem.modal && newItem.item}
+		<newItem.modal
+			oncreate={() => {
+				saveNewItem();
+			}}
+			bind:item={newItem.item}
+			oncancel={() => {
+				newItem = {};
+			}}
+		/>
+	{/if}
+
+	<div
+		class={[
+			'@container/wrapper relative w-full',
+			showingMobileView
+				? 'bg-base-50 dark:bg-base-950 my-4 min-h-[calc(100dhv-2em)] rounded-2xl lg:mx-auto lg:w-[400px]'
+				: ''
+		]}
+	>
+		{#if !getHideProfile(data)}
+			<Profile {data} />
+		{/if}
+
+		<div
+			class={[
+				'mx-auto max-w-lg',
+				!getHideProfile(data)
+					? '@5xl/wrapper:grid @5xl/wrapper:max-w-7xl @5xl/wrapper:grid-cols-4'
+					: '@5xl/wrapper:max-w-4xl'
+			]}
+		>
+			<div></div>
+			<!-- svelte-ignore a11y_no_static_element_interactions -->
+			<div
+				bind:this={container}
+				ondragover={(e) => {
+					e.preventDefault();
+
+					const cell = getDragXY(e);
+					if (!cell) return;
+
+					activeDragElement.x = cell.x;
+					activeDragElement.y = cell.y;
+
+					if (activeDragElement.item) {
+						if (isMobile) {
+							activeDragElement.item.mobileX = cell.x;
+							activeDragElement.item.mobileY = cell.y;
+						} else {
+							activeDragElement.item.x = cell.x;
+							activeDragElement.item.y = cell.y;
+						}
+
+						fixCollisions(items, activeDragElement.item, isMobile);
+					}
+
+					// Auto-scroll when dragging near top or bottom of viewport
+					const scrollZone = 100;
+					const scrollSpeed = 10;
+					const viewportHeight = window.innerHeight;
+
+					if (e.clientY < scrollZone) {
+						// Near top - scroll up
+						const intensity = 1 - e.clientY / scrollZone;
+						window.scrollBy(0, -scrollSpeed * intensity);
+					} else if (e.clientY > viewportHeight - scrollZone) {
+						// Near bottom - scroll down
+						const intensity = 1 - (viewportHeight - e.clientY) / scrollZone;
+						window.scrollBy(0, scrollSpeed * intensity);
+					}
+				}}
+				ondragend={async (e) => {
+					e.preventDefault();
+					const cell = getDragXY(e);
+					if (!cell) return;
+
+					if (activeDragElement.item) {
+						if (isMobile) {
+							activeDragElement.item.mobileX = cell.x;
+							activeDragElement.item.mobileY = cell.y;
+						} else {
+							activeDragElement.item.x = cell.x;
+							activeDragElement.item.y = cell.y;
+						}
+
+						fixCollisions(items, activeDragElement.item, isMobile);
+					}
+					activeDragElement.x = -1;
+					activeDragElement.y = -1;
+					activeDragElement.element = null;
+					return true;
+				}}
+				class="@container/grid relative col-span-3 px-2 py-8 @5xl/wrapper:px-8"
+			>
+				{#each items as item, i (item.id)}
+					<!-- {#if item !== activeDragElement.item} -->
+					<BaseEditingCard
+						bind:item={items[i]}
+						ondelete={() => {
+							items = items.filter((it) => it !== item);
+							compactItems(items, isMobile);
+						}}
+						onsetsize={(newW: number, newH: number) => {
+							if (isMobile) {
+								item.mobileW = newW;
+								item.mobileH = newH;
+							} else {
+								item.w = newW;
+								item.h = newH;
+							}
+
+							fixCollisions(items, item, isMobile);
+						}}
+						ondragstart={(e) => {
+							const target = e.currentTarget as HTMLDivElement;
+							activeDragElement.element = target;
+							activeDragElement.w = item.w;
+							activeDragElement.h = item.h;
+							activeDragElement.item = item;
+
+							const rect = target.getBoundingClientRect();
+							activeDragElement.mouseDeltaX = rect.left - e.clientX;
+							activeDragElement.mouseDeltaY = rect.top - e.clientY;
+							console.log(activeDragElement.mouseDeltaY);
+							console.log(rect.width);
+						}}
+					>
+						<EditingCard bind:item={items[i]} />
+					</BaseEditingCard>
+					<!-- {/if} -->
+				{/each}
+
+				<div style="height: {((maxHeight + 2) / 8) * 100}cqw;"></div>
+			</div>
+		</div>
+	</div>
+
+	<!-- <Settings bind:open={showSettings} /> -->
+
+	<Sidebar mobileOnly mobileClasses="lg:block p-4 gap-4">
+		<div class="flex flex-col gap-2">
+			{#each sidebarItems as cardDef}
+				{#if cardDef.sidebarComponent}
+					<cardDef.sidebarComponent onclick={() => newCard(cardDef.type)} />
+				{:else if cardDef.sidebarButtonText}
+					<Button onclick={() => newCard(cardDef.type)} variant="ghost" class="w-full justify-start"
+						>{cardDef.sidebarButtonText}</Button
+					>
+				{/if}
+			{/each}
+		</div>
+	</Sidebar>
+
+	{#if dev || (!client.isLoggedIn && !client.isInitializing) || client.profile?.did === data.did}
+		<Navbar
+			class={[
+				'dark:bg-base-900 bg-base-100 top-auto bottom-2 mx-4 mt-3 max-w-3xl rounded-full px-4 md:mx-auto lg:inline-flex',
+				!dev ? 'hidden' : ''
+			]}
+		>
+			<div class="flex items-center gap-2">
+				{#if dev}
+					<Button
+						size="iconLg"
+						variant="ghost"
+						class="mr-4 backdrop-blur-none"
+						onclick={() => {
+							showSettings = true;
+						}}
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							fill="none"
+							viewBox="0 0 24 24"
+							stroke-width="1.5"
+							stroke="currentColor"
+						>
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
+							/>
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
+							/>
+						</svg>
+					</Button>
+				{/if}
+
+				<Button
+					size="iconLg"
+					variant="ghost"
+					class="backdrop-blur-none"
+					onclick={() => {
+						newCard('text');
+					}}
+				>
+					<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
+						><path
+							fill="none"
+							stroke="currentColor"
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							stroke-width="1.5"
+							d="m15 16l2.536-7.328a1.02 1.02 1 0 1 1.928 0L22 16m-6.303-2h5.606M2 16l4.039-9.69a.5.5 0 0 1 .923 0L11 16m-7.696-3h6.392"
+						/></svg
+					>
+				</Button>
+				<Button
+					size="iconLg"
+					variant="ghost"
+					class="backdrop-blur-none"
+					onclick={() => {
+						newCard('link');
+					}}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						viewBox="-2 -2 28 28"
+						stroke-width="1.5"
+						stroke="currentColor"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							d="M13.19 8.688a4.5 4.5 0 0 1 1.242 7.244l-4.5 4.5a4.5 4.5 0 0 1-6.364-6.364l1.757-1.757m13.35-.622 1.757-1.757a4.5 4.5 0 0 0-6.364-6.364l-4.5 4.5a4.5 4.5 0 0 0 1.242 7.244"
+						/>
+					</svg>
+				</Button>
+
+				<Button
+					size="iconLg"
+					variant="ghost"
+					class="backdrop-blur-none"
+					onclick={() => {
+						newCard('image');
+					}}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							d="m2.25 15.75 5.159-5.159a2.25 2.25 0 0 1 3.182 0l5.159 5.159m-1.5-1.5 1.409-1.409a2.25 2.25 0 0 1 3.182 0l2.909 2.909m-18 3.75h16.5a1.5 1.5 0 0 0 1.5-1.5V6a1.5 1.5 0 0 0-1.5-1.5H3.75A1.5 1.5 0 0 0 2.25 6v12a1.5 1.5 0 0 0 1.5 1.5Zm10.5-11.25h.008v.008h-.008V8.25Zm.375 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Z"
+						/>
+					</svg>
+				</Button>
+
+				<Button
+					size="iconLg"
+					variant="ghost"
+					class="backdrop-blur-none"
+					popovertarget="mobile-menu"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+					>
+						<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+					</svg>
+				</Button>
+			</div>
+			<div class="flex items-center gap-2">
+				<Toggle
+					class="hidden bg-transparent backdrop-blur-none lg:block dark:bg-transparent"
+					bind:pressed={showingMobileView}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						class="size-6"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							d="M10.5 1.5H8.25A2.25 2.25 0 0 0 6 3.75v16.5a2.25 2.25 0 0 0 2.25 2.25h7.5A2.25 2.25 0 0 0 18 20.25V3.75a2.25 2.25 0 0 0-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"
+						/>
+					</svg>
+				</Toggle>
+				{#if client.isLoggedIn}
+					<Button
+						disabled={isSaving}
+						onclick={async () => {
+							save();
+						}}>{isSaving ? 'Saving...' : 'Save'}</Button
+					>
+				{:else}
+					<BlueskyLogin
+						login={async (handle) => {
+							await login(handle);
+							return true;
+						}}
+					/>
+				{/if}
+			</div>
+		</Navbar>
+	{/if}
+
+	<Toaster />
+</Context>

src/lib/website/Head.svelte

···
+<script lang="ts">
+	let {
+		favicon,
+		title,
+		image,
+		description
+	}: { favicon: string | null; title: string | null; image?: string; description?: string } =
+		$props();
+</script>
+
+<svelte:head>
+	{#if favicon}
+		<link rel="icon" href={favicon} />
+	{/if}
+
+	{#if title}
+		<title>{title}</title>
+	{/if}
+
+	{#if image}
+		<meta property="og:image" content={image} />
+		<meta name="twitter:image" content={image} />
+		<meta name="twitter:card" content="summary_large_image" />
+	{/if}
+
+	{#if description}
+		<meta name="description" content={description} />
+		<meta property="og:description" content={description} />
+		<meta name="twitter:description" content={description} />
+	{/if}
+</svelte:head>

src/lib/website/Profile.svelte

···
+<script lang="ts">
+	import { marked } from 'marked';
+	import { client, login } from '../oauth';
+	import { Button } from '@foxui/core';
+	import { BlueskyLogin } from '@foxui/social';
+	import { env } from '$env/dynamic/public';
+	import type { WebsiteData } from '$lib/types';
+	import { getDescription, getName } from '$lib/helper';
+
+	let {
+		data,
+		showEditButton = false
+	}: {
+		data: WebsiteData;
+		showEditButton?: boolean;
+	} = $props();
+
+	const renderer = new marked.Renderer();
+	renderer.link = ({ href, title, text }) =>
+		`<a target="_blank" href="${href}" title="${title}">${text}</a>`;
+</script>
+
+<!-- lg:fixed lg:h-screen lg:w-1/4 lg:max-w-none lg:px-12 lg:pt-24 xl:w-1/3 -->
+<div
+	class="mx-auto flex max-w-lg flex-col justify-between px-8 @5xl/wrapper:fixed @5xl/wrapper:h-screen @5xl/wrapper:w-1/4 @5xl/wrapper:max-w-none @5xl/wrapper:px-12"
+>
+	<div class="flex flex-col gap-4 pt-16 pb-8 @5xl/wrapper:h-screen @5xl/wrapper:pt-24">
+		{#if data.profile.avatar}
+			<img
+				class="border-base-400 dark:border-base-800 size-32 rounded-full border @5xl/wrapper:size-44"
+				src={data.profile.avatar}
+				alt=""
+			/>
+		{:else}
+			<div class="bg-base-300 dark:bg-base-700 size-32 rounded-full @5xl/wrapper:size-44"></div>
+		{/if}
+
+		<div class="text-4xl font-bold wrap-anywhere">
+			{getName(data)}
+		</div>
+
+		<div class="scrollbar -mx-4 flex-grow overflow-x-hidden overflow-y-scroll px-4">
+			<div
+				class="text-base-600 dark:text-base-400 prose dark:prose-invert prose-a:text-accent-500 prose-a:no-underline"
+			>
+				{@html marked.parse(getDescription(data), {
+					renderer
+				})}
+			</div>
+		</div>
+
+		{#if showEditButton && client.isLoggedIn && client.profile?.did === data.did}
+			<div>
+				<Button href="{env.PUBLIC_IS_SELFHOSTED ? '' : client.profile?.handle}/edit" class="mt-2">
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
+						/>
+					</svg>
+
+					Edit Your Website</Button
+				>
+			</div>
+			{:else}
+			<div class="h-[42px] w-1 @5xl/wrapper:hidden"></div>
+		{/if}
+
+		{#if !env.PUBLIC_IS_SELFHOSTED && data.handle === 'blento.app' && client.profile?.handle !== data.handle}
+			{#if !client.isInitializing && !client.isLoggedIn}
+				<div>
+					<div class="my-4 text-sm">
+						To create your own blento, sign in with your bluesky account
+					</div>
+					<BlueskyLogin
+						login={async (handle) => {
+							await login(handle);
+							return true;
+						}}
+					/>
+				</div>
+			{:else if client.isLoggedIn}
+				<div>
+					<Button href={'/' + client.profile?.handle} class="mt-2">
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							fill="none"
+							viewBox="0 0 24 24"
+							stroke-width="1.5"
+							stroke="currentColor"
+						>
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								d="m4.5 19.5 15-15m0 0H8.25m11.25 0v11.25"
+							/>
+						</svg>
+
+						Open Your Blento</Button
+					>
+				</div>
+			{/if}
+		{/if}
+		<div class="hidden text-xs font-light @5xl/wrapper:block">
+			made with <a
+				href="https://blento.app"
+				target="_blank"
+				class="hover:text-accent-600 dark:hover:text-accent-400 font-medium transition-colors duration-200"
+				>blento</a
+			>
+		</div>
+	</div>
+</div>

src/lib/website/Settings.svelte

···
+<script lang="ts">
+	import { getDescription, getHideProfile, getName } from '$lib/helper';
+	import type { WebsiteData } from '$lib/types';
+	import { Button, Checkbox, Heading, Input, Label, Modal, Textarea } from '@foxui/core';
+
+	export type Settings = {
+		title: string;
+	};
+
+	let { open = $bindable(), data = $bindable() }: { open: boolean; data: WebsiteData } = $props();
+
+	let name = $state(getName(data));
+
+	$effect(() => {
+		if (!open && name && name !== getName(data)) {
+			data.publication ??= {};
+			data.publication.name = name;
+
+			data = { ...data };
+		}
+	});
+</script>
+
+<Modal bind:open class="dark:bg-base-900">
+	<Heading>Settings</Heading>
+	<Label>Name</Label>
+	<Input bind:value={name} />
+	<Label class="mt-4">Description</Label>
+	<Textarea
+		rows={5}
+		bind:value={
+			() => {
+				return getDescription(data);
+			},
+			(value) => {
+				data.publication ??= {};
+				data.publication.description = value;
+
+				data = { ...data };
+			}
+		}
+	/>
+
+	<div class="flex items-center space-x-2">
+		<Checkbox
+			bind:checked={
+				() => {
+					return getHideProfile(data);
+				},
+				(value) => {
+					data.publication ??= {};
+					data.publication.preferences ??= {};
+					data.publication.preferences.hideProfile = value;
+
+					data = { ...data };
+				}
+			}
+			id="hide-profile"
+			aria-labelledby="hide-profile-label"
+			variant="secondary"
+		/>
+		<Label
+			id="hide-profile-label"
+			for="hide-profile"
+			class="text-sm leading-none font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+		>
+			Hide Profile
+		</Label>
+	</div>
+
+	<div class="flex w-full justify-end space-x-2">
+		<Button onclick={() => (open = false)}>Close</Button>
+	</div>
+</Modal>

src/lib/website/Website.svelte

···
+<script lang="ts">
+	import Card from '../cards/Card/Card.svelte';
+	import Profile from './Profile.svelte';
+	import { getHideProfile, getName, sortItems } from '../helper';
+	import { innerWidth } from 'svelte/reactivity/window';
+	import { setDidContext, setHandleContext, setIsMobile } from './context';
+	import BaseCard from '../cards/BaseCard/BaseCard.svelte';
+	import type { WebsiteData } from '$lib/types';
+	import Context from './Context.svelte';
+	import Head from './Head.svelte';
+
+	let { data }: { data: WebsiteData } = $props();
+
+	let isMobile = $derived((innerWidth.current ?? 1000) < 1024);
+	setIsMobile(() => isMobile);
+
+	// svelte-ignore state_referenced_locally
+	setDidContext(data.did);
+	// svelte-ignore state_referenced_locally
+	setHandleContext(data.handle);
+
+	let maxHeight = $derived(
+		data.cards.reduce(
+			(max, item) => Math.max(max, isMobile ? item.mobileY + item.mobileH : item.y + item.h),
+			0
+		)
+	);
+
+	let container: HTMLDivElement | undefined = $state();
+</script>
+
+<Head
+	favicon={data.profile.avatar ?? null}
+	title={getName(data)}
+	image={'/' + data.handle + '/og.png'}
+/>
+
+<Context {data}>
+	<div class="@container/wrapper relative w-full">
+		{#if !getHideProfile(data)}
+			<Profile {data} showEditButton={true} />
+		{/if}
+
+		<div
+			class={[
+				'mx-auto max-w-lg',
+				!getHideProfile(data)
+					? '@5xl/wrapper:grid @5xl/wrapper:max-w-7xl @5xl/wrapper:grid-cols-4'
+					: '@5xl/wrapper:max-w-4xl'
+			]}
+		>
+			<div></div>
+			<div bind:this={container} class="@container/grid relative col-span-3 px-2 py-8 lg:px-8">
+				{#each data.cards.toSorted(sortItems) as item}
+					<BaseCard {item}>
+						<Card {item} />
+					</BaseCard>
+				{/each}
+				<div style="height: {(maxHeight / 8) * 100}cqw;"></div>
+			</div>
+		</div>
+
+		<div class="mx-auto block pb-8 text-center text-xs font-light @5xl/wrapper:hidden">
+			made with <a
+				href="https://blento.app"
+				target="_blank"
+				class="hover:text-accent-600 dark:hover:text-accent-400 font-medium transition-colors duration-200"
+				>blento</a
+			>
+		</div>
+	</div>
+</Context>

src/lib/website/context.ts

···
 import { createContext } from 'svelte';
-import type { DownloadedData } from './types';
-
-export type UpdateFunction = () => boolean | Promise<boolean>;
-
-export type UpdateRecordFunction = () => Record<string, unknown> | Promise<Record<string, unknown>>;
-
-export const [getUpdateFunctionsContext, setUpdateFunctionsContext] =
-	createContext<UpdateFunction[]>();
-export const [getUpdateRecordFunctionsContext, setUpdateRecordFunctionsContext] =
-	createContext<UpdateRecordFunction[]>();
 
 export const [getDidContext, setDidContext] = createContext<string>();
 export const [getHandleContext, setHandleContext] = createContext<string>();
-
-export const [getDataContext, setDataContext] = createContext<DownloadedData>();
-
-export const [isEditing, setIsEditing] = createContext<boolean>();
+export const [getIsMobile, setIsMobile] = createContext<() => boolean>();
+export const [getCanEdit, setCanEdit] = createContext<() => boolean>();
+export const [getAdditionalUserData, setAdditionalUserData] =
+	createContext<Record<string, unknown>>();

src/lib/website/data.ts

···
-export const image_collection = 'com.example.image' as const;
-
-// collections and records we want to grab
-export const data = {
-	'app.bsky.actor.profile': ['self'],
-
-	'app.blento.card': 'all',
-	'app.blento.settings': ['self']
-} as const;

src/lib/website/load.ts

···
-import {
-	type Collection,
-	type DownloadedData,
-	type IndividualCollections,
-	type ListCollections
-} from './types';
-import { getRecord, listRecords, resolveHandle } from '$lib/oauth/atproto';
+import { getProfile, listRecords, resolveHandle } from '$lib/oauth/atproto';
 import type { Record as ListRecord } from '@atproto/api/dist/client/types/com/atproto/repo/listRecords';
-import { data } from './data';
 import { CardDefinitionsByType } from '$lib/cards';
-import type { Item } from '$lib/types';
-import { compactItems, fixAllCollisions, fixCollisions } from '$lib/helper';
+import type { Item, UserCache, WebsiteData } from '$lib/types';
+import { compactItems, fixAllCollisions } from '$lib/helper';
+import { parseUri } from '$lib/oauth/utils';
+import { error } from '@sveltejs/kit';
 
-type LoadedData = {
-	did: string;
-	data: DownloadedData;
-	additionalData: Record<string, unknown>;
-	updatedAt: number;
-};
+const CURRENT_CACHE_VERSION = 1;
 
-export async function loadData(
-	handle: string,
-	platform?: App.Platform,
-	forceUpdate: boolean = false
-): Promise<LoadedData> {
-	console.log(handle);
-	if (!forceUpdate) {
-		try {
-			const cachedResult = await platform?.env?.USER_DATA_CACHE?.get(handle);
+export async function getCache(handle: string, page: string, cache?: UserCache) {
+	try {
+		const cachedResult = await cache?.get?.(handle);
+
+		if (!cachedResult) return;
+		const result = JSON.parse(cachedResult);
+		const update = result.updatedAt;
+		const timePassed = (Date.now() - update) / 1000;
 
-			if (cachedResult) {
-				const result = JSON.parse(cachedResult);
-				const update = result.updatedAt;
-				const timePassed = (Date.now() - update) / 1000;
-				console.log(
-					'using cached result for handle',
-					handle,
-					'last update',
-					timePassed,
-					'seconds ago'
-				);
-				return checkData(migrateData(JSON.parse(cachedResult)));
-			}
-		} catch (error) {
-			console.log('getting cached result failed', error);
+		if (!result.version || result.version !== CURRENT_CACHE_VERSION) {
+			console.log('skipping cache because of version mismatch');
+			return;
 		}
+
+		result.page = 'blento.' + page;
+
+		result.publication = (result.publications as ListRecord[]).find(
+			(v) => parseUri(v.uri).rkey === result.page
+		)?.value;
+
+		delete result['publications'];
+
+		console.log('using cached result for handle', handle, 'last update', timePassed, 'seconds ago');
+		return checkData(result);
+	} catch (error) {
+		console.log('getting cached result failed', error);
 	}
+}
 
-	const did = await resolveHandle({ handle });
+export async function loadData(
+	handle: string,
+	cache: UserCache | undefined,
+	forceUpdate: boolean = false,
+	page: string = 'self'
+): Promise<WebsiteData> {
+	if (!handle) throw error(404);
 
-	const downloadedData = {} as DownloadedData;
+	if (!forceUpdate) {
+		const cachedResult = await getCache(handle, page, cache);
 
-	const promises: {
-		collection: string;
-		rkey?: string;
-		record: Promise<ListRecord> | Promise<Record<string, ListRecord>>;
-	}[] = [];
+		if (cachedResult) return cachedResult;
+	}
 
-	for (const collection of Object.keys(data) as Collection[]) {
-		const cfg = data[collection];
+	if (handle === 'favicon.ico') throw error(404);
 
-		try {
-			if (Array.isArray(cfg)) {
-				for (const rkey of cfg) {
-					const record = getRecord({ did, collection, rkey }).catch((error) => {
-						console.error('error getting record', rkey, 'for collection', collection);
-					});
-					promises.push({
-						collection,
-						rkey,
-						record
-					});
-				}
-			} else if (cfg === 'all') {
-				const records = listRecords({ did, collection }).catch((error) => {
-					console.error('error getting records for collection', collection);
-				});
-				promises.push({ collection, record: records });
-			}
-		} catch (error) {
-			console.error('failed getting', collection, cfg, error);
-		}
-	}
+	console.log('resolving', handle);
+	const did = await resolveHandle({ handle });
 
-	await Promise.all(promises.map((v) => v.record));
+	const cards = await listRecords({ did, collection: 'app.blento.card' }).catch(() => {
+		console.error('error getting records for collection app.blento.card');
+		return [] as ListRecord[];
+	});
 
-	for (const promise of promises) {
-		if (promise.rkey) {
-			downloadedData[promise.collection as IndividualCollections] ??= {} as Record<
-				string,
-				ListRecord
-			>;
-			downloadedData[promise.collection as IndividualCollections][promise.rkey] =
-				(await promise.record) as ListRecord;
-		} else {
-			downloadedData[promise.collection as ListCollections] ??= (await promise.record) as Record<
-				string,
-				ListRecord
-			>;
+	const publications = await listRecords({ did, collection: 'site.standard.publication' }).catch(
+		() => {
+			console.error('error getting records for collection site.standard.publication');
+			return [] as ListRecord[];
 		}
-	}
+	);
 
-	const cardTypes = new Set(
-		Object.values(downloadedData['app.blento.card']).map((v) => v.value.cardType) as string[]
-	);
+	const profile = await getProfile({ did });
 
+	const cardTypes = new Set(cards.map((v) => v.value.cardType ?? '') as string[]);
 	const cardTypesArray = Array.from(cardTypes);
 
 	const additionDataPromises: Record<string, Promise<unknown>> = {};
 
-	const loadOptions = { did, handle, platform };
+	const loadOptions = { did, handle, cache };
 
 	for (const cardType of cardTypesArray) {
 		const cardDef = CardDefinitionsByType[cardType];
 
-		if (cardDef.loadData) {
-			additionDataPromises[cardType] = cardDef
-				.loadData(
-					Object.values(downloadedData['app.blento.card'])
-						.filter((v) => cardType == v.value.cardType)
-						.map((v) => v.value) as Item[],
-					loadOptions
-				)
-				.catch((error) => {
-					console.error('error getting additional data for', cardType, error);
-				});
-		}
+		if (!cardDef.loadData) continue;
+
+		additionDataPromises[cardType] = cardDef
+			.loadData(
+				cards.filter((v) => cardType === v.value.cardType).map((v) => v.value) as Item[],
+				loadOptions
+			)
+			.catch((error: Error) => {
+				console.error('error getting additional data for', cardType, error);
+			});
 	}
 
 	await Promise.all(Object.values(additionDataPromises));
···
 	}
 
 	const result = {
+		page: 'blento.' + page,
+		handle,
 		did,
-		data: JSON.parse(JSON.stringify(downloadedData)) as DownloadedData,
+		cards: (cards.map((v) => {
+			return { ...v.value };
+		}) ?? []) as Item[],
+		publications: publications,
 		additionalData,
-		updatedAt: Date.now()
+		profile,
+		updatedAt: Date.now(),
+		version: CURRENT_CACHE_VERSION
 	};
 
-	await platform?.env?.USER_DATA_CACHE?.put(handle, JSON.stringify(result));
+	const stringifiedResult = JSON.stringify(result);
+	await cache?.put?.(handle, stringifiedResult);
+
+	const parsedResult = JSON.parse(stringifiedResult);
+	parsedResult.publication = (parsedResult.publications as ListRecord[]).find(
+		(v) => parseUri(v.uri).rkey === parsedResult.page
+	)?.value;
 
-	return checkData(migrateData(result));
+	delete parsedResult['publications'];
+
+	return checkData(parsedResult);
 }
 
-function migrateFromV0ToV1(data: LoadedData): LoadedData {
-	for (const card of Object.values(data.data['app.blento.card']).map((i) => i.value) as Item[]) {
+function migrateFromV0ToV1(data: WebsiteData): WebsiteData {
+	for (const card of data.cards) {
 		if (card.version) continue;
 		card.x *= 2;
 		card.y *= 2;
···
 	return data;
 }
 
-function checkData(data: LoadedData): LoadedData {
-	const cards = Object.values(data.data['app.blento.card']).map((i) => i.value) as Item[];
+function migrateFromV1ToV2(data: WebsiteData): WebsiteData {
+	for (const card of data.cards) {
+		if (!card.version || card.version < 2) {
+			card.page = 'blento.self';
+			card.version = 2;
+		}
+	}
+	return data;
+}
+
+function checkData(data: WebsiteData): WebsiteData {
+	data = migrateData(data);
+
+	const cards = data.cards.filter((v) => v.page === data.page);
 
-	console.log(cards);
 	if (cards.length > 0) {
 		fixAllCollisions(cards);
 		fixAllCollisions(cards, true);
···
 		compactItems(cards, true);
 	}
 
+	data.cards = cards;
+
 	return data;
 }
 
-function migrateData(data: LoadedData): LoadedData {
-	return migrateFromV0ToV1(data);
+function migrateData(data: WebsiteData): WebsiteData {
+	return migrateFromV1ToV2(migrateFromV0ToV1(data));
 }

src/lib/website/types.ts

···
-import type { data } from './data';
-import type { Record as ListRecord } from '@atproto/api/dist/client/types/com/atproto/repo/listRecords';
-
-export type Collection = keyof typeof data;
-
-export type IndividualCollections = {
-	[K in Collection]: (typeof data)[K] extends readonly unknown[] ? K : never;
-}[Collection];
-
-export type ListCollections = Exclude<Collection, IndividualCollections>;
-
-export type ElementType<C extends Collection> = (typeof data)[C] extends readonly (infer U)[]
-	? U
-	: unknown;
-
-export type DownloadedData = { [C in Collection]: Record<string, ListRecord> };

src/routes/+page.server.ts

···
 import { loadData } from '$lib/website/load';
 import { env } from '$env/dynamic/public';
+import type { UserCache } from '$lib/types';
 
 export async function load({ platform, url }) {
 	const hostname = url.hostname;
···
 	if (hostname === 'flo-bit.blento.app') {
 		handle = 'flo-bit.dev';
 	}
+	const cache = platform?.env?.USER_DATA_CACHE as unknown;
 
-	const data = await loadData(handle, platform);
-	return { ...data, handle };
+	return await loadData(handle, cache as UserCache);
 }

src/routes/+page.svelte

···
 <script lang="ts">
-	import { refreshData, setAdditionalUserData } from '$lib/helper.js';
-	import { type Item } from '$lib/types.js';
-	import Website from '$lib/Website.svelte';
+	import { refreshData } from '$lib/helper.js';
+	import Website from '$lib/website/Website.svelte';
 	import { onMount } from 'svelte';
 
 	let { data } = $props();
-
-	// svelte-ignore state_referenced_locally
-	setAdditionalUserData(data.additionalData);
 
 	onMount(() => {
 		refreshData(data);
 	});
 </script>
 
-<Website
-	{data}
-	handle={data.handle}
-	did={data.did}
-	items={Object.values(data.data['app.blento.card']).map((i) => i.value) as Item[]}
-/>
+<Website {data} />

src/routes/[handle]/+layout.server.ts

···
-import { loadData } from '$lib/website/load';
-import { env } from '$env/dynamic/private';
-import { error } from '@sveltejs/kit';
-
-export async function load({ params, platform }) {
-	if (env.PUBLIC_IS_SELFHOSTED) error(404);
-	const data = await loadData(params.handle, platform);
-	return { ...data, handle: params.handle };
-}

src/routes/[handle]/+page.svelte

···
-<script lang="ts">
-	import { page } from '$app/state';
-	import { refreshData, setAdditionalUserData } from '$lib/helper.js';
-	import { type Item } from '$lib/types.js';
-	import Website from '$lib/Website.svelte';
-	import { onMount } from 'svelte';
-
-	let { data } = $props();
-
-	// svelte-ignore state_referenced_locally
-	setAdditionalUserData(data.additionalData);
-
-	onMount(() => {
-		refreshData(data);
-	})
-</script>
-
-<Website
-	{data}
-	handle={page.params.handle}
-	did={data.did}
-	items={Object.values(data.data['app.blento.card']).map((i) => i.value) as Item[]}
-	settings={data.data['app.blento.settings']?.['self']?.value}
-/>

src/routes/[handle]/[[page]]/+layout.server.ts

···
+import { loadData } from '$lib/website/load';
+import { env } from '$env/dynamic/private';
+import { error } from '@sveltejs/kit';
+import type { UserCache } from '$lib/types';
+
+export async function load({ params, platform }) {
+	if (env.PUBLIC_IS_SELFHOSTED) error(404);
+
+	const cache = platform?.env?.USER_DATA_CACHE as unknown;
+
+	console.log(params.page);
+
+	return await loadData(params.handle, cache as UserCache, false, params.page);
+}

src/routes/[handle]/[[page]]/+page.svelte

···
+<script lang="ts">
+	import { refreshData } from '$lib/helper.js';
+	import Website from '$lib/website/Website.svelte';
+	import { onMount } from 'svelte';
+
+	let { data } = $props();
+
+	onMount(() => {
+		refreshData(data);
+	});
+</script>
+
+<Website {data} />

src/routes/[handle]/[[page]]/edit/+page.svelte

···
+<script lang="ts">
+	import EditableWebsite from '$lib/website/EditableWebsite.svelte';
+	let { data } = $props();
+</script>
+
+<EditableWebsite {data} />

src/routes/[handle]/api/refreshData/+server.ts

···
+import type { UserCache } from '$lib/types';
 import { loadData } from '$lib/website/load.js';
 import { json } from '@sveltejs/kit';
 
···
 	if (!platform?.env?.USER_DATA_CACHE) return json('no cache');
 	const handle = params.handle;
 
-	await loadData(handle, platform, true);
+	const cache = platform?.env?.USER_DATA_CACHE as unknown;
+	await loadData(handle, cache as UserCache, true);
 
 	return json('ok');
 }

src/routes/[handle]/edit/+page.svelte

···
-<script lang="ts">
-	import { page } from '$app/state';
-	import EditableWebsite from '$lib/EditableWebsite.svelte';
-	import { setAdditionalUserData } from '$lib/helper.js';
-	import { type Item } from '$lib/types.js';
-
-	let { data } = $props();
-
-	// svelte-ignore state_referenced_locally
-	setAdditionalUserData(data.additionalData);
-</script>
-
-<EditableWebsite
-	handle={page.params.handle}
-	did={data.did}
-	{data}
-	items={Object.values(data.data['app.blento.card']).map((i) => i.value) as Item[]}
-
-	settings={data.data['app.blento.settings']?.['self']?.value}
-/>

src/routes/[handle]/og.png/+server.ts

···
+import type { UserCache } from '$lib/types';
 import { loadData } from '$lib/website/load';
 import { ImageResponse } from '@ethercorps/sveltekit-og';
 
 export async function GET({ params, platform }) {
 	const handle = params.handle;
-	const data = await loadData(params.handle, platform);
+
+	const cache = platform?.env?.USER_DATA_CACHE as unknown;
+
+	const data = await loadData(params.handle, cache as UserCache);
 
-	console.log(data.data['app.bsky.actor.profile'].self);
-	const image =
-		'https://cdn.bsky.app/img/avatar/plain/' +
-		data.did +
-		'/' +
-		data.data['app.bsky.actor.profile'].self.value.avatar.ref.$link;
+	const image = data.profile.avatar;
 
 	const htmlString = `
 <div class="flex flex-col p-8 w-full h-full bg-neutral-900">

src/routes/api/update/+server.ts

···
+import type { UserCache } from '$lib/types';
+import { getCache, loadData } from '$lib/website/load';
+import type { ProfileViewDetailed } from '@atproto/api/dist/client/types/app/bsky/actor/defs';
+import { json } from '@sveltejs/kit';
+
+export async function GET({ platform }) {
+	if (!platform?.env?.USER_DATA_CACHE) return json('no cache');
+	const existingUsers = await platform?.env?.USER_DATA_CACHE?.get('updatedBlentos');
+
+	const existingUsersArray: ProfileViewDetailed[] = existingUsers ? JSON.parse(existingUsers) : [];
+
+	const existingUsersHandle = existingUsersArray.map((v) => v.handle);
+
+	const cache = platform?.env?.USER_DATA_CACHE as unknown;
+
+	for (const handle of existingUsersHandle) {
+		if (!handle) continue;
+
+		console.log('updating', handle);
+		try {
+			const cached = await getCache(handle, 'self', cache as UserCache);
+			if (!cached) await loadData(handle, cache as UserCache, true);
+		} catch (error) {
+			console.error(error);
+			return json('error');
+		}
+		console.log('updated', handle);
+	}
+
+	return json('ok');
+}

src/routes/edit/+page.server.ts

···
 import { loadData } from '$lib/website/load';
 import { env } from '$env/dynamic/public';
+import type { UserCache } from '$lib/types';
 
 export async function load({ url, platform }) {
 	const hostname = url.hostname;
···
 		handle = 'flo-bit.dev';
 	}
 
-	const data = await loadData(handle, platform);
-	return { ...data, handle };
+	const cache = platform?.env?.USER_DATA_CACHE as unknown;
+
+	return await loadData(handle, cache as UserCache);
 }

src/routes/edit/+page.svelte

···
 <script lang="ts">
-	import EditableWebsite from '$lib/EditableWebsite.svelte';
-	import { setAdditionalUserData } from '$lib/helper.js';
-	import { type Item } from '$lib/types.js';
+	import EditableWebsite from '$lib/website/EditableWebsite.svelte';
 
 	let { data } = $props();
-
-	// svelte-ignore state_referenced_locally
-	setAdditionalUserData(data.additionalData);
 </script>
 
-<EditableWebsite
-	handle={data.handle}
-	did={data.did}
-	{data}
-	items={Object.values(data.data['app.blento.card']).map((i) => i.value) as Item[]}
-/>
+<EditableWebsite {data} />

todo.md

···
     - github pages
 
 - analytics (get page views)
-- custom subdomain
+- custom subdomain
+
+- dino game: fix fps dependency