BottomSheet: first attempt for animation

src/platform/anim.ts

@@ -1,13 +1,47 @@
-import { createContext, useContext, type Accessor } from "solid-js";
+import {
+  createContext,
+  createRenderEffect,
+  createSignal,
+  untrack,
+  useContext,
+  type Accessor,
+  type Signal,
+} from "solid-js";
 
 export type HeroSource = {
-  [key: string | symbol | number]: HTMLElement | undefined;
+  [key: string | symbol | number]: DOMRect | undefined;
 };
 
-const HeroSourceContext = createContext<Accessor<HeroSource>>(() => ({}));
+const HeroSourceContext = createContext<Signal<HeroSource>>(undefined);
 
 export const HeroSourceProvider = HeroSourceContext.Provider;
 
-export function useHeroSource() {
+function useHeroSource() {
   return useContext(HeroSourceContext);
 }
+
+export function useHeroSignal(
+  key: string | symbol | number,
+): Accessor<DOMRect | undefined> {
+  const source = useHeroSource();
+  if (source) {
+    const [get, set] = createSignal<DOMRect>();
+
+    createRenderEffect(() => {
+      const value = source[0]();
+      console.debug("value", value);
+      if (value[key]) {
+        set(value[key]);
+        source[1]((x) => {
+          const cpy = Object.assign({}, x);
+          delete cpy[key];
+          return cpy;
+        });
+      }
+    });
+
+    return get;
+  } else {
+    return () => undefined;
+  }
+}