@atlaskit/app-provider
Version:
A top level provider for the Design System.
31 lines (30 loc) • 805 B
TypeScript
import { type Theme } from '../context/theme';
/**
* __useTheme()__
*
* Returns the current theme settings for the nearest `ThemeProvider` in the
* React tree.
*
* The returned object contains the named theme IDs for each slot: `light`,
* `dark`, `spacing`, and `typography`. Use `useSetTheme` to change these
* values at runtime.
*
* This hook can be used both inside and outside `AppProvider`. When used
* inside a nested `ThemeProvider`, it reflects the theme of that sub-tree.
*
* @returns The current theme settings object.
*
* @example
* ```tsx
* function ThemeDisplay() {
* const theme = useTheme();
*
* return (
* <p>
* Light theme: {theme.light}, Dark theme: {theme.dark}
* </p>
* );
* }
* ```
*/
export declare function useTheme(): Partial<Theme>;