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

OwnersStack.js — react Source File

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

File javascript BabelCompiler Validation 17 imports 1 dependents 3 functions

Entity Profile

Dependency Diagram

graph LR
  4e5b4a1f_694c_f426_36e2_a03da99b38d5["OwnersStack.js"]
  f9049b08_60f8_abce_a6a6_153f88447124["Button.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> f9049b08_60f8_abce_a6a6_153f88447124
  f71ee326_17f0_7db4_4178_2763fb1c2ad1["Button"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> f71ee326_17f0_7db4_4178_2763fb1c2ad1
  9f39024f_b905_9b0f_2fc7_e24785732638["ButtonIcon.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 9f39024f_b905_9b0f_2fc7_e24785732638
  4690d9c0_cb81_9593_7817_f9e61a49f9e7["ButtonIcon"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 4690d9c0_cb81_9593_7817_f9e61a49f9e7
  61c0d244_ab84_2e1a_7b19_996aebeb6c63["Toggle.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 61c0d244_ab84_2e1a_7b19_996aebeb6c63
  ad68b45d_879b_b053_fa18_da49ca05b77a["Toggle"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> ad68b45d_879b_b053_fa18_da49ca05b77a
  25e89372_6558_2e4a_04f5_2e343e42cde5["ElementBadges.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 25e89372_6558_2e4a_04f5_2e343e42cde5
  dcddba19_583a_b531_9a4f_941e70dcbf0a["ElementBadges"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> dcddba19_583a_b531_9a4f_941e70dcbf0a
  fd0c3251_3b74_cf9d_8897_18f7e16e765e["OwnersListContext.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> fd0c3251_3b74_cf9d_8897_18f7e16e765e
  2d59b0f9_9ad6_da4d_0264_d98f193ab3fd["TreeContext.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 2d59b0f9_9ad6_da4d_0264_d98f193ab3fd
  315baf50_1028_51ca_a9c1_679c6a17ed98["hooks.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 315baf50_1028_51ca_a9c1_679c6a17ed98
  913bb343_55ea_f1b8_08f5_b75cb0a92b76["context.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> 913bb343_55ea_f1b8_08f5_b75cb0a92b76
  bb73063d_5d08_efb3_036e_72b78842d689["tooltip.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> bb73063d_5d08_efb3_036e_72b78842d689
  f69a42e8_c2e4_8bc5_9505_2b98ac4fc40b["menu-button.js"]
  4e5b4a1f_694c_f426_36e2_a03da99b38d5 --> f69a42e8_c2e4_8bc5_9505_2b98ac4fc40b
  style 4e5b4a1f_694c_f426_36e2_a03da99b38d5 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 * as React from 'react';
import {
  Fragment,
  useCallback,
  useContext,
  useLayoutEffect,
  useReducer,
  useRef,
  useState,
} from 'react';
import Button from '../Button';
import ButtonIcon from '../ButtonIcon';
import Toggle from '../Toggle';
import ElementBadges from './ElementBadges';
import {OwnersListContext, useChangeOwnerAction} from './OwnersListContext';
import {TreeDispatcherContext, TreeStateContext} from './TreeContext';
import {useIsOverflowing} from '../hooks';
import {StoreContext} from '../context';
import Tooltip from '../Components/reach-ui/tooltip';
import {
  Menu,
  MenuList,
  MenuButton,
  MenuItem,
} from '../Components/reach-ui/menu-button';

import type {SerializedElement} from 'react-devtools-shared/src/frontend/types';

import styles from './OwnersStack.css';

type SelectOwner = (owner: SerializedElement | null) => void;

type ACTION_UPDATE_OWNER_ID = {
  type: 'UPDATE_OWNER_ID',
  ownerID: number | null,
  owners: Array<SerializedElement>,
};
type ACTION_UPDATE_SELECTED_INDEX = {
  type: 'UPDATE_SELECTED_INDEX',
  selectedIndex: number,
};

type Action = ACTION_UPDATE_OWNER_ID | ACTION_UPDATE_SELECTED_INDEX;

type State = {
  ownerID: number | null,
  owners: Array<SerializedElement>,
  selectedIndex: number,
};

function dialogReducer(state: State, action: Action) {
  switch (action.type) {
// ... (272 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does OwnersStack.js do?
OwnersStack.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 OwnersStack.js?
OwnersStack.js defines 3 function(s): OwnerStackFlatList, OwnerStackFlatListProps.setElementsTotalWidth, dialogReducer.
What does OwnersStack.js depend on?
OwnersStack.js imports 17 module(s): Button, Button.js, ButtonIcon, ButtonIcon.js, ElementBadges, ElementBadges.js, OwnersListContext.js, OwnersStack.css, and 9 more.
What files import OwnersStack.js?
OwnersStack.js is imported by 1 file(s): Tree.js.
Where is OwnersStack.js in the architecture?
OwnersStack.js is located at packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-shared/src/devtools/views/Components).

Analyze Your Own Codebase

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

Try Supermodel Free