update() — react Function Reference

Architecture documentation for the update() function in Overlay.js from the react codebase.

Function javascript BabelCompiler Validation calls 1 called by 1

Entity Profile

BabelCompiler→ Validation→ update() — react Function Reference

Dependency Diagram

graph TD
  9e063716_c791_abaa_dcb9_deeb564103d2["update()"]
  c07ce908_6e01_63cf_eb0b_03f500e4af54["OverlayRect"]
  9e063716_c791_abaa_dcb9_deeb564103d2 -->|defined in| c07ce908_6e01_63cf_eb0b_03f500e4af54
  ca452625_274e_0064_ef00_337501859e94["inspect()"]
  ca452625_274e_0064_ef00_337501859e94 -->|calls| 9e063716_c791_abaa_dcb9_deeb564103d2
  9d28a1e3_1388_22be_2119_74a897d38b73["boxWrap()"]
  9e063716_c791_abaa_dcb9_deeb564103d2 -->|calls| 9d28a1e3_1388_22be_2119_74a897d38b73
  style 9e063716_c791_abaa_dcb9_deeb564103d2 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js lines 59–85

  update(box: Rect, dims: any) {
    boxWrap(dims, 'margin', this.node);
    boxWrap(dims, 'border', this.border);
    boxWrap(dims, 'padding', this.padding);

    assign(this.content.style, {
      height:
        box.height -
        dims.borderTop -
        dims.borderBottom -
        dims.paddingTop -
        dims.paddingBottom +
        'px',
      width:
        box.width -
        dims.borderLeft -
        dims.borderRight -
        dims.paddingLeft -
        dims.paddingRight +
        'px',
    });

    assign(this.node.style, {
      top: box.top - dims.marginTop + 'px',
      left: box.left - dims.marginLeft + 'px',
    });
  }