tutu/src/platform/anim.ts
2024-08-12 21:55:26 +08:00

49 lines
1,017 B
TypeScript

import {
createContext,
createRenderEffect,
createSignal,
untrack,
useContext,
type Accessor,
type Signal,
} from "solid-js";
export type HeroSource = {
[key: string | symbol | number]: DOMRect | undefined;
};
const HeroSourceContext = createContext<Signal<HeroSource>>(/* __@PURE__ */undefined);
export const HeroSourceProvider = HeroSourceContext.Provider;
function useHeroSource() {
return useContext(HeroSourceContext);
}
/**
* Use hero value for the {@link key}.
*/
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]();
if (value[key]) {
set(value[key]);
source[1]((x) => {
const cpy = Object.assign({}, x);
delete cpy[key];
return cpy;
});
}
});
return get;
} else {
return () => undefined;
}
}