cloneInstance() — react Function Reference

Architecture documentation for the cloneInstance() function in ReactFiberConfigFabric.js from the react codebase.

Function javascript BabelCompiler Validation

Entity Profile

BabelCompiler→ Validation→ cloneInstance() — react Function Reference

Dependency Diagram

graph TD
  dba628c0_8868_f5cf_62e3_a9bc76ef9b9a["cloneInstance()"]
  948a0d34_693c_c158_f23e_d41306507c72["ReactFiberConfigFabric.js"]
  dba628c0_8868_f5cf_62e3_a9bc76ef9b9a -->|defined in| 948a0d34_693c_c158_f23e_d41306507c72
  style dba628c0_8868_f5cf_62e3_a9bc76ef9b9a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-native-renderer/src/ReactFiberConfigFabric.js lines 451–504

export function cloneInstance(
  instance: Instance,
  type: string,
  oldProps: Props,
  newProps: Props,
  keepChildren: boolean,
  newChildSet: ?ChildSet,
): Instance {
  const viewConfig = instance.canonical.viewConfig;
  const updatePayload = diffAttributePayloads(
    oldProps,
    newProps,
    viewConfig.validAttributes,
  );
  // TODO: If the event handlers have changed, we need to update the current props
  // in the commit phase but there is no host config hook to do it yet.
  // So instead we hack it by updating it in the render phase.
  instance.canonical.currentProps = newProps;

  const node = instance.node;
  let clone;
  if (keepChildren) {
    if (updatePayload !== null) {
      clone = cloneNodeWithNewProps(node, updatePayload);
    } else {
      // No changes
      return instance;
    }
  } else {
    // If passChildrenWhenCloningPersistedNodes is enabled, children will be non-null
    if (newChildSet != null) {
      if (updatePayload !== null) {
        clone = cloneNodeWithNewChildrenAndProps(
          node,
          newChildSet,
          updatePayload,
        );
      } else {
        clone = cloneNodeWithNewChildren(node, newChildSet);
      }
    } else {
      if (updatePayload !== null) {
        clone = cloneNodeWithNewChildrenAndProps(node, updatePayload);
      } else {
        clone = cloneNodeWithNewChildren(node);
      }
    }
  }

  return {
    node: clone,
    canonical: instance.canonical,
  };
}