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

scrollState.js — react Source File

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

File javascript BabelCompiler Validation 2 imports 7 dependents 7 functions

Entity Profile

Dependency Diagram

graph LR
  d0e34df5_54e0_bd63_7394_3bfe61a4c376["scrollState.js"]
  adc3924b_f490_6a42_b89a_7b496d5a55de["clamp.js"]
  d0e34df5_54e0_bd63_7394_3bfe61a4c376 --> adc3924b_f490_6a42_b89a_7b496d5a55de
  602ea433_ce95_7eee_6236_3ffd5c7bd98b["clamp"]
  d0e34df5_54e0_bd63_7394_3bfe61a4c376 --> 602ea433_ce95_7eee_6236_3ffd5c7bd98b
  d5e5a241_0d88_22ae_6561_9211ad78e796["CanvasPage.js"]
  d5e5a241_0d88_22ae_6561_9211ad78e796 --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  e0a3b260_ea80_6b59_5c7d_18081c4333a6["CanvasPageContextMenu.js"]
  e0a3b260_ea80_6b59_5c7d_18081c4333a6 --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  20cc2065_4b5b_fd6b_be12_28f36b0ff4cf["types.js"]
  20cc2065_4b5b_fd6b_be12_28f36b0ff4cf --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  651fe3e5_90b9_93e1_39f6_c335dae25ac7["HorizontalPanAndZoomView.js"]
  651fe3e5_90b9_93e1_39f6_c335dae25ac7 --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  be7fceed_f363_2288_8ab1_9e46ccc7de65["VerticalScrollView.js"]
  be7fceed_f363_2288_8ab1_9e46ccc7de65 --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  626126b2_61b3_20dc_e1ac_74cfd65b9d88["scrollState-test.js"]
  626126b2_61b3_20dc_e1ac_74cfd65b9d88 --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  9576b70a_cfcb_5729_1030_479df0856820["VerticalScrollOverflowView.js"]
  9576b70a_cfcb_5729_1030_479df0856820 --> d0e34df5_54e0_bd63_7394_3bfe61a4c376
  style d0e34df5_54e0_bd63_7394_3bfe61a4c376 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 {clamp} from './clamp';

/**
 * Single-axis offset and length state.
 *
 * ```
 * contentStart   containerStart  containerEnd   contentEnd
 *     |<----------offset|              |             |
 *     |<-------------------length------------------->|
 * ```
 */
export type ScrollState = {
  offset: number,
  length: number,
};

function clampOffset(state: ScrollState, containerLength: number): ScrollState {
  return {
    offset: clamp(-(state.length - containerLength), 0, state.offset),
    length: state.length,
  };
}

function clampLength({
  state,
  minContentLength,
  maxContentLength,
  containerLength,
}: {
  state: ScrollState,
  minContentLength: number,
  maxContentLength: number,
  containerLength: number,
}): ScrollState {
  return {
    offset: state.offset,
    length: clamp(
      Math.max(minContentLength, containerLength),
      Math.max(containerLength, maxContentLength),
      state.length,
    ),
  };
}

/**
 * Returns `state` clamped such that:
 * - `length`: you won't be able to zoom in/out such that the content is
 *   shorter than the `containerLength`.
 * - `offset`: content remains in `containerLength`.
 */
export function clampState({
// ... (147 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does scrollState.js do?
scrollState.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 scrollState.js?
scrollState.js defines 7 function(s): areScrollStatesEqual, clampLength, clampOffset, clampState, moveStateToRange, translateState, zoomState.
What does scrollState.js depend on?
scrollState.js imports 2 module(s): clamp, clamp.js.
What files import scrollState.js?
scrollState.js is imported by 7 file(s): CanvasPage.js, CanvasPageContextMenu.js, HorizontalPanAndZoomView.js, VerticalScrollOverflowView.js, VerticalScrollView.js, scrollState-test.js, types.js.
Where is scrollState.js in the architecture?
scrollState.js is located at packages/react-devtools-timeline/src/view-base/utils/scrollState.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-timeline/src/view-base/utils).

Analyze Your Own Codebase

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

Try Supermodel Free