react Architecture Docs
Home / File/ EventTooltip.js — react Source File

EventTooltip.js — react Source File

Architecture documentation for EventTooltip.js, a javascript file in the react codebase. 10 imports, 1 dependents.

File javascript BabelCompiler Validation 10 imports 1 dependents 12 functions

Entity Profile

Dependency Diagram

graph LR
  57dc23c0_c74d_e09e_ad1f_116cb590a38c["EventTooltip.js"]
  bbc225e1_d450_ae58_6679_9240ebe54628["index.js"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> bbc225e1_d450_ae58_6679_9240ebe54628
  20cc2065_4b5b_fd6b_be12_28f36b0ff4cf["types.js"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> 20cc2065_4b5b_fd6b_be12_28f36b0ff4cf
  f4cf9100_74bc_5445_ffb5_84c37b555dd3["formatting.js"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> f4cf9100_74bc_5445_ffb5_84c37b555dd3
  7a7bab2a_0762_eb64_07af_7551fee380d1["formatDuration"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> 7a7bab2a_0762_eb64_07af_7551fee380d1
  5ec23e51_b01a_6d75_3953_f12a0c47408d["formatTimestamp"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> 5ec23e51_b01a_6d75_3953_f12a0c47408d
  9b5bb02f_1f54_393f_07e9_6f895ce3958a["trimString"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> 9b5bb02f_1f54_393f_07e9_6f895ce3958a
  8fb21ca8_170b_4b4c_4dd4_5e259db0c418["getBatchRange.js"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> 8fb21ca8_170b_4b4c_4dd4_5e259db0c418
  f5279a63_8e92_7f94_348e_4884b05fe786["useSmartTooltip.js"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> f5279a63_8e92_7f94_348e_4884b05fe786
  b8b858b7_2665_7076_7a6f_5b280dacdaa6["EventTooltip.css"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> b8b858b7_2665_7076_7a6f_5b280dacdaa6
  ac587885_e294_a1e9_b13f_5e7b920fdb42["react"]
  57dc23c0_c74d_e09e_ad1f_116cb590a38c --> ac587885_e294_a1e9_b13f_5e7b920fdb42
  d5e5a241_0d88_22ae_6561_9211ad78e796["CanvasPage.js"]
  d5e5a241_0d88_22ae_6561_9211ad78e796 --> 57dc23c0_c74d_e09e_ad1f_116cb590a38c
  style 57dc23c0_c74d_e09e_ad1f_116cb590a38c fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow
 */

import type {Point} from './view-base';
import type {
  FlamechartStackFrame,
  NativeEvent,
  NetworkMeasure,
  ReactComponentMeasure,
  ReactEventInfo,
  ReactMeasure,
  ReactMeasureType,
  SchedulingEvent,
  Snapshot,
  SuspenseEvent,
  ThrownError,
  TimelineData,
  UserTimingMark,
} from './types';

import * as React from 'react';
import {
  formatDuration,
  formatTimestamp,
  trimString,
  getSchedulingEventLabel,
} from './utils/formatting';
import {getBatchRange} from './utils/getBatchRange';
import useSmartTooltip from './utils/useSmartTooltip';
import styles from './EventTooltip.css';

const MAX_TOOLTIP_TEXT_LENGTH = 60;

type Props = {
  canvasRef: {current: HTMLCanvasElement | null},
  data: TimelineData,
  height: number,
  hoveredEvent: ReactEventInfo | null,
  origin: Point,
  width: number,
};

function getReactMeasureLabel(type: ReactMeasureType): string | null {
  switch (type) {
    case 'commit':
      return 'react commit';
    case 'render-idle':
      return 'react idle';
    case 'render':
      return 'react render';
    case 'layout-effects':
      return 'react layout effects';
    case 'passive-effects':
      return 'react passive effects';
// ... (454 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does EventTooltip.js do?
EventTooltip.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain, Validation subdomain.
What functions are defined in EventTooltip.js?
EventTooltip.js defines 12 function(s): EventTooltip, TooltipFlamechartNode, TooltipNativeEvent, TooltipNetworkMeasure, TooltipReactComponentMeasure, TooltipReactMeasure, TooltipSchedulingEvent, TooltipSnapshot, TooltipSuspenseEvent, TooltipThrownError, and 2 more.
What does EventTooltip.js depend on?
EventTooltip.js imports 10 module(s): EventTooltip.css, formatDuration, formatTimestamp, formatting.js, getBatchRange.js, index.js, react, trimString, and 2 more.
What files import EventTooltip.js?
EventTooltip.js is imported by 1 file(s): CanvasPage.js.
Where is EventTooltip.js in the architecture?
EventTooltip.js is located at packages/react-devtools-timeline/src/EventTooltip.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-timeline/src).

Analyze Your Own Codebase

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

Try Supermodel Free