export type RenderCallback = ( ctx: CanvasRenderingContext2D, deltaTime: number, realDeltaTime: number, ) => void; export type ScreenClickCallback = (x: number, y: number) => void; export type ScreenMouseWheelCallback = (deltaY: number, deltaX: number) => void; export const useScreen = () => { const registerRender = inject< (cb: RenderCallback, zIndex?: number) => () => void >("registerRenderCallback"); const registerClick = inject<(cb: ScreenClickCallback) => () => void>( "registerScreenClickCallback", ); const registerWheel = inject<(cb: ScreenMouseWheelCallback) => () => void>( "registerScreenMouseWheelCallback", ); const onRender = (callback: RenderCallback, zIndex = 0) => { onMounted(() => { if (!registerRender) throw new Error("useScreen must be used within a Screen component"); const unregister = registerRender(callback, zIndex); onUnmounted(unregister); }); }; const onClick = (callback: ScreenClickCallback) => { onMounted(() => { if (!registerClick) throw new Error("useScreen must be used within a Screen component"); const unregister = registerClick(callback); onUnmounted(unregister); }); }; const onMouseWheel = (callback: ScreenMouseWheelCallback) => { onMounted(() => { if (!registerWheel) throw new Error("useScreen must be used within a Screen component"); const unregister = registerWheel(callback); onUnmounted(unregister); }); }; return { onRender, onClick, onMouseWheel }; };