import { connect , IViewInstance , ChangeOptions } from '@goldfishjs/reactive' ; import ComponentStore from './ComponentStore' ; import attachLogic from './attachLogic' ; import getMiniDataSetter from './getMiniDataSetter' ; export const isComponent2 = typeof my !== 'undefined' ? my . canIUse ( 'component2' ) : false ; export type ComponentInstance < P , D , CS , M > = { store : CS ; } & tinyapp . IComponentInstance < P , D > & Omit < IViewInstance , 'store' > & M ; export type ComponentOptions < P , D , CS , M extends tinyapp . IComponentMethods > = ThisType < ComponentInstance < P , D , CS , M > > & tinyapp . ComponentOptions < P , D , M > ; export default function createTinyappComponent < P , CS extends ComponentStore < P > , D = any , M extends tinyapp . IComponentMethods = tinyapp . IComponentMethods > ( storeClass , componentOptions = { } , options ? ) { const beforeCreateStore = options && options . beforeCreateStore ; const afterCreateStore = options && options . afterCreateStore ; const enterKey = isComponent2 ? 'onInit' : 'didMount' ; const leaveKey = 'didUnmount' ; connect ( componentOptions , enterKey , leaveKey , function ( this , obj , keyPathList , newV , oldV , options ? ) { if ( ! this . store . isSyncDataSafe ) { return ; } const miniDataSetter = getMiniDataSetter ( ) ; miniDataSetter . set ( this , obj , keyPathList , newV , oldV , options ) ; } , instance => { beforeCreateStore && beforeCreateStore ( instance as ComponentInstance < P , D , CS , M > ) ; const store = new storeClass ( ) ; afterCreateStore && afterCreateStore ( instance as ComponentInstance < P , D , CS , M > , store ) ; return store ; } , { onError : componentOptions . onError , } ) ; function syncProps ( this ) { for ( const key in this . props ) { if ( key in this . store . props ) { this . store . props [ key ] = this . props [ key ] ; } } } attachLogic < typeof enterKey , Required < ComponentOptions < P , D , CS , M > > [ typeof enterKey ] > ( componentOptions , enterKey , 'after' , syncProps ) ; const refreshKey = isComponent2 ? 'deriveDataFromProps' : 'didUpdate' ; attachLogic < typeof refreshKey , Required < ComponentOptions < P , D , CS , M > > [ typeof refreshKey ] > ( componentOptions , refreshKey , 'after' , syncProps ) ; attachLogic < typeof leaveKey , Required < ComponentOptions < P , D , CS , M > > [ typeof leaveKey ] > ( componentOptions , leaveKey , 'after' , function ( this ) { this . store && ( this . store . isSyncDataSafe = false ) ; } ) ; return componentOptions ; }