import { IComponent, IComponentProps, IReferenceNode, IVnode } from "./component.model"; import { IAttrDiff, INodeDiff, IObject } from "./pview.model"; /** * Component Class is an abstract base class of all PView reusable component class. * All custom components must extends this Component class. And they should have implement the render method. */ export declare abstract class Component { props: T; state: IObject; ref: IReferenceNode | null; vnode: IVnode; constructor(props: T); /** * Fires when setting new state of a component. * @param {IObject} stateParams Update that state from this object. * @returns {IVnode | false} Virtual Node tree of the component. */ setState(stateParams: IObject): IVnode | false; /** * Fetch virtual node of a component by calling its render function and assign it into vnode property. * @returns {IVnode} Virtual node of the component. */ getVirtualNode(): IVnode; /** * * @returns {IReferenceNode} Returns reference node of real DOM */ getRef(): IReferenceNode; /** * * @param {IReferenceNode} ref Set Reference real node of component */ setRef(ref: IReferenceNode): void; /** * Get prop object of the component * @returns Props of the component */ getProps(): IObject; /** * External children will be set on the props to project into the component structure * @param {IVnode[]} extChildren External children vNode */ setExternalChildren(extChildren: IVnode[]): void; /** * Compare nodeName, attributes to detect exact changes * @param {IVnode} oldVNode Old virtual node tree of the component. * @param {IVnode} newVNode New virtual node tree of the component. * @returns {INodeDiff} A diff object with type. */ _detectDiff(oldVNode: IVnode, newVNode: IVnode): INodeDiff; /** * Get a diff json by comparing two JSON objects. * @param {IObject} obj1 First object to compare. * @param {IObject} obj2 Second object to compare with First object. * @param {number} level Number of hierarchical level to compare also will run (undefined for compare all levels). * @param {string[]} ignoreList Will ignore those attributes from this list. * @returns {IAttrDiff} A diff object with detail of attribute differences. */ _attrDiff(obj1: IObject, obj2: IObject, level: number, ignoreList?: string[]): IAttrDiff; /** * Compare and return an unique array with elements. * @param {any[]} array An array which need to de-duplicate. * @returns {any[]} An array of unique elements. */ arrayUnique(array: any[]): any[]; /** * Traverse virtual node and Heuristic O(n) compare with old node to minimize DOM update. * @param {IVnode} oldVNode Previous virtual node that rendered. * @param {IVnode} newVNode Newly created virtual node that constructed recent update after passing new props. * @param {IComponent} ref Object reference of the component. * @param {IObject} context Combination of existing self context and new context that passed from parent. * @returns {IAttrDiff | boolean} Returns Attribute difference object or false */ _reconcile(oldVNode: IVnode, newVNode: IVnode, ref: IReferenceNode, context?: IObject): INodeDiff | boolean; /** * Update internal text node * @param {number} nodePos Index of node in virtual node children list. * @param {IVnode} newVNode Newly rendered virtual node. * @param {IReferenceNode} ref Object reference of component. */ _updateTextNode(nodePos: number, newVNode: IVnode, ref: IReferenceNode): void; /** * Render and Mount new DOM node. * @param {number} nodePos Index of node in virtual node children list. * @param {IVnode} newVNode Newly rendered virtual node. * @param {IReferenceNode} ref Object reference of component. * @param {IObject} context Combination of existing self context and new context that passed from parent. * @returns {IComponent | SVGElement} A component object OR real DOM node. */ _createNewNode(nodePos: number, newVNode: IVnode, ref: IReferenceNode, context: IObject): IComponent; /** * Remove the old node from DOM and Object reference. * @param {number} nodePos Index of node in virtual node children list. * @param {IVnode} oldVNode Previously rendered virtual node. * @param {IReferenceNode} ref Object reference of component. */ _removeOldNode(nodePos: number, oldVNode: IVnode, ref: IReferenceNode): void; /** * Update only attribute of existing DOM node. * @param {SVGElement | HTMLElement} dom DOM reference on the node. * @param {IAttrDiff} attrChanges Attributes to be modify. */ _updateAttr(dom: SVGElement | HTMLElement, attrChanges: IAttrDiff): void; /** * Fires when we want to re-render a component * @returns {IVnode | false} Virtual Node tree of the component. */ update(): IVnode | false; /** * Interface that child may override - returns context that will pass on child context. * @returns {Object} A json object that will be pass as context to children components. */ passContext?(): IObject; /** * Abstract method that child must override - return virtual DOM of the component. * @returns {Object} JSX object of the component that will be rendered and mount. */ abstract render(): IVnode; /** * Lifecycle event - fires just before passing props into a pre-exist Component. * @param {Object} nextProps New set of props. * @returns void. */ propsWillReceive?(nextProps: IObject): void; /** * Lifecycle event - fires before the mounting component on parent DOM. * @param {Object} nextProps New set of props. * @returns void. */ beforeMount?(nextProps: IObject): void; /** * Lifecycle event - fires after the component mounted on parent DOM. * @param {Object} nextProps New set of props. * @returns void. */ afterMount?(nextProps: IObject): void; /** * Call before render and determine component update * @param {Object} nextProps Next set of props that will receive by component. * @returns {boolean} Return boolean true or false. */ shouldUpdate?(nextProps: IObject): boolean; /** * Lifecycle event - fires before the component update on parent DOM. * @param {Object} nextProps set of props that was there before update that component. * @returns void. */ beforeUpdate?(nextProps: IObject): void; /** * Lifecycle event - fires after the component update on parent DOM. * @param {Object} prevProps set of props that was there before update that component. * @returns void. */ afterUpdate?(prevProps: IObject): void; /** * Lifecycle event - fires before the component unmounted from parent DOM. * @returns void. */ beforeUnmount?(): void; }