Rubicon/tutu
1
0
Fork 0
Code Issues 19 Pull requests Projects Activity Actions

useHeroSignal: reset the signal after read

Browse source
This commit is contained in:
thislight 2024-08-17 15:37:10 +08:00
parent 5c150a6aa3
commit 29073d4303
No known key found for this signature in database
GPG key ID: A50F9451AC56A63E
2 changed files with 9 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/material/BottomSheet.tsx
View file

@ -43,7 +43,7 @@ const MOVE_SPEED = 1400; // 1400px/s, bottom sheet is big and a bit heavier than
const BottomSheet: ParentComponent<BottomSheetProps> = (props) => { const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
let element: HTMLDialogElement; let element: HTMLDialogElement;
let animation: Animation | undefined; let animation: Animation | undefined;
const hero = useHeroSignal(HERO); const [hero, setHero] = useHeroSignal(HERO);
const [cache, setCache] = createSignal<ResolvedChildren | undefined>(); const [cache, setCache] = createSignal<ResolvedChildren | undefined>();
const ochildren = children(() => props.children); const ochildren = children(() => props.children);
@ -70,11 +70,13 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
const animation = animateHero(startRect, endRect, element, true); const animation = animateHero(startRect, endRect, element, true);
const onClose = () => { const onClose = () => {
element.close(); element.close();
setHero();
}; };
animation.addEventListener("finish", onClose); animation.addEventListener("finish", onClose);
animation.addEventListener("cancel", onClose); animation.addEventListener("cancel", onClose);
} else { } else {
element.close(); element.close();
setHero();
} }
}; };

10
src/platform/anim.ts
View file

@ -12,7 +12,9 @@ export type HeroSource = {
[key: string | symbol | number]: DOMRect | undefined; [key: string | symbol | number]: DOMRect | undefined;
}; };
const HeroSourceContext = createContext<Signal<HeroSource>>(/* __@PURE__ */undefined); const HeroSourceContext = createContext<Signal<HeroSource>>(
/* __@PURE__ */ undefined,
);
export const HeroSourceProvider = HeroSourceContext.Provider; export const HeroSourceProvider = HeroSourceContext.Provider;
@ -25,7 +27,7 @@ function useHeroSource() {
*/ */
export function useHeroSignal( export function useHeroSignal(
key: string | symbol | number, key: string | symbol | number,
): Accessor<DOMRect | undefined> { ): Signal<DOMRect | undefined> {
const source = useHeroSource(); const source = useHeroSource();
if (source) { if (source) {
const [get, set] = createSignal<DOMRect>(); const [get, set] = createSignal<DOMRect>();
@ -42,8 +44,8 @@ export function useHeroSignal(
} }
}); });
return get; return [get, set];
} else { } else {
return () => undefined; return [() => undefined, () => undefined];
} }
} }