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

useThemeStyles.js — react Source File

Architecture documentation for useThemeStyles.js, a javascript file in the react codebase. 3 imports, 3 dependents.

File javascript BabelCompiler Validation 3 imports 3 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  018de6d1_d68d_770a_284c_f0863628d125["useThemeStyles.js"]
  5996f1e4_af81_a51b_84bc_175bfba4f818["SettingsContext.js"]
  018de6d1_d68d_770a_284c_f0863628d125 --> 5996f1e4_af81_a51b_84bc_175bfba4f818
  7b4b1f74_ad9f_b54a_6f0f_61769f9baa4b["constants.js"]
  018de6d1_d68d_770a_284c_f0863628d125 --> 7b4b1f74_ad9f_b54a_6f0f_61769f9baa4b
  ac587885_e294_a1e9_b13f_5e7b920fdb42["react"]
  018de6d1_d68d_770a_284c_f0863628d125 --> ac587885_e294_a1e9_b13f_5e7b920fdb42
  f69a42e8_c2e4_8bc5_9505_2b98ac4fc40b["menu-button.js"]
  f69a42e8_c2e4_8bc5_9505_2b98ac4fc40b --> 018de6d1_d68d_770a_284c_f0863628d125
  bb73063d_5d08_efb3_036e_72b78842d689["tooltip.js"]
  bb73063d_5d08_efb3_036e_72b78842d689 --> 018de6d1_d68d_770a_284c_f0863628d125
  4d06d539_1d59_0b26_1097_d40ffb862127["ThemeProvider.js"]
  4d06d539_1d59_0b26_1097_d40ffb862127 --> 018de6d1_d68d_770a_284c_f0863628d125
  style 018de6d1_d68d_770a_284c_f0863628d125 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 {useContext, useMemo} from 'react';
import {SettingsContext} from './Settings/SettingsContext';
import {THEME_STYLES} from '../constants';

const useThemeStyles = (): any => {
  const {theme, displayDensity, browserTheme} = useContext(SettingsContext);

  const style = useMemo(
    () => ({
      ...THEME_STYLES[displayDensity],
      ...THEME_STYLES[theme === 'auto' ? browserTheme : theme],
    }),
    [theme, browserTheme, displayDensity],
  );

  return style;
};

export default useThemeStyles;

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does useThemeStyles.js do?
useThemeStyles.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 useThemeStyles.js?
useThemeStyles.js defines 1 function(s): useThemeStyles.
What does useThemeStyles.js depend on?
useThemeStyles.js imports 3 module(s): SettingsContext.js, constants.js, react.
What files import useThemeStyles.js?
useThemeStyles.js is imported by 3 file(s): ThemeProvider.js, menu-button.js, tooltip.js.
Where is useThemeStyles.js in the architecture?
useThemeStyles.js is located at packages/react-devtools-shared/src/devtools/views/useThemeStyles.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-shared/src/devtools/views).

Analyze Your Own Codebase

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

Try Supermodel Free