@types/react-reconciler
- Version 0.32.0
- Published
- 47 kB
- No dependencies
- MIT license
Install
npm i @types/react-reconciler
yarn add @types/react-reconciler
pnpm add @types/react-reconciler
Overview
TypeScript definitions for react-reconciler
Index
Functions
Interfaces
HostConfig
- afterActiveInstanceBlur()
- appendChild()
- appendChildToContainer()
- appendChildToContainerChildSet()
- appendInitialChild()
- beforeActiveInstanceBlur()
- cancelTimeout()
- canHydrateInstance()
- canHydrateSuspenseInstance()
- canHydrateTextInstance()
- clearContainer()
- cloneHiddenInstance()
- cloneHiddenTextInstance()
- cloneInstance()
- commitHydratedContainer()
- commitHydratedSuspenseInstance()
- commitMount()
- commitTextUpdate()
- commitUpdate()
- createContainerChildSet()
- createInstance()
- createTextInstance()
- detachDeletedInstance()
- didNotFindHydratableContainerInstance()
- didNotFindHydratableContainerSuspenseInstance()
- didNotFindHydratableContainerTextInstance()
- didNotFindHydratableInstance()
- didNotFindHydratableSuspenseInstance()
- didNotFindHydratableTextInstance()
- didNotHydrateContainerInstance()
- didNotHydrateInstance()
- didNotMatchHydratedContainerTextInstance()
- didNotMatchHydratedTextInstance()
- errorHydratingContainer()
- finalizeContainerChildren()
- finalizeInitialChildren()
- getChildHostContext()
- getCurrentUpdatePriority()
- getFirstHydratableChild()
- getInstanceFromNode()
- getInstanceFromScope()
- getNextHydratableInstanceAfterSuspenseInstance()
- getNextHydratableSibling()
- getParentSuspenseInstance()
- getPublicInstance()
- getRootHostContext()
- hideInstance()
- hideTextInstance()
- HostTransitionContext
- hydrateInstance()
- hydrateSuspenseInstance()
- hydrateTextInstance()
- insertBefore()
- insertInContainerBefore()
- isPrimaryRenderer
- isSuspenseInstanceFallback()
- isSuspenseInstancePending()
- maySuspendCommit()
- noTimeout
- NotPendingTransition
- preloadInstance()
- prepareForCommit()
- preparePortalMount()
- prepareScopeUpdate()
- registerSuspenseInstanceRetry()
- removeChild()
- removeChildFromContainer()
- replaceContainerChildren()
- requestPostPaintCallback()
- resetAfterCommit()
- resetFormInstance()
- resetTextContent()
- resolveEventTimeStamp()
- resolveEventType()
- resolveUpdatePriority()
- scheduleMicrotask()
- scheduleTimeout()
- setCurrentUpdatePriority()
- shouldAttemptEagerTransition()
- shouldSetTextContent()
- startSuspendingCommit()
- supportsHydration
- supportsMicrotasks
- supportsMutation
- supportsPersistence
- suspendInstance()
- trackSchedulerEvent()
- unhideInstance()
- unhideTextInstance()
- waitForCommitToBeReady()
- warnsIfNotActing
Reconciler
- attemptContinuousHydration()
- attemptDiscreteHydration()
- attemptHydrationAtCurrentPriority()
- attemptSynchronousHydration()
- batchedUpdates()
- createComponentSelector()
- createContainer()
- createHasPseudoClassSelector()
- createHydrationContainer()
- createPortal()
- createRoleSelector()
- createTestNameSelector()
- createTextSelector()
- deferredUpdates()
- discreteUpdates()
- findAllNodes()
- findBoundingRects()
- findHostInstance()
- findHostInstanceWithNoPortals()
- findHostInstanceWithWarning()
- flushControlled()
- flushPassiveEffects()
- flushSync()
- focusWithin()
- getCurrentUpdatePriority()
- getFindAllNodesFailureDescription()
- getPublicRootInstance()
- injectIntoDevTools()
- isAlreadyRendering()
- observeVisibleRects()
- registerMutableSourceForHydration()
- runWithPriority()
- shouldError()
- shouldSuspend()
- updateContainer()
Type Aliases
Functions
function ReactReconciler
ReactReconciler: < Type, Props, Container, Instance, TextInstance, SuspenseInstance, HydratableInstance, FormInstance, PublicInstance, HostContext, ChildSet, TimeoutHandle, NoTimeout, TransitionStatus>( config: ReactReconciler.HostConfig< Type, Props, Container, Instance, TextInstance, SuspenseInstance, HydratableInstance, FormInstance, PublicInstance, HostContext, ChildSet, TimeoutHandle, NoTimeout, TransitionStatus >) => ReactReconciler.Reconciler< Container, Instance, TextInstance, SuspenseInstance, FormInstance, PublicInstance>;
Interfaces
interface BoundingRect
interface BoundingRect {}
interface ComponentSelector
interface ComponentSelector {}
interface ContextDependency
interface ContextDependency<T> {}
property context
context: ReactContext<T>;
property next
next: ContextDependency<unknown> | null;
property observedBits
observedBits: number;
interface Dependencies
interface Dependencies {}
property firstContext
firstContext: ContextDependency<unknown> | null;
property lanes
lanes: Lanes;
interface DevToolsConfig
interface DevToolsConfig<Instance, TextInstance, RendererInspectionConfig> {}
property bundleType
bundleType: BundleType;
property findFiberByHostInstance
findFiberByHostInstance?: (instance: Instance | TextInstance) => Fiber | null;
property rendererConfig
rendererConfig?: RendererInspectionConfig;
property rendererPackageName
rendererPackageName: string;
property version
version: string;
interface Fiber
interface Fiber {}
property actualDuration
actualDuration?: number;
property actualStartTime
actualStartTime?: number;
property alternate
alternate: Fiber | null;
property child
child: Fiber | null;
property childLanes
childLanes: Lanes;
property deletions
deletions: Fiber[] | null;
property dependencies
dependencies: Dependencies | null;
property elementType
elementType: any;
property firstEffect
firstEffect: Fiber | null;
property flags
flags: Flags;
property index
index: number;
property key
key: null | string;
property lanes
lanes: Lanes;
property lastEffect
lastEffect: Fiber | null;
property memoizedProps
memoizedProps: any;
property memoizedState
memoizedState: any;
property mode
mode: TypeOfMode;
property nextEffect
nextEffect: Fiber | null;
property pendingProps
pendingProps: any;
property ref
ref: | null | (((handle: unknown) => void) & { _stringRef?: string | null; }) | RefObject;
property return
return: Fiber | null;
property selfBaseDuration
selfBaseDuration?: number;
property sibling
sibling: Fiber | null;
property stateNode
stateNode: any;
property subtreeFlags
subtreeFlags: Flags;
property tag
tag: WorkTag;
property treeBaseDuration
treeBaseDuration?: number;
property type
type: any;
property updateQueue
updateQueue: unknown;
interface HasPseudoClassSelector
interface HasPseudoClassSelector {}
interface HostConfig
interface HostConfig< Type, Props, Container, Instance, TextInstance, SuspenseInstance, HydratableInstance, FormInstance, PublicInstance, HostContext, ChildSet, TimeoutHandle, NoTimeout, TransitionStatus> {}
property HostTransitionContext
HostTransitionContext: ReactContext<TransitionStatus>;
property isPrimaryRenderer
isPrimaryRenderer: boolean;
This is a property (not a function) that should be set to
true
if your renderer is the main one on the page. For example, if you're writing a renderer for the Terminal, it makes sense to set it totrue
, but if your renderer is used *on top of* React DOM or some other existing renderer, set it tofalse
.
property noTimeout
noTimeout: NoTimeout;
This is a property (not a function) that should be set to something that can never be a valid timeout ID. For example, you can set it to
-1
.
property NotPendingTransition
NotPendingTransition: TransitionStatus | null;
property supportsHydration
supportsHydration: boolean;
property supportsMicrotasks
supportsMicrotasks?: boolean;
Set this to true to indicate that your renderer supports
scheduleMicrotask
. We use microtasks as part of our discrete event implementation in React DOM. If you're not sure if your renderer should support this, you probably should. The option to not implementscheduleMicrotask
exists so that platforms with more control over user events, like React Native, can choose to use a different mechanism.
property supportsMutation
supportsMutation: boolean;
The reconciler has two modes: mutation mode and persistent mode. You must specify one of them.
If your target platform is similar to the DOM and has methods similar to
appendChild
,removeChild
, and so on, you'll want to use the **mutation mode**. This is the same mode used by React DOM, React ART, and the classic React Native renderer.const HostConfig = {// ...supportsMutation: true,// ...}Depending on the mode, the reconciler will call different methods on your host config.
If you're not sure which one you want, you likely need the mutation mode.
property supportsPersistence
supportsPersistence: boolean;
The reconciler has two modes: mutation mode and persistent mode. You must specify one of them.
If your target platform has immutable trees, you'll want the **persistent mode** instead. In that mode, existing nodes are never mutated, and instead every change clones the parent tree and then replaces the whole parent tree at the root. This is the node used by the new React Native renderer, codenamed "Fabric".
const HostConfig = {// ...supportsPersistence: true,// ...}Depending on the mode, the reconciler will call different methods on your host config.
If you're not sure which one you want, you likely need the mutation mode.
property warnsIfNotActing
warnsIfNotActing?: boolean;
Whether the renderer shouldn't trigger missing
act()
warnings
method afterActiveInstanceBlur
afterActiveInstanceBlur: () => void;
method appendChild
appendChild: (parentInstance: Instance, child: Instance | TextInstance) => void;
This method should mutate the
parentInstance
and add the child to its list of children. For example, in the DOM this would translate to aparentInstance.appendChild(child)
call.Although this method currently runs in the commit phase, you still should not mutate any other nodes in it. If you need to do some additional work when a node is definitely connected to the visible tree, look at
commitMount
.
method appendChildToContainer
appendChildToContainer: ( container: Container, child: Instance | TextInstance) => void;
Same as
appendChild
, but for when a node is attached to the root container. This is useful if attaching to the root has a slightly different implementation, or if the root container nodes are of a different type than the rest of the tree.
method appendChildToContainerChildSet
appendChildToContainerChildSet: ( childSet: ChildSet, child: Instance | TextInstance) => void;
method appendInitialChild
appendInitialChild: ( parentInstance: Instance, child: Instance | TextInstance) => void;
This method should mutate the
parentInstance
and add the child to its list of children. For example, in the DOM this would translate to aparentInstance.appendChild(child)
call.This method happens **in the render phase**. It can mutate
parentInstance
andchild
, but it must not modify any other nodes. It's called while the tree is still being built up and not connected to the actual tree on the screen.
method beforeActiveInstanceBlur
beforeActiveInstanceBlur: () => void;
method cancelTimeout
cancelTimeout: (id: TimeoutHandle) => void;
You can proxy this to
clearTimeout
or its equivalent in your environment.
method canHydrateInstance
canHydrateInstance: ( instance: HydratableInstance, type: Type, props: Props) => null | Instance;
method canHydrateSuspenseInstance
canHydrateSuspenseInstance: ( instance: HydratableInstance) => null | SuspenseInstance;
method canHydrateTextInstance
canHydrateTextInstance: ( instance: HydratableInstance, text: string) => null | TextInstance;
method clearContainer
clearContainer: (container: Container) => void;
This method should mutate the
container
root node and remove all children from it.
method cloneHiddenInstance
cloneHiddenInstance: ( instance: Instance, type: Type, props: Props, internalInstanceHandle: OpaqueHandle) => Instance;
method cloneHiddenTextInstance
cloneHiddenTextInstance: ( instance: Instance, text: Type, internalInstanceHandle: OpaqueHandle) => TextInstance;
method cloneInstance
cloneInstance: ( instance: Instance, type: Type, oldProps: Props, newProps: Props, internalInstanceHandle: OpaqueHandle, keepChildren: boolean, recyclableInstance: null | Instance) => Instance;
method commitHydratedContainer
commitHydratedContainer: (container: Container) => void;
method commitHydratedSuspenseInstance
commitHydratedSuspenseInstance: (suspenseInstance: SuspenseInstance) => void;
method commitMount
commitMount: ( instance: Instance, type: Type, props: Props, internalInstanceHandle: OpaqueHandle) => void;
This method is only called if you returned
true
fromfinalizeInitialChildren
for this instance.It lets you do some additional work after the node is actually attached to the tree on the screen for the first time. For example, the DOM renderer uses it to trigger focus on nodes with the
autoFocus
attribute.Note that
commitMount
does not mirrorremoveChild
one to one becauseremoveChild
is only called for the top-level removed node. This is why ideallycommitMount
should not mutate any nodes other than theinstance
itself. For example, if it registers some events on some node above, it will be your responsibility to traverse the tree inremoveChild
and clean them up, which is not ideal.The
internalHandle
data structure is meant to be opaque. If you bend the rules and rely on its internal fields, be aware that it may change significantly between versions. You're taking on additional maintenance risk by reading from it, and giving up all guarantees if you write something to it.If you never return
true
fromfinalizeInitialChildren
, you can leave it empty.
method commitTextUpdate
commitTextUpdate: ( textInstance: TextInstance, oldText: string, newText: string) => void;
This method should mutate the
textInstance
and update its text content tonextText
.Here,
textInstance
is a node created bycreateTextInstance
.
method commitUpdate
commitUpdate: ( instance: Instance, type: Type, prevProps: Props, nextProps: Props, internalHandle: OpaqueHandle) => void;
This method should mutate the instance to match nextProps.
The internalHandle data structure is meant to be opaque. If you bend the rules and rely on its internal fields, be aware that it may change significantly between versions. You're taking on additional maintenance risk by reading from it, and giving up all guarantees if you write something to it.
method createContainerChildSet
createContainerChildSet: (container: Container) => ChildSet;
method createInstance
createInstance: ( type: Type, props: Props, rootContainer: Container, hostContext: HostContext, internalHandle: OpaqueHandle) => Instance;
This method should return a newly created node. For example, the DOM renderer would call
document.createElement(type)
here and then set the properties fromprops
.You can use
rootContainer
to access the root container associated with that tree. For example, in the DOM renderer, this is useful to get the correctdocument
reference that the root belongs to.The
hostContext
parameter lets you keep track of some information about your current place in the tree. To learn more about it, seegetChildHostContext
below.The
internalHandle
data structure is meant to be opaque. If you bend the rules and rely on its internal fields, be aware that it may change significantly between versions. You're taking on additional maintenance risk by reading from it, and giving up all guarantees if you write something to it.This method happens **in the render phase**. It can (and usually should) mutate the node it has just created before returning it, but it must not modify any other nodes. It must not register any event handlers on the parent tree. This is because an instance being created doesn't guarantee it would be placed in the tree — it could be left unused and later collected by GC. If you need to do something when an instance is definitely in the tree, look at
commitMount
instead.
method createTextInstance
createTextInstance: ( text: string, rootContainer: Container, hostContext: HostContext, internalHandle: OpaqueHandle) => TextInstance;
Same as
createInstance
, but for text nodes. If your renderer doesn't support text nodes, you can throw here.
method detachDeletedInstance
detachDeletedInstance: (node: Instance) => void;
method didNotFindHydratableContainerInstance
didNotFindHydratableContainerInstance: ( parentContainer: Container, type: Type, props: Props) => void;
method didNotFindHydratableContainerSuspenseInstance
didNotFindHydratableContainerSuspenseInstance: ( parentContainer: Container) => void;
method didNotFindHydratableContainerTextInstance
didNotFindHydratableContainerTextInstance: ( parentContainer: Container, text: string) => void;
method didNotFindHydratableInstance
didNotFindHydratableInstance: ( parentType: Type, parentProps: Props, parentInstance: Instance, type: Type, props: Props) => void;
method didNotFindHydratableSuspenseInstance
didNotFindHydratableSuspenseInstance: ( parentType: Type, parentProps: Props, parentInstance: Instance) => void;
method didNotFindHydratableTextInstance
didNotFindHydratableTextInstance: ( parentType: Type, parentProps: Props, parentInstance: Instance, text: string) => void;
method didNotHydrateContainerInstance
didNotHydrateContainerInstance: ( parentContainer: Container, instance: HydratableInstance) => void;
method didNotHydrateInstance
didNotHydrateInstance: ( parentType: Type, parentProps: Props, parentInstance: Instance, instance: HydratableInstance) => void;
method didNotMatchHydratedContainerTextInstance
didNotMatchHydratedContainerTextInstance: ( parentContainer: Container, textInstance: TextInstance, text: string) => void;
method didNotMatchHydratedTextInstance
didNotMatchHydratedTextInstance: ( parentType: Type, parentProps: Props, parentInstance: Instance, textInstance: TextInstance, text: string) => void;
method errorHydratingContainer
errorHydratingContainer: (parentContainer: Container) => void;
method finalizeContainerChildren
finalizeContainerChildren: (container: Container, newChildren: ChildSet) => void;
method finalizeInitialChildren
finalizeInitialChildren: ( instance: Instance, type: Type, props: Props, rootContainer: Container, hostContext: HostContext) => boolean;
In this method, you can perform some final mutations on the
instance
. Unlike withcreateInstance
, by the timefinalizeInitialChildren
is called, all the initial children have already been added to theinstance
, but the instance itself has not yet been connected to the tree on the screen.This method happens **in the render phase**. It can mutate
instance
, but it must not modify any other nodes. It's called while the tree is still being built up and not connected to the actual tree on the screen.There is a second purpose to this method. It lets you specify whether there is some work that needs to happen when the node is connected to the tree on the screen. If you return
true
, the instance will receive acommitMount
call later. See its documentation below.If you don't want to do anything here, you should return
false
.
method getChildHostContext
getChildHostContext: ( parentHostContext: HostContext, type: Type, rootContainer: Container) => HostContext;
Host context lets you track some information about where you are in the tree so that it's available inside
createInstance
as thehostContext
parameter. For example, the DOM renderer uses it to track whether it's inside an HTML or an SVG tree, becausecreateInstance
implementation needs to be different for them.If the node of this
type
does not influence the context you want to pass down, you can returnparentHostContext
. Alternatively, you can return any custom object representing the information you want to pass down.If you don't want to do anything here, return
parentHostContext
.This method happens **in the render phase**. Do not mutate the tree from it.
method getCurrentUpdatePriority
getCurrentUpdatePriority: () => EventPriority;
method getFirstHydratableChild
getFirstHydratableChild: ( parentInstance: Container | Instance) => null | HydratableInstance;
method getInstanceFromNode
getInstanceFromNode: (node: any) => Fiber | null | undefined;
method getInstanceFromScope
getInstanceFromScope: (scopeInstance: any) => null | Instance;
method getNextHydratableInstanceAfterSuspenseInstance
getNextHydratableInstanceAfterSuspenseInstance: ( suspenseInstance: SuspenseInstance) => null | HydratableInstance;
method getNextHydratableSibling
getNextHydratableSibling: ( instance: HydratableInstance) => null | HydratableInstance;
method getParentSuspenseInstance
getParentSuspenseInstance: (targetInstance: any) => null | SuspenseInstance;
method getPublicInstance
getPublicInstance: (instance: Instance | TextInstance) => PublicInstance;
Determines what object gets exposed as a ref. You'll likely want to return the
instance
itself. But in some cases it might make sense to only expose some part of it.If you don't want to do anything here, return
instance
.
method getRootHostContext
getRootHostContext: (rootContainer: Container) => HostContext | null;
This method lets you return the initial host context from the root of the tree. See
getChildHostContext
for the explanation of host context.If you don't intend to use host context, you can return
null
.This method happens **in the render phase**. Do not mutate the tree from it.
method hideInstance
hideInstance: (instance: Instance) => void;
This method should make the
instance
invisible without removing it from the tree. For example, it can apply visual styling to hide it. It is used by Suspense to hide the tree while the fallback is visible.
method hideTextInstance
hideTextInstance: (textInstance: TextInstance) => void;
Same as
hideInstance
, but for nodes created bycreateTextInstance
.
method hydrateInstance
hydrateInstance: ( instance: Instance, type: Type, props: Props, rootContainerInstance: Container, hostContext: HostContext, internalInstanceHandle: any) => null | any[];
method hydrateSuspenseInstance
hydrateSuspenseInstance: ( suspenseInstance: SuspenseInstance, internalInstanceHandle: any) => void;
method hydrateTextInstance
hydrateTextInstance: ( textInstance: TextInstance, text: string, internalInstanceHandle: any) => boolean;
method insertBefore
insertBefore: ( parentInstance: Instance, child: Instance | TextInstance, beforeChild: Instance | TextInstance | SuspenseInstance) => void;
This method should mutate the
parentInstance
and place thechild
beforebeforeChild
in the list of its children. For example, in the DOM this would translate to aparentInstance.insertBefore(child, beforeChild)
call.Note that React uses this method both for insertions and for reordering nodes. Similar to DOM, it is expected that you can call
insertBefore
to reposition an existing child. Do not mutate any other parts of the tree from it.
method insertInContainerBefore
insertInContainerBefore: ( container: Container, child: Instance | TextInstance, beforeChild: Instance | TextInstance | SuspenseInstance) => void;
Same as
insertBefore
, but for when a node is attached to the root container. This is useful if attaching to the root has a slightly different implementation, or if the root container nodes are of a different type than the rest of the tree.
method isSuspenseInstanceFallback
isSuspenseInstanceFallback: (instance: SuspenseInstance) => boolean;
method isSuspenseInstancePending
isSuspenseInstancePending: (instance: SuspenseInstance) => boolean;
method maySuspendCommit
maySuspendCommit: (type: Type, props: Props) => boolean;
This method is called during render to determine if the Host Component type and props require some kind of loading process to complete before committing an update.
method preloadInstance
preloadInstance: (type: Type, props: Props) => boolean;
This method may be called during render if the Host Component type and props might suspend a commit. It can be used to initiate any work that might shorten the duration of a suspended commit.
method prepareForCommit
prepareForCommit: (containerInfo: Container) => Record<string, any> | null;
This method lets you store some information before React starts making changes to the tree on the screen. For example, the DOM renderer stores the current text selection so that it can later restore it. This method is mirrored by
resetAfterCommit
.Even if you don't want to do anything here, you need to return
null
from it.
method preparePortalMount
preparePortalMount: (containerInfo: Container) => void;
This method is called for a container that's used as a portal target. Usually you can leave it empty.
method prepareScopeUpdate
prepareScopeUpdate: (scopeInstance: any, instance: any) => void;
method registerSuspenseInstanceRetry
registerSuspenseInstanceRetry: ( instance: SuspenseInstance, callback: () => void) => void;
method removeChild
removeChild: ( parentInstance: Instance, child: Instance | TextInstance | SuspenseInstance) => void;
This method should mutate the
parentInstance
to remove thechild
from the list of its children.React will only call it for the top-level node that is being removed. It is expected that garbage collection would take care of the whole subtree. You are not expected to traverse the child tree in it.
method removeChildFromContainer
removeChildFromContainer: ( container: Container, child: Instance | TextInstance | SuspenseInstance) => void;
Same as
removeChild
, but for when a node is detached from the root container. This is useful if attaching to the root has a slightly different implementation, or if the root container nodes are of a different type than the rest of the tree.
method replaceContainerChildren
replaceContainerChildren: (container: Container, newChildren: ChildSet) => void;
method requestPostPaintCallback
requestPostPaintCallback: (callback: (time: number) => void) => void;
method resetAfterCommit
resetAfterCommit: (containerInfo: Container) => void;
This method is called right after React has performed the tree mutations. You can use it to restore something you've stored in
prepareForCommit
— for example, text selection.You can leave it empty.
method resetFormInstance
resetFormInstance: (form: FormInstance) => void;
method resetTextContent
resetTextContent: (instance: Instance) => void;
If you returned
true
fromshouldSetTextContent
for the previous props, but returnedfalse
fromshouldSetTextContent
for the next props, React will call this method so that you can clear the text content you were managing manually. For example, in the DOM you could setnode.textContent = ''
.If you never return
true
fromshouldSetTextContent
, you can leave it empty.
method resolveEventTimeStamp
resolveEventTimeStamp: () => number;
method resolveEventType
resolveEventType: () => null | string;
method resolveUpdatePriority
resolveUpdatePriority: () => EventPriority;
method scheduleMicrotask
scheduleMicrotask: (fn: () => unknown) => void;
Optional. You can proxy this to
queueMicrotask
or its equivalent in your environment.
method scheduleTimeout
scheduleTimeout: ( fn: (...args: unknown[]) => unknown, delay?: number) => TimeoutHandle;
You can proxy this to
setTimeout
or its equivalent in your environment.
method setCurrentUpdatePriority
setCurrentUpdatePriority: (newPriority: EventPriority) => void;
method shouldAttemptEagerTransition
shouldAttemptEagerTransition: () => boolean;
method shouldSetTextContent
shouldSetTextContent: (type: Type, props: Props) => boolean;
Some target platforms support setting an instance's text content without manually creating a text node. For example, in the DOM, you can set
node.textContent
instead of creating a text node and appending it.If you return
true
from this method, React will assume that this node's children are text, and will not create nodes for them. It will instead rely on you to have filled that text duringcreateInstance
. This is a performance optimization. For example, the DOM renderer returnstrue
only iftype
is a known text-only parent (like'textarea'
) or ifprops.children
has a'string'
type. If you returntrue
, you will need to implementresetTextContent
too.If you don't want to do anything here, you should return
false
.This method happens **in the render phase**. Do not mutate the tree from it.
method startSuspendingCommit
startSuspendingCommit: () => void;
This method is called just before the commit phase. Use it to set up any necessary state while any Host Components that might suspend this commit are evaluated to determine if the commit must be suspended.
method suspendInstance
suspendInstance: (type: Type, props: Props) => void;
This method is called after
startSuspendingCommit
for each Host Component that indicated it might suspend a commit.
method trackSchedulerEvent
trackSchedulerEvent: () => void;
method unhideInstance
unhideInstance: (instance: Instance, props: Props) => void;
This method should make the
instance
visible, undoing whathideInstance
did.
method unhideTextInstance
unhideTextInstance: (textInstance: TextInstance, text: string) => void;
Same as
unhideInstance
, but for nodes created bycreateTextInstance
.
method waitForCommitToBeReady
waitForCommitToBeReady: () => ( initiateCommit: (...args: unknown[]) => unknown) => (...args: unknown[]) => unknown;
This method is called after all
suspendInstance
calls are complete.Return
null
if the commit can happen immediately.Return
(initiateCommit: Function) => Function
if the commit must be suspended. The argument to this callback will initiate the commit when called. The return value is a cancellation function that the Reconciler can use to abort the commit.
interface ReactConsumer
interface ReactConsumer<T> {}
interface ReactContext
interface ReactContext<T> {}
property $$typeof
$$typeof: symbol | number;
property Consumer
Consumer: ReactContext<T>;
property displayName
displayName?: string;
property Provider
Provider: ReactProviderType<T>;
interface ReactPortal
interface ReactPortal {}
property $$typeof
$$typeof: symbol | number;
property children
children: ReactNode;
property containerInfo
containerInfo: any;
property implementation
implementation: any;
property key
key: null | string;
interface ReactProvider
interface ReactProvider<T> {}
interface ReactProviderType
interface ReactProviderType<T> {}
property $$typeof
$$typeof: symbol | number;
interface Reconciler
interface Reconciler< Container, Instance, TextInstance, SuspenseInstance, FormInstance, PublicInstance> {}
method attemptContinuousHydration
attemptContinuousHydration: (fiber: Fiber) => void;
method attemptDiscreteHydration
attemptDiscreteHydration: (fiber: Fiber) => void;
method attemptHydrationAtCurrentPriority
attemptHydrationAtCurrentPriority: (fiber: Fiber) => void;
method attemptSynchronousHydration
attemptSynchronousHydration: (fiber: Fiber) => void;
method batchedUpdates
batchedUpdates: <A, R>(fn: (a: A) => R, a: A) => R;
method createComponentSelector
createComponentSelector: ( component: React$AbstractComponent<never, unknown>) => ComponentSelector;
method createContainer
createContainer: ( containerInfo: Container, tag: RootTag, hydrationCallbacks: null | SuspenseHydrationCallbacks<SuspenseInstance>, isStrictMode: boolean, concurrentUpdatesByDefaultOverride: null | boolean, identifierPrefix: string, onRecoverableError: (error: Error) => void, transitionCallbacks: null | TransitionTracingCallbacks) => OpaqueRoot;
method createHasPseudoClassSelector
createHasPseudoClassSelector: (selectors: Selector[]) => HasPseudoClassSelector;
method createHydrationContainer
createHydrationContainer: ( initialChildren: ReactNode, callback: (() => void) | null | undefined, containerInfo: Container, tag: RootTag, hydrationCallbacks: null | SuspenseHydrationCallbacks<SuspenseInstance>, isStrictMode: boolean, concurrentUpdatesByDefaultOverride: null | boolean, identifierPrefix: string, onRecoverableError: (error: Error) => void, transitionCallbacks: null | TransitionTracingCallbacks) => OpaqueRoot;
method createPortal
createPortal: ( children: ReactNode, containerInfo: any, implementation: any, key?: string | null) => ReactPortal;
method createRoleSelector
createRoleSelector: (role: string) => RoleSelector;
method createTestNameSelector
createTestNameSelector: (id: string) => TestNameSelector;
method createTextSelector
createTextSelector: (text: string) => TextSelector;
method deferredUpdates
deferredUpdates: <A>(fn: () => A) => A;
method discreteUpdates
discreteUpdates: <A, B, C, D, R>( fn: (arg0: A, arg1: B, arg2: C, arg3: D) => R, a: A, b: B, c: C, d: D) => R;
method findAllNodes
findAllNodes: (hostRoot: Instance, selectors: Selector[]) => Instance[];
method findBoundingRects
findBoundingRects: (hostRoot: Instance, selectors: Selector[]) => BoundingRect[];
method findHostInstance
findHostInstance: (component: any) => PublicInstance | null;
method findHostInstanceWithNoPortals
findHostInstanceWithNoPortals: (fiber: Fiber) => PublicInstance | null;
method findHostInstanceWithWarning
findHostInstanceWithWarning: ( component: any, methodName: string) => PublicInstance | null;
method flushControlled
flushControlled: (fn: () => any) => void;
method flushPassiveEffects
flushPassiveEffects: () => boolean;
method flushSync
flushSync: { (): void; <R>(fn: () => R): R };
method focusWithin
focusWithin: (hostRoot: Instance, selectors: Selector[]) => boolean;
method getCurrentUpdatePriority
getCurrentUpdatePriority: () => LanePriority;
method getFindAllNodesFailureDescription
getFindAllNodesFailureDescription: ( hostRoot: Instance, selectors: Selector[]) => string | null;
method getPublicRootInstance
getPublicRootInstance: ( container: OpaqueRoot) => Component<any, any> | PublicInstance | null;
method injectIntoDevTools
injectIntoDevTools: ( devToolsConfig: DevToolsConfig<Instance, TextInstance, any>) => boolean;
method isAlreadyRendering
isAlreadyRendering: () => boolean;
method observeVisibleRects
observeVisibleRects: ( hostRoot: Instance, selectors: Selector[], callback: ( intersections: Array<{ ratio: number; rect: BoundingRect }> ) => void, options?: IntersectionObserverOptions) => { disconnect: () => void };
method registerMutableSourceForHydration
registerMutableSourceForHydration: ( root: FiberRoot, mutableSource: MutableSource) => void;
method runWithPriority
runWithPriority: <T>(priority: LanePriority, fn: () => T) => T;
method shouldError
shouldError: (fiber: Fiber) => boolean | undefined;
method shouldSuspend
shouldSuspend: (fiber: Fiber) => boolean;
method updateContainer
updateContainer: ( element: ReactNode, container: OpaqueRoot, parentComponent?: Component<any, any> | null, callback?: (() => void) | null) => Lane;
interface RoleSelector
interface RoleSelector {}
interface Source
interface Source {}
property fileName
fileName: string;
property lineNumber
lineNumber: number;
interface SuspenseHydrationCallbacks
interface SuspenseHydrationCallbacks<SuspenseInstance> {}
property onDeleted
onDeleted?: (suspenseInstance: SuspenseInstance) => void;
property onHydrated
onHydrated?: (suspenseInstance: SuspenseInstance) => void;
interface TestNameSelector
interface TestNameSelector {}
interface TextSelector
interface TextSelector {}
interface Thenable
interface Thenable<T> {}
method then
then: (resolve: () => T, reject?: () => T) => T;
interface TransitionTracingCallbacks
interface TransitionTracingCallbacks {}
property onMarkerComplete
onMarkerComplete?: ( transitionName: string, marker: string, startTime: number, endTime: number) => void;
property onMarkerIncomplete
onMarkerIncomplete?: ( transitionName: string, marker: string, startTime: number, deletions: Array<{ type: string; name?: string; newName?: string; endTime: number; }>) => void;
property onMarkerProgress
onMarkerProgress?: ( transitionName: string, marker: string, startTime: number, currentTime: number, pending: Array<{ name: null | string }>) => void;
property onTransitionComplete
onTransitionComplete?: ( transitionName: string, startTime: number, endTime: number) => void;
property onTransitionIncomplete
onTransitionIncomplete?: ( transitionName: string, startTime: number, deletions: Array<{ type: string; name?: string; newName?: string; endTime: number; }>) => void;
property onTransitionProgress
onTransitionProgress?: ( transitionName: string, startTime: number, currentTime: number, pending: Array<{ name: null | string }>) => void;
property onTransitionStart
onTransitionStart?: (transitionName: string, startTime: number) => void;
Type Aliases
type BundleType
type BundleType = 0 | 1;
type EventPriority
type EventPriority = number;
type FiberRoot
type FiberRoot = any;
type Flags
type Flags = number;
type HookType
type HookType = | 'useState' | 'useReducer' | 'useContext' | 'useRef' | 'useEffect' | 'useLayoutEffect' | 'useCallback' | 'useMemo' | 'useImperativeHandle' | 'useDebugValue' | 'useDeferredValue' | 'useTransition' | 'useMutableSource' | 'useOpaqueIdentifier' | 'useCacheRefresh';
type IntersectionObserverOptions
type IntersectionObserverOptions = any;
type Lane
type Lane = number;
type LanePriority
type LanePriority = | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17;
type Lanes
type Lanes = number;
type MutableSource
type MutableSource = any;
type OpaqueHandle
type OpaqueHandle = any;
type OpaqueRoot
type OpaqueRoot = any;
type React$AbstractComponent
type React$AbstractComponent<Config, Instance = any> = any;
type RootTag
type RootTag = 0 | 1 | 2;
type Selector
type Selector = | ComponentSelector | HasPseudoClassSelector | RoleSelector | TextSelector | TestNameSelector;
type TypeOfMode
type TypeOfMode = number;
type WorkTag
type WorkTag = | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24;
Package Files (1)
Dependencies (0)
No dependencies.
Dev Dependencies (0)
No dev dependencies.
Peer Dependencies (1)
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@types/react-reconciler
.
- Markdown[](https://www.jsdocs.io/package/@types/react-reconciler)
- HTML<a href="https://www.jsdocs.io/package/@types/react-reconciler"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 5250 ms. - Missing or incorrect documentation? Open an issue for this package.