mirror/checktheroads-hyperglass
1
0
Fork 0
mirror of https://github.com/checktheroads/hyperglass synced 2024-05-11 05:55:08 +00:00
Code Releases Activity

continue typescript & chakra v1 migrations [skip ci]

Browse Source
This commit is contained in:
checktheroads
2020-11-29 01:25:48 -07:00
parent e0eb51012d
commit e823c3416b
105 changed files with 2900 additions and 2308 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
hyperglass/ui/context/HyperglassProvider.tsx
View File

@@ -1,13 +1,19 @@
import { createContext, useContext, useMemo } from 'react';
import { ChakraProvider, useTheme as useChakraTheme } from '@chakra-ui/core';
import {
useToken,
ChakraProvider,
useColorModeValue,
useBreakpointValue,
useTheme as useChakraTheme,
} from '@chakra-ui/react';
import { makeTheme, defaultTheme } from '~/util';
import type { IConfig, ITheme } from '~/types';
import type { IHyperglassProvider } from './types';
import type { THyperglassProvider } from './types';
const HyperglassContext = createContext<IConfig>(Object());
export const HyperglassProvider = (props: IHyperglassProvider) => {
export const HyperglassProvider = (props: THyperglassProvider) => {
const { config, children } = props;
const value = useMemo(() => config, []);
const userTheme = value && makeTheme(value.web.theme);
@@ -19,6 +25,13 @@ export const HyperglassProvider = (props: IHyperglassProvider) => {
);
};
export const useConfig = () => useContext(HyperglassContext);
export const useConfig = (): IConfig => useContext(HyperglassContext);
export const useTheme = (): ITheme => useChakraTheme();
export { useColorModeValue as useColorValue } from '@chakra-ui/core';
export const useMobile = (): boolean =>
useBreakpointValue({ base: true, md: true, lg: false, xl: false }) ?? true;
export const useColorToken = (light: string, dark: string): ValueOf<ITheme['colors']> =>
useColorModeValue(useToken('colors', light), useToken('colors', dark));
export { useColorModeValue as useColorValue, useBreakpointValue } from '@chakra-ui/react';