52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
|
import { StyleProvider } from '@ant-design/cssinjs';
|
||
|
|
import { ConfigProvider, App as AntdApp } from 'antd';
|
||
|
|
import { FC, useMemo } from 'react';
|
||
|
|
|
||
|
|
import $styles from './app.module.css';
|
||
|
|
import { localeData } from './components/demo/constants';
|
||
|
|
import ContextDemo from './components/demo/context';
|
||
|
|
import CustomDemo from './components/demo/custom';
|
||
|
|
import { useLocale } from './components/demo/hooks';
|
||
|
|
import { useAntdAlgorithm } from './components/theme/hooks';
|
||
|
|
|
||
|
|
export const Wrapper: FC = () => {
|
||
|
|
const locale = useLocale();
|
||
|
|
const antdLocaleData = useMemo(() => {
|
||
|
|
if (!Object.keys(localeData).find((v) => v === locale.name)) {
|
||
|
|
return localeData[0];
|
||
|
|
}
|
||
|
|
return localeData[locale.name];
|
||
|
|
}, [locale.name]);
|
||
|
|
// const themeState = useTheme();
|
||
|
|
// const algorithm = useMemo(() => {
|
||
|
|
// const result = [themeState.compact ? theme.compactAlgorithm : theme.defaultAlgorithm];
|
||
|
|
// if (themeState.mode === 'dark') result.push(theme.darkAlgorithm);
|
||
|
|
// return result;
|
||
|
|
// }, [themeState]);
|
||
|
|
const algorithm = useAntdAlgorithm();
|
||
|
|
return (
|
||
|
|
<ConfigProvider
|
||
|
|
locale={antdLocaleData}
|
||
|
|
theme={{
|
||
|
|
algorithm,
|
||
|
|
token: {},
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<StyleProvider hashPriority="high">
|
||
|
|
<AntdApp>
|
||
|
|
<div className={$styles.app}>
|
||
|
|
{/* <StateDemo />
|
||
|
|
<EffectDemo />
|
||
|
|
<RefDemo />
|
||
|
|
<MemoDemo />
|
||
|
|
<CallbackDemo /> */}
|
||
|
|
<ContextDemo />
|
||
|
|
{/* <ReducerDemo /> */}
|
||
|
|
<CustomDemo />
|
||
|
|
</div>
|
||
|
|
</AntdApp>
|
||
|
|
</StyleProvider>
|
||
|
|
</ConfigProvider>
|
||
|
|
);
|
||
|
|
};
|