Skip to content

Commit a0792d0

Browse files
LuckyFBBLuckyFBB
committed
feat(configprovider): support provider for RC
1 parent 8c8b92d commit a0792d0

File tree

17 files changed

+269
-42
lines changed

17 files changed

+269
-42
lines changed

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -133,5 +133,6 @@
133133
},
134134
"resolutions": {
135135
"rc-motion": "2.6.2"
136-
}
136+
},
137+
"packageManager": "[email protected]"
137138
}

‎src/blockHeader/index.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { QuestionCircleOutlined, UpOutlined } from '@ant-design/icons';
33
import { Tooltip } from 'antd';
44
import classNames from 'classnames';
55

6+
import useLocale from '../locale/useLocale';
67
import './style.scss';
78

89
export declare type SizeType = 'small' | 'middle' | undefined;
@@ -59,6 +60,8 @@ const BlockHeader: React.FC<IBlockHeaderProps> = function (props) {
5960

6061
const [expand, setExpand] = useState(defaultExpand);
6162

63+
const locale = useLocale('BlockHeader');
64+
6265
const preTitleRowCls = `${prefixCls}-title-row`;
6366

6467
const questionTooltip = tooltip && (
@@ -103,7 +106,7 @@ const BlockHeader: React.FC<IBlockHeaderProps> = function (props) {
103106
{addonAfter && <div className={`${prefixCls}-addonAfter-box`}>{addonAfter}</div>}
104107
{children && (
105108
<div className={`${prefixCls}-collapse-box`}>
106-
<div className="text">{expand ? '收起' : '展开'}</div>
109+
<div className="text">{expand ? locale.collapse : locale.expand}</div>
107110
<UpOutlined className={`icon ${expand ? 'up' : 'down'}`} />
108111
</div>
109112
)}

‎src/configProvider/index.tsx‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import React, { createContext } from 'react';
2+
3+
export interface Locale {
4+
locale: string;
5+
BlockHeader: { expand: string; collapse: string };
6+
Copy: { copied: string; copy: string };
7+
Dropdown: { selectAll: string; resetText: string; okText: string };
8+
Fullscreen: { exitFull: string; full: string };
9+
GlobalLoading: { loading: string };
10+
Input: {
11+
case: string;
12+
precise: string;
13+
front: string;
14+
tail: string;
15+
};
16+
LoadError: {
17+
please: string;
18+
get: string;
19+
refresh: string;
20+
title: string;
21+
};
22+
Modal: {
23+
okText: string;
24+
cancelText: string;
25+
};
26+
MxGraph: { newNode: string };
27+
NotFound: {
28+
description: string;
29+
};
30+
SpreadSheet: {
31+
description: string;
32+
copy: string;
33+
copyCol: string;
34+
copyAll: string;
35+
};
36+
}
37+
38+
export interface LocaleContextProps {
39+
locale: Locale;
40+
}
41+
42+
export const LocaleContext = createContext<LocaleContextProps>({ locale: {} as Locale });
43+
44+
const ConfigProvider = ({
45+
locale,
46+
children,
47+
}: {
48+
locale: LocaleContextProps;
49+
children: React.ReactNode;
50+
}) => {
51+
return <LocaleContext.Provider value={{ ...locale }}>{children}</LocaleContext.Provider>;
52+
};
53+
54+
export default ConfigProvider;

‎src/copy/index.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { message, Tooltip } from 'antd';
44
import classNames from 'classnames';
55
import useClippy from 'use-clippy';
66

7+
import useLocale from '../locale/useLocale';
78
import './style.scss';
89

910
export interface ICopyProps {
@@ -17,14 +18,15 @@ export interface ICopyProps {
1718
}
1819

1920
const Copy: React.FC<ICopyProps> = (props) => {
21+
const locale = useLocale('Copy');
2022
const {
2123
button = <CopyOutlined className="dtc-copy__default-icon" />,
2224
text,
23-
title = '复制',
25+
title = locale.copy,
2426
hideTooltip,
2527
style,
2628
className,
27-
onCopy = () => message.success('复制成功'),
29+
onCopy = () => message.success(locale.copied),
2830
} = props;
2931
const [_, setClipboard] = useClippy();
3032

‎src/dropdown/select.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import classNames from 'classnames';
66
import { isEqual } from 'lodash';
77
import List from 'rc-virtual-list';
88

9+
import useLocale from '../locale/useLocale';
910
import './style.scss';
1011

1112
interface IDropdownSelectProps
@@ -31,6 +32,8 @@ export default function Select({
3132
}: IDropdownSelectProps) {
3233
const [visible, setVisible] = useState(false);
3334

35+
const locale = useLocale('Dropdown');
36+
3437
const handleCheckedAll = (e: CheckboxChangeEvent) => {
3538
if (e.target.checked) {
3639
onChange?.(options?.map((i) => i.value) || []);
@@ -119,7 +122,7 @@ export default function Select({
119122
checked={checkAll}
120123
indeterminate={indeterminate}
121124
>
122-
全选
125+
{locale.selectAll}
123126
</Checkbox>
124127
</Col>
125128
<Col span={24} className={`${prefix}__menu`}>
@@ -158,10 +161,10 @@ export default function Select({
158161
</Row>
159162
<Space size={8} className={`${prefix}__btns`}>
160163
<Button size="small" disabled={resetDisabled} onClick={handleReset}>
161-
重置
164+
{locale.resetText}
162165
</Button>
163166
<Button size="small" type="primary" onClick={handleSubmit}>
164-
确定
167+
{locale.okText}
165168
</Button>
166169
</Space>
167170
</>

‎src/errorBoundary/loadError.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
11
import React from 'react';
22

3+
import useLocale from '../locale/useLocale';
4+
35
const LoadError: React.FC = function () {
6+
const locale = useLocale('LoadError');
47
return (
58
<div className="dtc-error" data-testid="test-error">
69
<div>
7-

810
<h2 style={{ textAlign: 'center' }} data-testid="test-error">
9-
发现新版本，请
11+
{locale.please}
1012
<a
1113
onClick={() => {
1214
location.reload();
1315
}}
1416
>
15-
刷新
17+
{locale.refresh}
1618
</a>
17-
获取新版本。
19+
{locale.get}
1820
</h2>
19-
<h4 style={{ textAlign: 'center' }}>若该提示长时间存在，请联系管理员。</h4>
21+
<h4 style={{ textAlign: 'center' }}>{locale.title}</h4>
2022
</div>
2123
</div>
2224
);

‎src/fullscreen/index.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React, { CSSProperties, HTMLAttributes, ReactNode, useEffect, useState }
22
import { Button } from 'antd';
33

44
import KeyEventListener from '../keyEventListener';
5+
import useLocale from '../locale/useLocale';
56
import MyIcon from './icon';
67

78
const { KeyCombiner } = KeyEventListener;
@@ -44,7 +45,11 @@ export default function Fullscreen({
4445
...other
4546
}: IFullscreenProps) {
4647
const [isFullScreen, setIsFullScreen] = useState(false);
48+
49+
const locale = useLocale('Fullscreen');
50+
4751
const customIcon = isFullScreen ? exitFullIcon : fullIcon;
52+
4853
useEffect(() => {
4954
const propsDom = document.getElementById(target);
5055
const domEle = propsDom || document.body;
@@ -188,7 +193,7 @@ export default function Fullscreen({
188193
) : (
189194
<Button onClick={handleFullScreen}>
190195
<MyIcon style={iconStyle} type={isFullScreen} themeDark={themeDark} />
191-
{isFullScreen ? '退出全屏' : '全屏'}
196+
{isFullScreen ? locale.exitFull : locale.full}
192197
</Button>
193198
)}
194199
</KeyCombiner>

‎src/globalLoading/index.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22
import classNames from 'classnames';
33

4+
import useLocale from '../locale/useLocale';
45
import './style.scss';
56

67
export interface IGlobalLoadingProps {
@@ -12,8 +13,10 @@ export interface IGlobalLoadingProps {
1213
}
1314

1415
const GlobalLoading: React.FC<IGlobalLoadingProps> = function (props) {
16+
const locale = useLocale('GlobalLoading');
17+
1518
const {
16-
loadingTitle = '应用加载中，请等候～',
19+
loadingTitle = locale.loading,
1720
mainBackground = '#F2F7FA',
1821
circleBackground = '#1D78FF',
1922
titleColor = '#3D446E',

‎src/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
export { default as BlockHeader } from './blockHeader';
22
export { default as CollapsibleActionItems } from './collapsibleActionItems';
3+
export { default as ConfigProvider } from './configProvider';
34
export { default as ContextMenu } from './contextMenu';
45
export { default as useCookieListener } from './cookies';
56
export { default as Copy } from './copy';
@@ -13,6 +14,8 @@ export { default as Fullscreen } from './fullscreen';
1314
export { default as GlobalLoading } from './globalLoading';
1415
export { default as Input } from './input';
1516
export { default as KeyEventListener } from './keyEventListener';
17+
export { default as enUS } from './locale/en-US';
18+
export { default as zhCN } from './locale/zh-CN';
1619
export { default as MarkdownRender } from './markdownRender';
1720
export { default as Modal } from './modal';
1821
export { default as MxGraphContainer, WIDGETS_PREFIX } from './mxGraph';

‎src/input/match.tsx‎

Lines changed: 25 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React, { useState } from 'react';
22
import { Input, type InputProps, Tooltip } from 'antd';
33
import classNames from 'classnames';
44

5+
import useLocale from '../locale/useLocale';
56
import { CaseSensitiveIcon, FrontIcon, PreciseIcon, TailIcon } from './icons';
67
import './match.scss';
78

@@ -29,30 +30,11 @@ interface IMatchProps extends Omit<InputProps, 'suffix'> {
2930
onSearch?: (value: string, searchType: SearchType) => void;
3031
}
3132

32-
const searchTypeList = [
33-
{
34-
key: 'caseSensitive',
35-
tip: '区分大小写匹配',
36-
},
37-
{
38-
key: 'precise',
39-
tip: '精确匹配',
40-
},
41-
{
42-
key: 'front',
43-
tip: '头部匹配',
44-
},
45-
{
46-
key: 'tail',
47-
tip: '尾部匹配',
48-
},
49-
] as const;
50-
5133
export default function Match({
5234
className,
5335
value,
5436
searchType,
55-
filterOptions = searchTypeList.map((i) => i.key),
37+
filterOptions: propFilterOptions,
5638
onTypeChange,
5739
onSearch,
5840
onChange,
@@ -62,12 +44,35 @@ export default function Match({
6244
const [internalValue, setValue] = useState<string>('');
6345
const [internalSearchType, setSearchType] = useState<SearchType>('fuzzy');
6446

47+
const locale = useLocale('Input');
48+
6549
const handleTypeChange = (key: SearchType) => {
6650
const next = realSearchType === key ? 'fuzzy' : key;
6751
onTypeChange?.(next);
6852
setSearchType(next);
6953
};
7054

55+
const searchTypeList = [
56+
{
57+
key: 'caseSensitive',
58+
tip: locale.case,
59+
},
60+
{
61+
key: 'precise',
62+
tip: locale.precise,
63+
},
64+
{
65+
key: 'front',
66+
tip: locale.front,
67+
},
68+
{
69+
key: 'tail',
70+
tip: locale.tail,
71+
},
72+
] as const;
73+
74+
const filterOptions = propFilterOptions || searchTypeList.map((i) => i.key);
75+
7176
const options = searchTypeList.filter((i) => filterOptions.includes(i.key));
7277

7378
const realSearchType = searchType || internalSearchType;

0 commit comments

Comments
 (0)