Home / Function/ lowerJsxElement() — react Function Reference

lowerJsxElement() — react Function Reference

Architecture documentation for the lowerJsxElement() function in BuildHIR.ts from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  1528c000_44a0_3a3f_9b4e_59e31922fdd6["lowerJsxElement()"]
  e04c04d6_37a7_1dc3_7fae_7d07660d0af9["BuildHIR.ts"]
  1528c000_44a0_3a3f_9b4e_59e31922fdd6 -->|defined in| e04c04d6_37a7_1dc3_7fae_7d07660d0af9
  ace1177a_10b2_b870_31fd_da4aa845554c["lowerExpression()"]
  ace1177a_10b2_b870_31fd_da4aa845554c -->|calls| 1528c000_44a0_3a3f_9b4e_59e31922fdd6
  5bae3f87_1b76_e568_9b44_1d2fb59f73d8["lowerExpressionToTemporary()"]
  1528c000_44a0_3a3f_9b4e_59e31922fdd6 -->|calls| 5bae3f87_1b76_e568_9b44_1d2fb59f73d8
  041ca752_10c1_3cda_1f5c_02f44a01310e["invariant()"]
  1528c000_44a0_3a3f_9b4e_59e31922fdd6 -->|calls| 041ca752_10c1_3cda_1f5c_02f44a01310e
  72aeaa10_7d77_cb8d_cf4a_ab588ee6026c["trimJsxText()"]
  1528c000_44a0_3a3f_9b4e_59e31922fdd6 -->|calls| 72aeaa10_7d77_cb8d_cf4a_ab588ee6026c
  f1f0c182_09ad_b29e_b1ca_56f10046adff["lowerValueToTemporary()"]
  1528c000_44a0_3a3f_9b4e_59e31922fdd6 -->|calls| f1f0c182_09ad_b29e_b1ca_56f10046adff
  073c81a5_c389_d108_5b8f_4d6dc6eece83["push()"]
  1528c000_44a0_3a3f_9b4e_59e31922fdd6 -->|calls| 073c81a5_c389_d108_5b8f_4d6dc6eece83
  style 1528c000_44a0_3a3f_9b4e_59e31922fdd6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts lines 3337–3399

function lowerJsxElement(
  builder: HIRBuilder,
  exprPath: NodePath<
    | t.JSXText
    | t.JSXExpressionContainer
    | t.JSXSpreadChild
    | t.JSXElement
    | t.JSXFragment
  >,
): Place | null {
  const exprNode = exprPath.node;
  const exprLoc = exprNode.loc ?? GeneratedSource;
  if (exprPath.isJSXElement() || exprPath.isJSXFragment()) {
    return lowerExpressionToTemporary(builder, exprPath);
  } else if (exprPath.isJSXExpressionContainer()) {
    const expression = exprPath.get('expression');
    if (expression.isJSXEmptyExpression()) {
      return null;
    } else {
      CompilerError.invariant(expression.isExpression(), {
        reason: `(BuildHIR::lowerJsxElement) Expected Expression but found ${expression.type}!`,
        loc: expression.node.loc ?? GeneratedSource,
      });
      return lowerExpressionToTemporary(builder, expression);
    }
  } else if (exprPath.isJSXText()) {
    let text: string | null;
    if (builder.fbtDepth > 0) {
      /*
       * FBT whitespace normalization differs from standard JSX.
       * https://github.com/facebook/fbt/blob/0b4e0d13c30bffd0daa2a75715d606e3587b4e40/packages/babel-plugin-fbt/src/FbtUtil.js#L76-L87
       * Since the fbt transform runs after, let's just preserve all
       * whitespace in FBT subtrees as is.
       */
      text = exprPath.node.value;
    } else {
      text = trimJsxText(exprPath.node.value);
    }

    if (text === null) {
      return null;
    }
    const place = lowerValueToTemporary(builder, {
      kind: 'JSXText',
      value: text,
      loc: exprLoc,
    });
    return place;
  } else {
    builder.errors.push({
      reason: `(BuildHIR::lowerJsxElement) Unhandled JsxElement, got: ${exprPath.type}`,
      category: ErrorCategory.Todo,
      loc: exprPath.node.loc ?? null,
      suggestions: null,
    });
    const place = lowerValueToTemporary(builder, {
      kind: 'UnsupportedNode',
      node: exprNode,
      loc: exprLoc,
    });
    return place;
  }
}

Subdomains

Called By

Frequently Asked Questions

What does lowerJsxElement() do?
lowerJsxElement() is a function in the react codebase, defined in compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts.
Where is lowerJsxElement() defined?
lowerJsxElement() is defined in compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts at line 3337.
What does lowerJsxElement() call?
lowerJsxElement() calls 5 function(s): invariant, lowerExpressionToTemporary, lowerValueToTemporary, push, trimJsxText.
What calls lowerJsxElement()?
lowerJsxElement() is called by 1 function(s): lowerExpression.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free