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

useCanvasInteraction.js — react Source File

Architecture documentation for useCanvasInteraction.js, a javascript file in the react codebase. 4 imports, 7 dependents.

File javascript BabelCompiler Validation 4 imports 7 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  c31109e4_56cc_8bde_2f0a_c3a35a729719["useCanvasInteraction.js"]
  e8da2b1e_9364_3e49_3cd5_5694b61287b2["normalizeWheel.js"]
  c31109e4_56cc_8bde_2f0a_c3a35a729719 --> e8da2b1e_9364_3e49_3cd5_5694b61287b2
  1d481b0c_03e1_6f28_eff1_74d4566b3dc8["geometry.js"]
  c31109e4_56cc_8bde_2f0a_c3a35a729719 --> 1d481b0c_03e1_6f28_eff1_74d4566b3dc8
  8ae70c5a_e11f_0fb7_250c_919ca294b607["normalizeWheel"]
  c31109e4_56cc_8bde_2f0a_c3a35a729719 --> 8ae70c5a_e11f_0fb7_250c_919ca294b607
  ac587885_e294_a1e9_b13f_5e7b920fdb42["react"]
  c31109e4_56cc_8bde_2f0a_c3a35a729719 --> ac587885_e294_a1e9_b13f_5e7b920fdb42
  651fe3e5_90b9_93e1_39f6_c335dae25ac7["HorizontalPanAndZoomView.js"]
  651fe3e5_90b9_93e1_39f6_c335dae25ac7 --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  2fbafaf8_32f6_4129_38fc_89470d906d24["Surface.js"]
  2fbafaf8_32f6_4129_38fc_89470d906d24 --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  be7fceed_f363_2288_8ab1_9e46ccc7de65["VerticalScrollView.js"]
  be7fceed_f363_2288_8ab1_9e46ccc7de65 --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  82f60adf_9325_5735_ba06_dcbbfcf32cc9["View.js"]
  82f60adf_9325_5735_ba06_dcbbfcf32cc9 --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  6e3184c5_8737_3bc9_5c7e_598f40316d02["ResizableView.js"]
  6e3184c5_8737_3bc9_5c7e_598f40316d02 --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  b6da9a74_cd56_c43e_377b_37156f7faf8c["ResizeBarView.js"]
  b6da9a74_cd56_c43e_377b_37156f7faf8c --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  4a10df0d_a8e2_1549_3912_4d2e6db4d890["VerticalScrollBarView.js"]
  4a10df0d_a8e2_1549_3912_4d2e6db4d890 --> c31109e4_56cc_8bde_2f0a_c3a35a729719
  style c31109e4_56cc_8bde_2f0a_c3a35a729719 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 {NormalizedWheelDelta} from './utils/normalizeWheel';
import type {Point} from './geometry';

import {useEffect, useRef} from 'react';
import {normalizeWheel} from './utils/normalizeWheel';

export type ClickInteraction = {
  type: 'click',
  payload: {
    event: MouseEvent,
    location: Point,
  },
};
export type DoubleClickInteraction = {
  type: 'double-click',
  payload: {
    event: MouseEvent,
    location: Point,
  },
};
export type MouseDownInteraction = {
  type: 'mousedown',
  payload: {
    event: MouseEvent,
    location: Point,
  },
};
export type MouseMoveInteraction = {
  type: 'mousemove',
  payload: {
    event: MouseEvent,
    location: Point,
  },
};
export type MouseUpInteraction = {
  type: 'mouseup',
  payload: {
    event: MouseEvent,
    location: Point,
  },
};
export type WheelPlainInteraction = {
  type: 'wheel-plain',
  payload: {
    event: WheelEvent,
    location: Point,
    delta: NormalizedWheelDelta,
  },
};
export type WheelWithShiftInteraction = {
  type: 'wheel-shift',
// ... (195 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does useCanvasInteraction.js do?
useCanvasInteraction.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 useCanvasInteraction.js?
useCanvasInteraction.js defines 1 function(s): cacheFirstGetCanvasBoundingRect.
What does useCanvasInteraction.js depend on?
useCanvasInteraction.js imports 4 module(s): geometry.js, normalizeWheel, normalizeWheel.js, react.
What files import useCanvasInteraction.js?
useCanvasInteraction.js is imported by 7 file(s): HorizontalPanAndZoomView.js, ResizableView.js, ResizeBarView.js, Surface.js, VerticalScrollBarView.js, VerticalScrollView.js, View.js.
Where is useCanvasInteraction.js in the architecture?
useCanvasInteraction.js is located at packages/react-devtools-timeline/src/view-base/useCanvasInteraction.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-timeline/src/view-base).

Analyze Your Own Codebase

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

Try Supermodel Free