import React from 'react' ; import { AppContext , Operation , OperationArgs , StoreClass } from '@fleur/fleur' ; import { unstable_batchedUpdates } from './utils/batchedUpdates' ; export interface ComponentFleurContext { executeOperation < O extends Operation > ( this , operation , ... args ) : void ; getStore < T extends StoreClass > ( this , StoreClass ) : InstanceType < T > ; depend < T > ( this , o ) : T ; } export interface ComponentContextOption { batchedUpdate ? : ( cb : ( ) => void ) => void ; synchronousUpdate ? : boolean ; } export interface ContextValue { synchronousUpdate : boolean ; context : ComponentFleurContext ; } const ComponentReactContext = React . createContext < ContextValue > ( null as any ) ; const FleurContext = ( { value : context , children , options : { batchedUpdate = unstable_batchedUpdates , synchronousUpdate = false , } = { } , } ) => { React . useMemo ( ( ) => { context . storeContext . injectBatch ( batchedUpdate ) ; } , [ ] ) ; const componentContext = React . useMemo ( ( ) : ComponentFleurContext => ( { executeOperation : ( o , ... args ) => { context . executeOperation ( o , ... args ) ; } , getStore : S => context . getStore ( S ) , depend : o => context . depend ( o ) , } ) , [ context ] ) ; const props = React . useMemo ( ( ) : { value : ContextValue ; } => ( { value : { context : componentContext , synchronousUpdate , } , } ) , [ synchronousUpdate ] ) ; return React . createElement ( ComponentReactContext . Provider , props , children ) ; } ; export { ComponentReactContext , FleurContext } ;