constants.js — react Source File

Architecture documentation for constants.js, a javascript file in the react codebase. 0 imports, 19 dependents.

File javascript BabelCompiler Validation 19 dependents 1 functions

Entity Profile

BabelCompiler→ Validation→ constants.js — react Source File

Dependency Diagram

graph LR
  eab2f8f4_2e4c_8e75_87d9_c7d9b524affb["constants.js"]
  d5e5a241_0d88_22ae_6561_9211ad78e796["CanvasPage.js"]
  d5e5a241_0d88_22ae_6561_9211ad78e796 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  7fd04d1f_8e14_be78_275b_49d4237a927b["Timeline.js"]
  7fd04d1f_8e14_be78_275b_49d4237a927b --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  264bd2ad_e2e5_86fa_8a9c_741f2a953c2f["ComponentMeasuresView.js"]
  264bd2ad_e2e5_86fa_8a9c_741f2a953c2f --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  d08702f1_e022_2394_00ee_ac0a9c33e2de["FlamechartView.js"]
  d08702f1_e022_2394_00ee_ac0a9c33e2de --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  259c9bd5_8e3e_fcc5_0448_afc1cd9d1e73["NativeEventsView.js"]
  259c9bd5_8e3e_fcc5_0448_afc1cd9d1e73 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  13604060_cb94_5e01_9368_0ead23d3891e["NetworkMeasuresView.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  7a7af6eb_0683_8d73_95cc_81cc7b37dc33["ReactMeasuresView.js"]
  7a7af6eb_0683_8d73_95cc_81cc7b37dc33 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  25e4583e_f456_f560_39a0_cd2c2a2ed857["SchedulingEventsView.js"]
  25e4583e_f456_f560_39a0_cd2c2a2ed857 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  db34ae2a_e9d8_b6b8_047c_808e38392dec["SnapshotsView.js"]
  db34ae2a_e9d8_b6b8_047c_808e38392dec --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  8ef7c873_9e8e_ccdf_ed63_88c7224b1bac["SuspenseEventsView.js"]
  8ef7c873_9e8e_ccdf_ed63_88c7224b1bac --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  54164963_cd24_4adc_3d98_1f5b00aa9db1["ThrownErrorsView.js"]
  54164963_cd24_4adc_3d98_1f5b00aa9db1 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  349c9f88_b0e3_7db5_ca62_e5f635fd40f2["TimeAxisMarkersView.js"]
  349c9f88_b0e3_7db5_ca62_e5f635fd40f2 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  f2ccabf0_51db_bb1d_d1c0_68e969b44b5f["UserTimingMarksView.js"]
  f2ccabf0_51db_bb1d_d1c0_68e969b44b5f --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  021281ec_8833_1644_b4c0_b06b07634697["text.js"]
  021281ec_8833_1644_b4c0_b06b07634697 --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  style eab2f8f4_2e4c_8e75_87d9_c7d9b524affb 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
 */

export const DPR: number = window.devicePixelRatio || 1;
export const LABEL_SIZE = 80;
export const MARKER_HEIGHT = 20;
export const MARKER_TICK_HEIGHT = 8;
export const FONT_SIZE = 10;
export const MARKER_TEXT_PADDING = 8;
export const COLOR_HOVER_DIM_DELTA = 5;
export const TOP_ROW_PADDING = 4;
export const NATIVE_EVENT_HEIGHT = 14;
export const SUSPENSE_EVENT_HEIGHT: number = 14;
export const PENDING_SUSPENSE_EVENT_SIZE = 8;
export const REACT_EVENT_DIAMETER = 6;
export const USER_TIMING_MARK_SIZE = 8;
export const REACT_MEASURE_HEIGHT = 14;
export const BORDER_SIZE = 1 / DPR;
export const FLAMECHART_FRAME_HEIGHT = 14;
export const TEXT_PADDING = 3;
export const SNAPSHOT_SCRUBBER_SIZE = 3;

export const INTERVAL_TIMES = [
  1, 2, 5, 10, 20, 50, 100, 200, 500, 1000, 2000, 5000,
];
export const MIN_INTERVAL_SIZE_PX = 70;

// TODO Replace this with "export let" vars
export let COLORS: {
  BACKGROUND: string,
  INTERNAL_MODULE_FRAME: string,
  INTERNAL_MODULE_FRAME_HOVER: string,
  INTERNAL_MODULE_FRAME_TEXT: string,
  NATIVE_EVENT: string,
  NATIVE_EVENT_HOVER: string,
  NETWORK_PRIMARY: string,
  NETWORK_PRIMARY_HOVER: string,
  NETWORK_SECONDARY: string,
  NETWORK_SECONDARY_HOVER: string,
  PRIORITY_BACKGROUND: string,
  PRIORITY_BORDER: string,
  PRIORITY_LABEL: string,
  REACT_COMMIT: string,
  REACT_COMMIT_HOVER: string,
  REACT_COMMIT_TEXT: string,
  REACT_IDLE: string,
  REACT_IDLE_HOVER: string,
  REACT_LAYOUT_EFFECTS: string,
  REACT_LAYOUT_EFFECTS_HOVER: string,
  REACT_LAYOUT_EFFECTS_TEXT: string,
  REACT_PASSIVE_EFFECTS: string,
  REACT_PASSIVE_EFFECTS_HOVER: string,
  REACT_PASSIVE_EFFECTS_TEXT: string,
  REACT_RENDER: string,
// ... (249 more lines)

Domain

BabelCompiler

Subdomains

Validation

Functions

updateColorsToMatchTheme()

Imported By

Source

View on GitHub

Frequently Asked Questions

What does constants.js do?

constants.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 constants.js?

constants.js defines 1 function(s): updateColorsToMatchTheme.

What files import constants.js?

constants.js is imported by 19 file(s): BackgroundColorView.js, CanvasPage.js, ComponentMeasuresView.js, FlamechartView.js, NativeEventsView.js, NetworkMeasuresView.js, ReactMeasuresView.js, ResizeBarView.js, and 11 more.

Where is constants.js in the architecture?

constants.js is located at packages/react-devtools-timeline/src/content-views/constants.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-timeline/src/content-views).

Analyze Your Own Codebase

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

Try Supermodel Free