From 91774def1d4a6d08ecf22c423af8edcf3448ff7d Mon Sep 17 00:00:00 2001
From: ocavue <ocavue@gmail.com>
Date: Sat, 14 Sep 2024 15:02:03 +1000
Subject: [PATCH] fix: fix typescript error about startViewTransition

---
 lib/handle-toggle-click.ts | 24 +++++++++++++++++-------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/lib/handle-toggle-click.ts b/lib/handle-toggle-click.ts
index 7f152a4..63c5ddc 100644
--- a/lib/handle-toggle-click.ts
+++ b/lib/handle-toggle-click.ts
@@ -1,22 +1,32 @@
 import { toggleTheme } from './theme'
 
+type StartViewTransition = (
+  updateCallback?: () => void | Promise<void>,
+) => ViewTransition | undefined
+
+type ViewTransition = {
+  finished?: Promise<void>
+  ready?: Promise<void>
+  updateCallbackDone?: Promise<void>
+}
+
 async function startCircleAnimation(
   callback: () => void,
   x: number,
   y: number,
 ) {
-  // @ts-expect-error: startViewTransition is not typed
-  if (typeof document.startViewTransition !== 'function') {
+  const startViewTransition = (
+    document as unknown as { startViewTransition?: StartViewTransition }
+  ).startViewTransition
+
+  if (typeof startViewTransition !== 'function') {
     callback()
     return
   }
 
-  // @ts-expect-error: startViewTransition is not typed
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-  await document.startViewTransition(() => {
+  await startViewTransition(() => {
     callback()
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
-  }).ready
+  })?.ready
 
   const gradientOffset = 0.7
   const maskSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><defs><radialGradient id="toggle-theme-gradient"><stop offset="${gradientOffset}"/><stop offset="1" stop-opacity="0"/></radialGradient></defs><circle cx="4" cy="4" r="4" fill="url(#toggle-theme-gradient)"/></svg>`