createHierarchy() — react Function Reference

Architecture documentation for the createHierarchy() function in ReactNativeFiberInspector.js from the react codebase.

Function javascript BabelCompiler Validation calls 2

Entity Profile

BabelCompiler→ Validation→ createHierarchy() — react Function Reference

Dependency Diagram

graph TD
  9cfaa716_ad4d_47af_982b_53e1f7df89d7["createHierarchy()"]
  b96e6f5e_b1ed_ae54_d2fa_ae1632468aa8["ReactNativeFiberInspector.js"]
  9cfaa716_ad4d_47af_982b_53e1f7df89d7 -->|defined in| b96e6f5e_b1ed_ae54_d2fa_ae1632468aa8
  58cbc34d_7538_2bb7_3a44_4be6679d8639["getHostProps()"]
  9cfaa716_ad4d_47af_982b_53e1f7df89d7 -->|calls| 58cbc34d_7538_2bb7_3a44_4be6679d8639
  504aef00_0513_3316_fb99_9e268f03e589["getHostNode()"]
  9cfaa716_ad4d_47af_982b_53e1f7df89d7 -->|calls| 504aef00_0513_3316_fb99_9e268f03e589
  style 9cfaa716_ad4d_47af_982b_53e1f7df89d7 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-native-renderer/src/ReactNativeFiberInspector.js lines 39–62

  const createHierarchy = function (fiberHierarchy) {
    return fiberHierarchy.map(fiber => ({
      name: getComponentNameFromType(fiber.type),
      getInspectorData: () => {
        return {
          props: getHostProps(fiber),
          measure: callback => {
            // If this is Fabric, we'll find a shadow node and use that to measure.
            const hostFiber = findCurrentHostFiber(fiber);
            const node =
              hostFiber != null &&
              hostFiber.stateNode !== null &&
              hostFiber.stateNode.node;

            if (node) {
              nativeFabricUIManager.measure(node, callback);
            } else {
              return UIManager.measure(getHostNode(fiber), callback);
            }
          },
        };
      },
    }));
  };