import * as mobx_view_model_react from 'mobx-view-model-react'; export * from 'mobx-view-model-react'; import { PubSub } from 'yummies/complex'; import { ObservableAnnotationsArray } from 'yummies/mobx'; import { Class, AnyObject, Maybe, EmptyObject, MaybePromise, PartialKeys, DeepPartial } from 'yummies/types'; interface ViewModelStoreConfig { /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config) */ vmConfig?: ViewModelsRawConfig; } interface ViewModelGenerateIdConfig { VM: Class; id?: Maybe; ctx: AnyObject; parentViewModelId: string | null; fallback?: mobx_view_model_react.RComponentType; } interface ViewModelCreateConfig extends ViewModelParams { VM: Class; fallback?: mobx_view_model_react.RComponentType; component?: mobx_view_model_react.VMComponent; /** * Additional component anchors for the same VM instance. * useViewModel(AnchorComponent) will return this VM when mounted. */ anchors?: mobx_view_model_react.RComponentType[]; props?: AnyObject; } /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/other/view-model-lookup) */ type ViewModelLookup = AnyViewModel['id'] | Class | (T extends AnyViewModel ? mobx_view_model_react.VMComponent | mobx_view_model_react.RComponentType : mobx_view_model_react.RComponentType); /** * Interface for creating simple view models * * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-model-simple.html) */ interface ViewModelSimple { /** * Unique identifier for the view model instance. * If not provided, it will be autogenerated by the library. */ id?: string; /** * Automatically setted by the library. */ parentViewModel?: ParentViewModel; mount?(): void; unmount?(): void; setPayload?(payload: Payload): void; attachViewModelStore?(viewModelStore: ViewModelStore): void; } /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface) */ interface ViewModelStore { /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#getids-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The IDs of the view models */ getIds(vmLookup: Maybe>): string[]; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#getid-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The ID of the view model, or null if not found. */ getId(vmLookup: Maybe>): string | null; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#mountedviewscount) */ mountedViewsCount: number; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#has-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns True if the instance exists, false otherwise. */ has(vmLookup: Maybe>): boolean; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#get-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The view model instance, or null if not found. */ get(vmLookup: Maybe>): T | null; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#getall-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The view model instance, or null if not found. */ getAll(vmLookup: Maybe>): T[]; /** * This is specific method to be called when a view model is about to be attached to view. * This method is the first method where the created view model instance is passed to the view model store. * * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#marktobeattached-viewmodel) */ markToBeAttached(model: VMBase | AnyViewModelSimple): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#attach-viewmodel) * @param model - The view model to attach. * @returns `void` when `mount()` completed synchronously, otherwise a promise that settles after async `mount()`. */ attach(model: VMBase | AnyViewModelSimple): MaybePromise; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#detach-viewmodelid) * @param id - The ID of the view model to detach. * @returns A promise that resolves when the operation is complete. */ detach(id: VMBase['id'] | ViewModelSimple['id']): Promise; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#isabletorenderview-viewmodelid) * Determines if a view model is able to render based on its ID. * @param id - The ID of the view model. * @returns True if the view model can render, false otherwise. */ isAbleToRenderView(id: Maybe): boolean; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#createviewmodel-config) * Creates a new view model instance based on the provided configuration. * @param config - The configuration for creating the view model. * @returns The newly created view model instance. */ createViewModel(config: ViewModelCreateConfig): VM; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#processcreateconfig-config) * Process the configuration for creating a view model. * This method is called just before creating a new view model instance. * It's useful for initializing the configuration, like linking anchors to the view model class. * @param config - The configuration for creating the view model. */ processCreateConfig(config: ViewModelCreateConfig): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#link) * Link anchors (React components) with view model class. * @param VM - The view model class to link to. * @param anchors - The anchors to link. */ link(VM: Class, ...anchors: Maybe[]): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#unlink) * Unlink anchors (React components) with view model class. * @param anchors - The anchors to unlink. */ unlink(...anchors: Maybe[]): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#generateviewmodelid-config) * Generates a unique ID for a view model based on the provided configuration. * @param config - The configuration for generating the ID. * @returns The generated unique ID. */ generateViewModelId(config: ViewModelGenerateIdConfig): string; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#clean) * Clean up resources associated with the view model store. * Clean all inner data structures. */ clean(): void; } type AnyViewModel = ViewModel; type AnyViewModelSimple = ViewModelSimple; type PayloadCompareFn = (currentPayload: TPayload | undefined, nextPayload: TPayload) => boolean; type ViewModelPayload = TViewModel extends ViewModel ? Payload : never; type ViewModelParent = TViewModel extends ViewModel ? Parent : never; interface ViewModelParams { /** * Unique identifier for the view */ id: string; payload: Payload; viewModels?: Maybe; parentViewModelId?: Maybe; parentViewModel?: Maybe; /** * Additional data that may be useful when creating the VM */ ctx?: AnyObject; /** * Additional configuration for the view model * See {@link ViewModelsConfig} * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config) */ vmConfig?: ViewModelsRawConfig; /** * Original component props */ props?: ComponentProps; } /** * The main interface for all view models. * * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface) */ interface ViewModel { /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#id-string) */ readonly id: string; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#vmconfig-viewmodelsconfig) */ readonly vmConfig: ViewModelsConfig; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#payload-payload) */ readonly payload: Payload; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#ismounted-boolean) */ readonly isMounted: boolean; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#isunmounting-boolean) */ readonly isUnmounting: boolean; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#parentviewmodel-parentviewmodel-null) */ readonly parentViewModel: ParentViewModel; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#mount-void-promise-void) */ mount(): MaybePromise; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#unmount-void-promise-void) */ unmount(): MaybePromise; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#setpayload-payload-payload-void) * * The React integration may call this on **every render** while the component is mounted in the tree, * including **before** `mount()` has finished (and while `isMounted` is still `false`), so `payloadChanged` * and side effects should not assume a fully mounted view model. */ setPayload(payload: Payload): void; /** * **NOTE** - this method will be moved to `ViewModelBase` in next major version * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/interface#payloadchanged-payload-payload-prevpayload-payload-void) */ payloadChanged(payload: Payload, prevPayload: Payload): void; } declare class ViewModelBase implements ViewModel { protected vmParams: ViewModelParams; private abortController; unmountSignal: AbortSignal; id: string; private _isMounted; private _isUnmounting; private _payload; vmConfig: ViewModelsConfig; protected isPayloadEqual?: PayloadCompareFn; protected props: ComponentProps; constructor(vmParams: ViewModelParams); get payload(): Payload; protected get viewModels(): ViewModelStore; get isMounted(): boolean; get isUnmounting(): boolean; protected willUnmount(): void; /** * Empty method to be overridden */ protected willMount(): void; /** * The method is called when the view starts mounting */ mount(): void; /** * The method is called when the view was mounted */ protected didMount(): void; /** * The method is called when the view starts unmounting */ unmount(): void; /** * The method is called when the view was unmounted */ protected didUnmount(): void; private finalizeUnmount; private beginUnmounting; /** * Checks whether the given view model is a child of the current view model. * When `deep` is `true`, checks the whole parent chain. * * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/base-implementation#haschild-vm-anyviewmodel--anyviewmodelsimple-deep-boolean-boolean) */ protected hasChild(vm: AnyViewModel | AnyViewModelSimple, deep?: boolean): boolean; /** * Checks whether the given view model is a parent of the current view model. * When `deep` is `true`, checks the whole parent chain. * * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/base-implementation#hasparent-vm-anyviewmodel--anyviewmodelsimple-deep-boolean-boolean) */ protected hasParent(vm: AnyViewModel | AnyViewModelSimple, deep?: boolean): boolean; /** * The method is called when the payload of the view model was changed * * The state - "was changed" is determined inside the setPayload method */ payloadChanged(payload: Payload, prevPayload: Payload): void; /** * Returns the parent view model */ get parentViewModel(): ParentViewModel; /** * The method is called when the payload changes in the react component */ setPayload(payload: Payload): void; } type InferViewModelParams = T extends ViewModelBase ? ViewModelParams : never; declare class ViewModelStoreBase implements ViewModelStore { protected config?: ViewModelStoreConfig | undefined; protected viewModels: Map; protected linkedAnchorVMClasses: Map>; protected viewModelIdsByClasses: Map | Class, string[]>; protected instanceAttachedCount: Map; /** * It is temp heap which is needed to get access to view model instance before all initializations happens */ protected viewModelsTempHeap: Map; /** * Views waiting for mount */ protected mountingViews: Set; /** * Views waiting for unmount */ protected unmountingViews: Set; protected vmConfig: ViewModelsConfig; constructor(config?: ViewModelStoreConfig | undefined); get mountedViewsCount(): number; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#processcreateconfig-config) * Process the configuration for creating a view model. * This method is called just before creating a new view model instance. * It's useful for initializing the configuration, like linking anchors to the view model class. * @param config - The configuration for creating the view model. */ processCreateConfig(config: ViewModelCreateConfig): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#createviewmodel-config) * Creates a new view model instance based on the provided configuration. * @param config - The configuration for creating the view model. * @returns The newly created view model instance. */ createViewModel(config: ViewModelCreateConfig): VM; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#generateviewmodelid-config) * Generates a unique ID for a view model based on the provided configuration. * @param config - The configuration for generating the ID. * @returns The generated unique ID. */ generateViewModelId(config: ViewModelGenerateIdConfig): string; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#link) * Link anchors (React components) with view model class. * @param VM - The view model class to link to. * @param anchors - The anchors to link. */ link(VM: Class, ...anchors: Maybe[]): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#unlink) * Unlink anchors (React components) with view model class. * @param anchors - The anchors to unlink. */ unlink(...anchors: Maybe[]): void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#getids-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The IDs of the view models */ getIds(vmLookup: Maybe>): string[]; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#getid-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The ID of the view model, or null if not found. */ getId(vmLookup: Maybe>): string | null; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#has-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns True if the instance exists, false otherwise. */ has(vmLookup: Maybe>): boolean; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#get-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns The view model instance, or null if not found. */ get(vmLookup: Maybe>): T | null; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/base-implementation#getorcreatevmid-model) * @param model - View model instance whose `id` should be defined. * @returns Stable id for the instance (existing or newly generated). */ getOrCreateVmId(model: VMBase | AnyViewModelSimple): string; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-model-store/interface#getall-vmlookup) * @param vmLookup - The ID or class type of the view model. See {@link ViewModelLookup}. * @returns All view model instances matching the lookup. */ getAll(vmLookup: Maybe>): T[]; protected finalizeMount(modelId: string): void; /** * Puts the model in {@link mountingViews}, calls `model.mount()`, then {@link finalizeMount}. * {@link attach} delegates here so sync `mount()` finishes in the same turn as `attach` (SSR / first paint). * * Returns `void` when `model.mount()` is synchronous, otherwise a promise that settles after async mount. */ protected mount(model: VMBase | AnyViewModelSimple): MaybePromise; protected unmount(model: VMBase | AnyViewModelSimple): Promise; protected attachVMConstructor(model: VMBase | AnyViewModelSimple): void; protected dettachVMConstructor(model: VMBase | AnyViewModelSimple): void; markToBeAttached(model: VMBase | AnyViewModelSimple): void; /** * Registers the view model and runs `model.mount()` in the same stack when it is synchronous, * so SSR and the first client render can match without a separate API. * * If `mount()` returns a thenable, returns a `Promise` that settles after mount; the first paint * may still show fallback until then. Otherwise returns `void`. */ attach(model: VMBase | AnyViewModelSimple): MaybePromise; detach(id: string): Promise; isAbleToRenderView(id: Maybe): boolean; clean(): void; } interface ViewModelObservableConfig { /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config.html#disablewrapping) */ disableWrapping?: boolean; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config.html#usedecorators) */ useDecorators: boolean; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config.html#custom-context-annotationsarray) */ custom?: (context: AnyObject, annotationsArray: ObservableAnnotationsArray) => void; } type GenerateViewModelIdFn = (ctx: AnyObject) => string; type CreateViewModelFactoryFn = (config: ViewModelCreateConfig) => TViewModel; /** * Configuration options for view models. * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config) */ interface ViewModelsConfig { /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#startviewtransitions) */ startViewTransitions: { mount: boolean; unmount: boolean; payloadChange: boolean; }; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#comparepayload) */ comparePayload?: PayloadCompareFn | 'strict' | 'shallow' | false; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#payloadobservable) */ payloadObservable: 'ref' | 'deep' | 'shallow' | 'struct' | false; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#payloadcomputed) */ payloadComputed: 'struct' | boolean | ((a: any, b: any) => boolean); /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#generateid) */ generateId: GenerateViewModelIdFn; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#factory) */ factory: CreateViewModelFactoryFn; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#flushpendingreactions) */ flushPendingReactions: number; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#fallbackcomponent) */ fallbackComponent?: mobx_view_model_react.RComponentType; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#onmount) */ onMount?: (viewModel: TViewModel) => void; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#onunmount) */ onUnmount?: (viewModel: TViewModel) => void; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#hooks) */ readonly hooks: { /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#hooks) */ readonly storeCreate: PubSub<[ viewModelStore: ViewModelStore ]>; }; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#processviewcomponent) */ processViewComponent?: (component: mobx_view_model_react.RComponentType | undefined, VM: Class, /** Полный тип HOC — `ViewModelHocConfig` в `mobx-view-model-react`. */ config: AnyObject) => Maybe>; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#wrapviewsinobserver) */ wrapViewsInObserver?: boolean; /** [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config#observable) */ observable: { viewModels: ViewModelObservableConfig; viewModelStores: ViewModelObservableConfig; }; } /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config) */ type ViewModelsRawConfig = PartialKeys, 'startViewTransitions' | 'observable' | 'factory' | 'generateId' | 'hooks'>, 'payloadObservable' | 'payloadComputed' | 'flushPendingReactions'> & { startViewTransitions?: DeepPartial | boolean; observable?: DeepPartial; factory?: ViewModelsConfig['factory']; generateId?: ViewModelsConfig['generateId']; }; /** * Global configuration options for view models */ declare const viewModelsConfig: ViewModelsConfig; declare const applyObservable: (context: AnyObject, annotationsArray: ObservableAnnotationsArray, observableConfig: ViewModelObservableConfig) => void; /** * [**Documentation**](https://js2me.github.io/mobx-view-model/api/view-models/view-models-config) */ declare const mergeVMConfigs: (...configs: Maybe[]) => ViewModelsConfig; declare const generateVmId: GenerateViewModelIdFn; declare const isViewModel: (value: AnyObject) => value is ViewModel; declare const isViewModelClass: (value: Function) => value is Class>; declare const isViewModeSimpleClass: (value: Function) => value is Class>; export { ViewModelBase, ViewModelStoreBase, applyObservable, generateVmId, isViewModeSimpleClass, isViewModel, isViewModelClass, mergeVMConfigs, viewModelsConfig }; export type { AnyViewModel, AnyViewModelSimple, CreateViewModelFactoryFn, GenerateViewModelIdFn, InferViewModelParams, PayloadCompareFn, ViewModel, ViewModelCreateConfig, ViewModelGenerateIdConfig, ViewModelLookup, ViewModelObservableConfig, ViewModelParams, ViewModelParent, ViewModelPayload, ViewModelSimple, ViewModelStore, ViewModelStoreConfig, ViewModelsConfig, ViewModelsRawConfig };