@fle-ui/next 3.0.0-alpha.2 → 3.0.0-alpha.3
Sign up to get free protection for your applications and to get access to all the features.
- package/es/theme/index.d.ts +21 -0
- package/es/theme/index.js +37 -0
- package/es/theme/interface/alias.d.ts +133 -0
- package/es/theme/interface/alias.js +1 -0
- package/es/theme/interface/components.d.ts +110 -0
- package/es/theme/interface/components.js +1 -0
- package/es/theme/interface/index.d.ts +13 -0
- package/es/theme/interface/index.js +1 -0
- package/es/theme/interface/maps/colors.d.ts +342 -0
- package/es/theme/interface/maps/colors.js +1 -0
- package/es/theme/interface/maps/index.d.ts +15 -0
- package/es/theme/interface/maps/index.js +3 -0
- package/es/theme/interface/maps/size.d.ts +49 -0
- package/es/theme/interface/maps/size.js +1 -0
- package/es/theme/interface/maps/style.d.ts +33 -0
- package/es/theme/interface/maps/style.js +1 -0
- package/es/theme/interface/presetColors.d.ts +8 -0
- package/es/theme/interface/presetColors.js +1 -0
- package/es/theme/interface/seeds.d.ts +139 -0
- package/es/theme/interface/seeds.js +1 -0
- package/es/theme/internal.d.ts +23 -0
- package/es/theme/internal.js +47 -0
- package/es/theme/themes/ColorMap.d.ts +15 -0
- package/es/theme/themes/ColorMap.js +1 -0
- package/es/theme/themes/compact/genCompactSizeMapToken.d.ts +2 -0
- package/es/theme/themes/compact/genCompactSizeMapToken.js +16 -0
- package/es/theme/themes/compact/index.d.ts +4 -0
- package/es/theme/themes/compact/index.js +34 -0
- package/es/theme/themes/dark/colorAlgorithm.d.ts +2 -0
- package/es/theme/themes/dark/colorAlgorithm.js +8 -0
- package/es/theme/themes/dark/colors.d.ts +3 -0
- package/es/theme/themes/dark/colors.js +44 -0
- package/es/theme/themes/dark/index.d.ts +4 -0
- package/es/theme/themes/dark/index.js +34 -0
- package/es/theme/themes/default/colorAlgorithm.d.ts +2 -0
- package/es/theme/themes/default/colorAlgorithm.js +8 -0
- package/es/theme/themes/default/colors.d.ts +3 -0
- package/es/theme/themes/default/colors.js +42 -0
- package/es/theme/themes/default/index.d.ts +2 -0
- package/es/theme/themes/default/index.js +30 -0
- package/es/theme/themes/seed.d.ts +4 -0
- package/es/theme/themes/seed.js +67 -0
- package/es/theme/themes/shared/genColorMapToken.d.ts +8 -0
- package/es/theme/themes/shared/genColorMapToken.js +78 -0
- package/es/theme/themes/shared/genCommonMapToken.d.ts +2 -0
- package/es/theme/themes/shared/genCommonMapToken.js +33 -0
- package/es/theme/themes/shared/genControlHeight.d.ts +3 -0
- package/es/theme/themes/shared/genControlHeight.js +10 -0
- package/es/theme/themes/shared/genFontSizes.d.ts +4 -0
- package/es/theme/themes/shared/genFontSizes.js +18 -0
- package/es/theme/themes/shared/genRadius.d.ts +3 -0
- package/es/theme/themes/shared/genRadius.js +51 -0
- package/es/theme/themes/shared/genSizeMapToken.d.ts +2 -0
- package/es/theme/themes/shared/genSizeMapToken.js +24 -0
- package/es/theme/util/alias.d.ts +12 -0
- package/es/theme/util/alias.js +169 -0
- package/es/theme/util/genComponentStyleHook.d.ts +25 -0
- package/es/theme/util/genComponentStyleHook.js +65 -0
- package/es/theme/util/getAlphaColor.d.ts +2 -0
- package/es/theme/util/getAlphaColor.js +46 -0
- package/es/theme/util/statistic.d.ts +18 -0
- package/es/theme/util/statistic.js +80 -0
- package/lib/theme/index.d.ts +21 -0
- package/lib/theme/index.js +52 -0
- package/lib/theme/interface/alias.d.ts +133 -0
- package/lib/theme/interface/alias.js +5 -0
- package/lib/theme/interface/components.d.ts +110 -0
- package/lib/theme/interface/components.js +5 -0
- package/lib/theme/interface/index.d.ts +13 -0
- package/lib/theme/interface/index.js +13 -0
- package/lib/theme/interface/maps/colors.d.ts +342 -0
- package/lib/theme/interface/maps/colors.js +5 -0
- package/lib/theme/interface/maps/index.d.ts +15 -0
- package/lib/theme/interface/maps/index.js +44 -0
- package/lib/theme/interface/maps/size.d.ts +49 -0
- package/lib/theme/interface/maps/size.js +5 -0
- package/lib/theme/interface/maps/style.d.ts +33 -0
- package/lib/theme/interface/maps/style.js +5 -0
- package/lib/theme/interface/presetColors.d.ts +8 -0
- package/lib/theme/interface/presetColors.js +8 -0
- package/lib/theme/interface/seeds.d.ts +139 -0
- package/lib/theme/interface/seeds.js +5 -0
- package/lib/theme/internal.d.ts +23 -0
- package/lib/theme/internal.js +108 -0
- package/lib/theme/themes/ColorMap.d.ts +15 -0
- package/lib/theme/themes/ColorMap.js +1 -0
- package/lib/theme/themes/compact/genCompactSizeMapToken.d.ts +2 -0
- package/lib/theme/themes/compact/genCompactSizeMapToken.js +16 -0
- package/lib/theme/themes/compact/index.d.ts +4 -0
- package/lib/theme/themes/compact/index.js +34 -0
- package/lib/theme/themes/dark/colorAlgorithm.d.ts +2 -0
- package/lib/theme/themes/dark/colorAlgorithm.js +8 -0
- package/lib/theme/themes/dark/colors.d.ts +3 -0
- package/lib/theme/themes/dark/colors.js +44 -0
- package/lib/theme/themes/dark/index.d.ts +4 -0
- package/lib/theme/themes/dark/index.js +34 -0
- package/lib/theme/themes/default/colorAlgorithm.d.ts +2 -0
- package/lib/theme/themes/default/colorAlgorithm.js +8 -0
- package/lib/theme/themes/default/colors.d.ts +3 -0
- package/lib/theme/themes/default/colors.js +42 -0
- package/lib/theme/themes/default/index.d.ts +2 -0
- package/lib/theme/themes/default/index.js +30 -0
- package/lib/theme/themes/seed.d.ts +4 -0
- package/lib/theme/themes/seed.js +67 -0
- package/lib/theme/themes/shared/genColorMapToken.d.ts +8 -0
- package/lib/theme/themes/shared/genColorMapToken.js +78 -0
- package/lib/theme/themes/shared/genCommonMapToken.d.ts +2 -0
- package/lib/theme/themes/shared/genCommonMapToken.js +33 -0
- package/lib/theme/themes/shared/genControlHeight.d.ts +3 -0
- package/lib/theme/themes/shared/genControlHeight.js +10 -0
- package/lib/theme/themes/shared/genFontSizes.d.ts +4 -0
- package/lib/theme/themes/shared/genFontSizes.js +18 -0
- package/lib/theme/themes/shared/genRadius.d.ts +3 -0
- package/lib/theme/themes/shared/genRadius.js +51 -0
- package/lib/theme/themes/shared/genSizeMapToken.d.ts +2 -0
- package/lib/theme/themes/shared/genSizeMapToken.js +24 -0
- package/lib/theme/util/alias.d.ts +12 -0
- package/lib/theme/util/alias.js +177 -0
- package/lib/theme/util/genComponentStyleHook.d.ts +25 -0
- package/lib/theme/util/genComponentStyleHook.js +79 -0
- package/lib/theme/util/getAlphaColor.d.ts +2 -0
- package/lib/theme/util/getAlphaColor.js +54 -0
- package/lib/theme/util/statistic.d.ts +18 -0
- package/lib/theme/util/statistic.js +97 -0
- package/package.json +1 -1
@@ -0,0 +1,21 @@
|
|
1
|
+
import defaultAlgorithm from './themes/default';
|
2
|
+
/** Get current context Design Token. Will be different if you are using nest theme config. */
|
3
|
+
declare function useToken(): {
|
4
|
+
theme: import("@ant-design/cssinjs").Theme<import("./internal").SeedToken, import("./interface").MapToken>;
|
5
|
+
token: import("./interface").GlobalToken;
|
6
|
+
hashId: string;
|
7
|
+
};
|
8
|
+
declare const _default: {
|
9
|
+
/** @private Test Usage. Do not use in production. */
|
10
|
+
defaultConfig: {
|
11
|
+
token: import("./internal").SeedToken;
|
12
|
+
hashed: boolean;
|
13
|
+
};
|
14
|
+
/** Default seedToken */
|
15
|
+
defaultSeed: import("./internal").SeedToken;
|
16
|
+
useToken: typeof useToken;
|
17
|
+
defaultAlgorithm: typeof defaultAlgorithm;
|
18
|
+
darkAlgorithm: import("@ant-design/cssinjs").DerivativeFunc<import("./internal").SeedToken, import("./interface").MapToken>;
|
19
|
+
compactAlgorithm: import("@ant-design/cssinjs").DerivativeFunc<import("./internal").SeedToken, import("./interface").MapToken>;
|
20
|
+
};
|
21
|
+
export default _default;
|
@@ -0,0 +1,37 @@
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
2
|
+
/* eslint-disable import/prefer-default-export */
|
3
|
+
|
4
|
+
import { defaultConfig, useToken as useInternalToken } from "./internal";
|
5
|
+
import defaultAlgorithm from "./themes/default";
|
6
|
+
import darkAlgorithm from "./themes/dark";
|
7
|
+
import compactAlgorithm from "./themes/compact"; // ZombieJ: We export as object to user but array in internal.
|
8
|
+
// This is used to minimize the bundle size for antd package but safe to refactor as object also.
|
9
|
+
// Please do not export internal `useToken` directly to avoid something export unexpected.
|
10
|
+
|
11
|
+
/** Get current context Design Token. Will be different if you are using nest theme config. */
|
12
|
+
|
13
|
+
function useToken() {
|
14
|
+
var _useInternalToken = useInternalToken(),
|
15
|
+
_useInternalToken2 = _slicedToArray(_useInternalToken, 3),
|
16
|
+
theme = _useInternalToken2[0],
|
17
|
+
token = _useInternalToken2[1],
|
18
|
+
hashId = _useInternalToken2[2];
|
19
|
+
|
20
|
+
return {
|
21
|
+
theme: theme,
|
22
|
+
token: token,
|
23
|
+
hashId: hashId
|
24
|
+
};
|
25
|
+
}
|
26
|
+
|
27
|
+
export default {
|
28
|
+
/** @private Test Usage. Do not use in production. */
|
29
|
+
defaultConfig: defaultConfig,
|
30
|
+
|
31
|
+
/** Default seedToken */
|
32
|
+
defaultSeed: defaultConfig.token,
|
33
|
+
useToken: useToken,
|
34
|
+
defaultAlgorithm: defaultAlgorithm,
|
35
|
+
darkAlgorithm: darkAlgorithm,
|
36
|
+
compactAlgorithm: compactAlgorithm
|
37
|
+
};
|
@@ -0,0 +1,133 @@
|
|
1
|
+
import type * as React from 'react';
|
2
|
+
import type { MapToken } from './maps';
|
3
|
+
export interface AliasToken extends MapToken {
|
4
|
+
colorFillContentHover: string;
|
5
|
+
colorFillAlter: string;
|
6
|
+
colorFillContent: string;
|
7
|
+
colorBgContainerDisabled: string;
|
8
|
+
colorBgTextHover: string;
|
9
|
+
colorBgTextActive: string;
|
10
|
+
colorBorderBg: string;
|
11
|
+
/**
|
12
|
+
* @nameZH 分割线颜色
|
13
|
+
* @desc 用于作为分割线的颜色,此颜色和 colorBorderSecondary 的颜色一致,但是用的是透明色。
|
14
|
+
*/
|
15
|
+
colorSplit: string;
|
16
|
+
colorTextPlaceholder: string;
|
17
|
+
colorTextDisabled: string;
|
18
|
+
colorTextHeading: string;
|
19
|
+
colorTextLabel: string;
|
20
|
+
colorTextDescription: string;
|
21
|
+
colorTextLightSolid: string;
|
22
|
+
/** Weak action. Such as `allowClear` or Alert close button */
|
23
|
+
colorIcon: string;
|
24
|
+
/** Weak action hover color. Such as `allowClear` or Alert close button */
|
25
|
+
colorIconHover: string;
|
26
|
+
colorLink: string;
|
27
|
+
colorLinkHover: string;
|
28
|
+
colorLinkActive: string;
|
29
|
+
colorHighlight: string;
|
30
|
+
controlOutline: string;
|
31
|
+
colorWarningOutline: string;
|
32
|
+
colorErrorOutline: string;
|
33
|
+
fontSizeSM: number;
|
34
|
+
fontSize: number;
|
35
|
+
fontSizeLG: number;
|
36
|
+
fontSizeXL: number;
|
37
|
+
/** Operation icon in Select, Cascader, etc. icon fontSize. Normal is same as fontSizeSM */
|
38
|
+
fontSizeIcon: number;
|
39
|
+
/**
|
40
|
+
* @nameZH 一级标题字号
|
41
|
+
* @desc H1 标签所使用的字号
|
42
|
+
* @default 38
|
43
|
+
*/
|
44
|
+
fontSizeHeading1: number;
|
45
|
+
/**
|
46
|
+
* @nameZH 二级标题字号
|
47
|
+
* @desc h2 标签所使用的字号
|
48
|
+
* @default 30
|
49
|
+
*/
|
50
|
+
fontSizeHeading2: number;
|
51
|
+
/**
|
52
|
+
* @nameZH 三级标题字号
|
53
|
+
* @desc h3 标签使用的字号
|
54
|
+
* @default 24
|
55
|
+
*/
|
56
|
+
fontSizeHeading3: number;
|
57
|
+
/**
|
58
|
+
* @nameZH 四级标题字号
|
59
|
+
* @desc h4 标签使用的字号
|
60
|
+
* @default 20
|
61
|
+
*/
|
62
|
+
fontSizeHeading4: number;
|
63
|
+
/**
|
64
|
+
* @nameZH 五级标题字号
|
65
|
+
* @desc h5 标签使用的字号
|
66
|
+
* @default 16
|
67
|
+
*/
|
68
|
+
fontSizeHeading5: number;
|
69
|
+
/** For heading like h1, h2, h3 or option selected item */
|
70
|
+
fontWeightStrong: number;
|
71
|
+
lineHeight: number;
|
72
|
+
lineHeightLG: number;
|
73
|
+
lineHeightSM: number;
|
74
|
+
lineHeightHeading1: number;
|
75
|
+
lineHeightHeading2: number;
|
76
|
+
lineHeightHeading3: number;
|
77
|
+
lineHeightHeading4: number;
|
78
|
+
lineHeightHeading5: number;
|
79
|
+
controlOutlineWidth: number;
|
80
|
+
controlItemBgHover: string;
|
81
|
+
controlItemBgActive: string;
|
82
|
+
controlItemBgActiveHover: string;
|
83
|
+
controlInteractiveSize: number;
|
84
|
+
controlItemBgActiveDisabled: string;
|
85
|
+
paddingXXS: number;
|
86
|
+
paddingXS: number;
|
87
|
+
paddingSM: number;
|
88
|
+
padding: number;
|
89
|
+
paddingMD: number;
|
90
|
+
paddingLG: number;
|
91
|
+
paddingXL: number;
|
92
|
+
paddingContentHorizontalLG: number;
|
93
|
+
paddingContentHorizontal: number;
|
94
|
+
paddingContentHorizontalSM: number;
|
95
|
+
paddingContentVerticalLG: number;
|
96
|
+
paddingContentVertical: number;
|
97
|
+
paddingContentVerticalSM: number;
|
98
|
+
marginXXS: number;
|
99
|
+
marginXS: number;
|
100
|
+
marginSM: number;
|
101
|
+
margin: number;
|
102
|
+
marginMD: number;
|
103
|
+
marginLG: number;
|
104
|
+
marginXL: number;
|
105
|
+
marginXXL: number;
|
106
|
+
opacityLoading: number;
|
107
|
+
boxShadow: string;
|
108
|
+
boxShadowSecondary: string;
|
109
|
+
linkDecoration: React.CSSProperties['textDecoration'];
|
110
|
+
linkHoverDecoration: React.CSSProperties['textDecoration'];
|
111
|
+
linkFocusDecoration: React.CSSProperties['textDecoration'];
|
112
|
+
controlPaddingHorizontal: number;
|
113
|
+
controlPaddingHorizontalSM: number;
|
114
|
+
screenXS: number;
|
115
|
+
screenXSMin: number;
|
116
|
+
screenXSMax: number;
|
117
|
+
screenSM: number;
|
118
|
+
screenSMMin: number;
|
119
|
+
screenSMMax: number;
|
120
|
+
screenMD: number;
|
121
|
+
screenMDMin: number;
|
122
|
+
screenMDMax: number;
|
123
|
+
screenLG: number;
|
124
|
+
screenLGMin: number;
|
125
|
+
screenLGMax: number;
|
126
|
+
screenXL: number;
|
127
|
+
screenXLMin: number;
|
128
|
+
screenXLMax: number;
|
129
|
+
screenXXL: number;
|
130
|
+
screenXXLMin: number;
|
131
|
+
/** Used for DefaultButton, Switch which has default outline */
|
132
|
+
controlTmpOutline: string;
|
133
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,110 @@
|
|
1
|
+
import type { ComponentToken as AlertComponentToken } from '../../alert/style';
|
2
|
+
import type { ComponentToken as AnchorComponentToken } from '../../anchor/style';
|
3
|
+
import type { ComponentToken as AvatarComponentToken } from '../../avatar/style';
|
4
|
+
import type { ComponentToken as BackTopComponentToken } from '../../back-top/style';
|
5
|
+
import type { ComponentToken as ButtonComponentToken } from '../../button/style';
|
6
|
+
import type { ComponentToken as FloatButtonComponentToken } from '../../float-button/style';
|
7
|
+
import type { ComponentToken as CalendarComponentToken } from '../../calendar/style';
|
8
|
+
import type { ComponentToken as CardComponentToken } from '../../card/style';
|
9
|
+
import type { ComponentToken as CarouselComponentToken } from '../../carousel/style';
|
10
|
+
import type { ComponentToken as CascaderComponentToken } from '../../cascader/style';
|
11
|
+
import type { ComponentToken as CheckboxComponentToken } from '../../checkbox/style';
|
12
|
+
import type { ComponentToken as CollapseComponentToken } from '../../collapse/style';
|
13
|
+
import type { ComponentToken as DatePickerComponentToken } from '../../date-picker/style';
|
14
|
+
import type { ComponentToken as DividerComponentToken } from '../../divider/style';
|
15
|
+
import type { ComponentToken as DropdownComponentToken } from '../../dropdown/style';
|
16
|
+
import type { ComponentToken as DrawerComponentToken } from '../../drawer/style';
|
17
|
+
import type { ComponentToken as EmptyComponentToken } from '../../empty/style';
|
18
|
+
import type { ComponentToken as ImageComponentToken } from '../../image/style';
|
19
|
+
import type { ComponentToken as InputNumberComponentToken } from '../../input-number/style';
|
20
|
+
import type { ComponentToken as LayoutComponentToken } from '../../layout/style';
|
21
|
+
import type { ComponentToken as ListComponentToken } from '../../list/style';
|
22
|
+
import type { ComponentToken as MentionsComponentToken } from '../../mentions/style';
|
23
|
+
import type { ComponentToken as MenuComponentToken } from '../../menu/style';
|
24
|
+
import type { ComponentToken as MessageComponentToken } from '../../message/style';
|
25
|
+
import type { ComponentToken as ModalComponentToken } from '../../modal/style';
|
26
|
+
import type { ComponentToken as NotificationComponentToken } from '../../notification/style';
|
27
|
+
import type { ComponentToken as PopconfirmComponentToken } from '../../popconfirm/style';
|
28
|
+
import type { ComponentToken as PopoverComponentToken } from '../../popover/style';
|
29
|
+
import type { ComponentToken as ProgressComponentToken } from '../../progress/style';
|
30
|
+
import type { ComponentToken as RadioComponentToken } from '../../radio/style';
|
31
|
+
import type { ComponentToken as RateComponentToken } from '../../rate/style';
|
32
|
+
import type { ComponentToken as ResultComponentToken } from '../../result/style';
|
33
|
+
import type { ComponentToken as SegmentedComponentToken } from '../../segmented/style';
|
34
|
+
import type { ComponentToken as SelectComponentToken } from '../../select/style';
|
35
|
+
import type { ComponentToken as SkeletonComponentToken } from '../../skeleton/style';
|
36
|
+
import type { ComponentToken as SliderComponentToken } from '../../slider/style';
|
37
|
+
import type { ComponentToken as SpaceComponentToken } from '../../space/style';
|
38
|
+
import type { ComponentToken as SpinComponentToken } from '../../spin/style';
|
39
|
+
import type { ComponentToken as StepsComponentToken } from '../../steps/style';
|
40
|
+
import type { ComponentToken as TableComponentToken } from '../../table/style';
|
41
|
+
import type { ComponentToken as TabsComponentToken } from '../../tabs/style';
|
42
|
+
import type { ComponentToken as TagComponentToken } from '../../tag/style';
|
43
|
+
import type { ComponentToken as TimelineComponentToken } from '../../timeline/style';
|
44
|
+
import type { ComponentToken as TooltipComponentToken } from '../../tooltip/style';
|
45
|
+
import type { ComponentToken as TransferComponentToken } from '../../transfer/style';
|
46
|
+
import type { ComponentToken as TypographyComponentToken } from '../../typography/style';
|
47
|
+
import type { ComponentToken as UploadComponentToken } from '../../upload/style';
|
48
|
+
import type { ComponentToken as TourComponentToken } from '../../tour/style';
|
49
|
+
export interface ComponentTokenMap {
|
50
|
+
Affix?: {};
|
51
|
+
Alert?: AlertComponentToken;
|
52
|
+
Anchor?: AnchorComponentToken;
|
53
|
+
Avatar?: AvatarComponentToken;
|
54
|
+
BackTop?: BackTopComponentToken;
|
55
|
+
Badge?: {};
|
56
|
+
Button?: ButtonComponentToken;
|
57
|
+
Breadcrumb?: {};
|
58
|
+
Card?: CardComponentToken;
|
59
|
+
Carousel?: CarouselComponentToken;
|
60
|
+
Cascader?: CascaderComponentToken;
|
61
|
+
Checkbox?: CheckboxComponentToken;
|
62
|
+
Collapse?: CollapseComponentToken;
|
63
|
+
DatePicker?: DatePickerComponentToken;
|
64
|
+
Descriptions?: {};
|
65
|
+
Divider?: DividerComponentToken;
|
66
|
+
Drawer?: DrawerComponentToken;
|
67
|
+
Dropdown?: DropdownComponentToken;
|
68
|
+
Empty?: EmptyComponentToken;
|
69
|
+
FloatButton?: FloatButtonComponentToken;
|
70
|
+
Form?: {};
|
71
|
+
Grid?: {};
|
72
|
+
Image?: ImageComponentToken;
|
73
|
+
Input?: {};
|
74
|
+
InputNumber?: InputNumberComponentToken;
|
75
|
+
Layout?: LayoutComponentToken;
|
76
|
+
List?: ListComponentToken;
|
77
|
+
Mentions?: MentionsComponentToken;
|
78
|
+
Notification?: NotificationComponentToken;
|
79
|
+
Pagination?: {};
|
80
|
+
Popover?: PopoverComponentToken;
|
81
|
+
Popconfirm?: PopconfirmComponentToken;
|
82
|
+
Rate?: RateComponentToken;
|
83
|
+
Radio?: RadioComponentToken;
|
84
|
+
Result?: ResultComponentToken;
|
85
|
+
Segmented?: SegmentedComponentToken;
|
86
|
+
Select?: SelectComponentToken;
|
87
|
+
Skeleton?: SkeletonComponentToken;
|
88
|
+
Slider?: SliderComponentToken;
|
89
|
+
Spin?: SpinComponentToken;
|
90
|
+
Statistic?: {};
|
91
|
+
Switch?: {};
|
92
|
+
Tag?: TagComponentToken;
|
93
|
+
Tree?: {};
|
94
|
+
TreeSelect?: {};
|
95
|
+
Typography?: TypographyComponentToken;
|
96
|
+
Timeline?: TimelineComponentToken;
|
97
|
+
Transfer?: TransferComponentToken;
|
98
|
+
Tabs?: TabsComponentToken;
|
99
|
+
Calendar?: CalendarComponentToken;
|
100
|
+
Steps?: StepsComponentToken;
|
101
|
+
Menu?: MenuComponentToken;
|
102
|
+
Modal?: ModalComponentToken;
|
103
|
+
Message?: MessageComponentToken;
|
104
|
+
Upload?: UploadComponentToken;
|
105
|
+
Tooltip?: TooltipComponentToken;
|
106
|
+
Table?: TableComponentToken;
|
107
|
+
Space?: SpaceComponentToken;
|
108
|
+
Progress?: ProgressComponentToken;
|
109
|
+
Tour?: TourComponentToken;
|
110
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import type { ComponentTokenMap } from './components';
|
2
|
+
import type { AliasToken } from './alias';
|
3
|
+
export type OverrideToken = {
|
4
|
+
[key in keyof ComponentTokenMap]: Partial<ComponentTokenMap[key]> & Partial<AliasToken>;
|
5
|
+
};
|
6
|
+
/** Final token which contains the components level override */
|
7
|
+
export type GlobalToken = AliasToken & ComponentTokenMap;
|
8
|
+
export { PresetColors } from './presetColors';
|
9
|
+
export type { PresetColorType, ColorPalettes } from './presetColors';
|
10
|
+
export type { SeedToken } from './seeds';
|
11
|
+
export type { MapToken, ColorMapToken, ColorNeutralMapToken, CommonMapToken, HeightMapToken, SizeMapToken, FontSizeMapToken, StyleMapToken, } from './maps';
|
12
|
+
export type { AliasToken } from './alias';
|
13
|
+
export type { ComponentTokenMap } from './components';
|
@@ -0,0 +1 @@
|
|
1
|
+
export { PresetColors } from "./presetColors";
|
@@ -0,0 +1,342 @@
|
|
1
|
+
export interface ColorNeutralMapToken {
|
2
|
+
/**
|
3
|
+
* @nameZH 一级文本色
|
4
|
+
* @desc 最深的文本色。为了符合W3C标准,默认的文本颜色使用了该色,同时这个颜色也是最深的中性色。
|
5
|
+
*/
|
6
|
+
colorText: string;
|
7
|
+
/**
|
8
|
+
* @nameZH 二级文本色
|
9
|
+
* @desc 作为第二梯度的文本色,一般用在不那么需要强化文本颜色的场景,例如 Label 文本、Menu 的文本选中态等场景。
|
10
|
+
*/
|
11
|
+
colorTextSecondary: string;
|
12
|
+
/**
|
13
|
+
* @nameZH 三级文本色
|
14
|
+
* @desc 第三级文本色一般用于描述性文本,例如表单的中的补充说明文本、列表的描述性文本等场景。
|
15
|
+
*/
|
16
|
+
colorTextTertiary: string;
|
17
|
+
/**
|
18
|
+
* @nameZH 四级文本色
|
19
|
+
* @desc 第四级文本色是最浅的文本色,例如表单的输入提示文本、禁用色文本等。
|
20
|
+
*/
|
21
|
+
colorTextQuaternary: string;
|
22
|
+
/**
|
23
|
+
* @nameZH 一级边框色
|
24
|
+
* @nameEN Default Border Color
|
25
|
+
* @desc 默认使用的边框颜色, 用于分割不同的元素,例如:表单的分割线、卡片的分割线等。
|
26
|
+
* @descEN Default border color, used to separate different elements, such as: form separator, card separator, etc.
|
27
|
+
*/
|
28
|
+
colorBorder: string;
|
29
|
+
/**
|
30
|
+
* @nameZH 二级边框色
|
31
|
+
* @nameEN Secondary Border Color
|
32
|
+
* @desc 比默认使用的边框色要浅一级,此颜色和 colorSplit 的颜色一致。使用的是实色。
|
33
|
+
* @descEN Slightly lighter than the default border color, this color is the same as `colorSplit`. Solid color is used.
|
34
|
+
*/
|
35
|
+
colorBorderSecondary: string;
|
36
|
+
/**
|
37
|
+
* @nameZH 一级填充色
|
38
|
+
* @desc 最深的填充色,用于拉开与二、三级填充色的区分度,目前只用在 Slider 的 hover 效果。
|
39
|
+
*/
|
40
|
+
colorFill: string;
|
41
|
+
/**
|
42
|
+
* @nameZH 二级填充色
|
43
|
+
* @desc 二级填充色可以较为明显地勾勒出元素形体,如 Rate、Skeleton 等。也可以作为三级填充色的 Hover 状态,如 Table 等。
|
44
|
+
*/
|
45
|
+
colorFillSecondary: string;
|
46
|
+
/**
|
47
|
+
* @nameZH 三级填充色
|
48
|
+
* @desc 三级填充色用于勾勒出元素形体的场景,如 Slider、Segmented 等。如无强调需求的情况下,建议使用三级填色作为默认填色。
|
49
|
+
*/
|
50
|
+
colorFillTertiary: string;
|
51
|
+
/**
|
52
|
+
* @nameZH 四级填充色
|
53
|
+
* @desc 最弱一级的填充色,适用于不易引起注意的色块,例如斑马纹、区分边界的色块等。
|
54
|
+
*/
|
55
|
+
colorFillQuaternary: string;
|
56
|
+
/**
|
57
|
+
* @nameZH 布局背景色
|
58
|
+
* @desc 该色用于页面整体布局的背景色,只有需要在页面中处于 B1 的视觉层级时才会使用该 token,其他用法都是错误的
|
59
|
+
*/
|
60
|
+
colorBgLayout: string;
|
61
|
+
/**
|
62
|
+
* @nameZH 组件容器背景色
|
63
|
+
* @desc 组件的容器背景色,例如:默认按钮、输入框等。务必不要将其与 `colorBgElevated` 混淆。
|
64
|
+
*/
|
65
|
+
colorBgContainer: string;
|
66
|
+
/**
|
67
|
+
* @nameZH 浮层容器背景色
|
68
|
+
* @desc 浮层容器背景色,在暗色模式下该 token 的色值会比 `colorBgContainer` 要亮一些。例如:模态框、弹出框、菜单等。
|
69
|
+
*/
|
70
|
+
colorBgElevated: string;
|
71
|
+
/**
|
72
|
+
* @nameZH 引起注意的背景色
|
73
|
+
* @desc 该色用于引起用户强烈关注注意的背景色,目前只用在 Tooltip 的背景色上。
|
74
|
+
*/
|
75
|
+
colorBgSpotlight: string;
|
76
|
+
}
|
77
|
+
/**
|
78
|
+
* 品牌色梯度变量
|
79
|
+
*/
|
80
|
+
interface ColorPrimaryMapToken {
|
81
|
+
/**
|
82
|
+
* @nameZH 品牌主色
|
83
|
+
* @desc 品牌色是体现产品特性和传播理念最直观的视觉元素之一,用于产品的主色调、主按钮、主图标、主文本等 */
|
84
|
+
colorPrimary: string;
|
85
|
+
/**
|
86
|
+
* @nameZH 主色浅色背景色
|
87
|
+
* @nameEN Light Background Color of Primary Color
|
88
|
+
* @desc 主色浅色背景颜色,一般用于视觉层级较弱的选中状态。
|
89
|
+
* @descEN Light background color of primary color, usually used for weak visual level selection state.
|
90
|
+
*/
|
91
|
+
colorPrimaryBg: string;
|
92
|
+
/**
|
93
|
+
* @nameZH 主色浅色背景悬浮态
|
94
|
+
* @desc 与主色浅色背景颜色相对应的悬浮态颜色。
|
95
|
+
*/
|
96
|
+
colorPrimaryBgHover: string;
|
97
|
+
/**
|
98
|
+
* @nameZH 主色描边色
|
99
|
+
* @desc 主色梯度下的描边用色,用在 Slider 组件的描边上
|
100
|
+
*/
|
101
|
+
colorPrimaryBorder: string;
|
102
|
+
/**
|
103
|
+
* @nameZH 主色描边色悬浮态
|
104
|
+
* @desc 主色梯度下的描边用色的悬浮态,Slider 、Button 等组件的描边 Hover 时会使用
|
105
|
+
*/
|
106
|
+
colorPrimaryBorderHover: string;
|
107
|
+
/**
|
108
|
+
* @nameZH 主色悬浮态
|
109
|
+
* @desc 主色梯度下的悬浮态,使用频率很高
|
110
|
+
*/
|
111
|
+
colorPrimaryHover: string;
|
112
|
+
/**
|
113
|
+
* @nameZH 主色激活态
|
114
|
+
* @desc 主色梯度下的深色激活态
|
115
|
+
*/
|
116
|
+
colorPrimaryActive: string;
|
117
|
+
/**
|
118
|
+
* @nameZH 主色文本悬浮态
|
119
|
+
* @desc 主色梯度下的文本悬浮态
|
120
|
+
*/
|
121
|
+
colorPrimaryTextHover: string;
|
122
|
+
/**
|
123
|
+
* @nameZH 主色文本
|
124
|
+
* @desc 主色梯度下的文本颜色
|
125
|
+
*/
|
126
|
+
colorPrimaryText: string;
|
127
|
+
/**
|
128
|
+
* @nameZH 主色文本
|
129
|
+
* @desc 主色梯度下的文本激活态
|
130
|
+
*/
|
131
|
+
colorPrimaryTextActive: string;
|
132
|
+
}
|
133
|
+
interface ColorSuccessMapToken {
|
134
|
+
/**
|
135
|
+
* @nameZH 成功色的浅色背景颜色
|
136
|
+
* @nameEN Light Background Color of Success Color
|
137
|
+
* @desc 成功色的浅色背景颜色,用于 Tag 和 Alert 的成功态背景色
|
138
|
+
* @descEN Light background color of success color, used for Tag and Alert success state background color
|
139
|
+
*/
|
140
|
+
colorSuccessBg: string;
|
141
|
+
/**
|
142
|
+
* @nameZH 成功色的浅色背景色悬浮态
|
143
|
+
* @nameEN Hover State Color of Light Success Background
|
144
|
+
* @desc 成功色浅色背景颜色,一般用于视觉层级较弱的选中状态,不过 antd 目前没有使用到该 token
|
145
|
+
* @descEN Light background color of success color, but antd does not use this token currently
|
146
|
+
*/
|
147
|
+
colorSuccessBgHover: string;
|
148
|
+
/**
|
149
|
+
* @nameZH 成功色的描边色
|
150
|
+
* @desc 成功色的描边色,用于 Tag 和 Alert 的成功态描边色
|
151
|
+
*/
|
152
|
+
colorSuccessBorder: string;
|
153
|
+
/**
|
154
|
+
* @nameZH 成功色的描边色悬浮态
|
155
|
+
* @desc 成功色的描边色悬浮态
|
156
|
+
*/
|
157
|
+
colorSuccessBorderHover: string;
|
158
|
+
/**
|
159
|
+
* @nameZH 成功色的深色悬浮态
|
160
|
+
* @desc 成功色的深色悬浮态
|
161
|
+
*/
|
162
|
+
colorSuccessHover: string;
|
163
|
+
/**
|
164
|
+
* @nameZH 成功色
|
165
|
+
* @desc 默认的成功色,如 Result、Progress 等组件中都有使用该颜色
|
166
|
+
*/
|
167
|
+
colorSuccess: string;
|
168
|
+
/**
|
169
|
+
* @nameZH 成功色的深色激活态
|
170
|
+
* @desc 成功色的深色激活态
|
171
|
+
*/
|
172
|
+
colorSuccessActive: string;
|
173
|
+
/**
|
174
|
+
* @nameZH 成功色的文本悬浮态
|
175
|
+
* @desc 成功色的文本悬浮态
|
176
|
+
*/
|
177
|
+
colorSuccessTextHover: string;
|
178
|
+
/**
|
179
|
+
* @nameZH 成功色的文本默认态
|
180
|
+
* @desc 成功色的文本默认态
|
181
|
+
*/
|
182
|
+
colorSuccessText: string;
|
183
|
+
/**
|
184
|
+
* @nameZH 成功色的文本激活态
|
185
|
+
* @desc 成功色的文本激活态
|
186
|
+
*/
|
187
|
+
colorSuccessTextActive: string;
|
188
|
+
}
|
189
|
+
interface ColorWarningMapToken {
|
190
|
+
/**
|
191
|
+
* @nameZH 警戒色的浅色背景颜色
|
192
|
+
*/
|
193
|
+
colorWarningBg: string;
|
194
|
+
/**
|
195
|
+
* @nameZH 警戒色的浅色背景色悬浮态
|
196
|
+
* @desc 警戒色的浅色背景色悬浮态
|
197
|
+
*/
|
198
|
+
colorWarningBgHover: string;
|
199
|
+
/**
|
200
|
+
* @nameZH 警戒色的描边色
|
201
|
+
* @desc 警戒色的描边色
|
202
|
+
*/
|
203
|
+
colorWarningBorder: string;
|
204
|
+
/**
|
205
|
+
* @nameZH 警戒色的描边色悬浮态
|
206
|
+
* @desc 警戒色的描边色悬浮态
|
207
|
+
*/
|
208
|
+
colorWarningBorderHover: string;
|
209
|
+
/**
|
210
|
+
* @nameZH 警戒色的深色悬浮态
|
211
|
+
* @desc 警戒色的深色悬浮态
|
212
|
+
*/
|
213
|
+
colorWarningHover: string;
|
214
|
+
/**
|
215
|
+
* @nameZH 警戒色
|
216
|
+
* @desc 最常用的警戒色,例如 Notification、 Alert等警告类组件或 Input 输入类等组件会使用该颜色
|
217
|
+
*/
|
218
|
+
colorWarning: string;
|
219
|
+
/**
|
220
|
+
* @nameZH 警戒色的深色激活态
|
221
|
+
* @desc 警戒色的深色激活态
|
222
|
+
*/
|
223
|
+
colorWarningActive: string;
|
224
|
+
/**
|
225
|
+
* @nameZH 警戒色的文本悬浮态
|
226
|
+
* @desc 警戒色的文本悬浮态
|
227
|
+
*/
|
228
|
+
colorWarningTextHover: string;
|
229
|
+
/**
|
230
|
+
* @nameZH 警戒色的文本默认态
|
231
|
+
* @desc 警戒色的文本默认态
|
232
|
+
*/
|
233
|
+
colorWarningText: string;
|
234
|
+
/**
|
235
|
+
* @nameZH 警戒色的文本激活态
|
236
|
+
* @desc 警戒色的文本激活态
|
237
|
+
*/
|
238
|
+
colorWarningTextActive: string;
|
239
|
+
}
|
240
|
+
interface ColorInfoMapToken {
|
241
|
+
/**
|
242
|
+
* @nameZH 信息色的浅色背景颜色
|
243
|
+
* @desc 信息色的浅色背景颜色
|
244
|
+
*/
|
245
|
+
colorInfoBg: string;
|
246
|
+
/**
|
247
|
+
* @nameZH 信息色的浅色背景色悬浮态
|
248
|
+
* @desc 信息色的浅色背景色悬浮态
|
249
|
+
*/
|
250
|
+
colorInfoBgHover: string;
|
251
|
+
/**
|
252
|
+
* @nameZH 信息色的描边色
|
253
|
+
*/
|
254
|
+
colorInfoBorder: string;
|
255
|
+
/**
|
256
|
+
* @nameZH 信息色的描边色悬浮态
|
257
|
+
*/
|
258
|
+
colorInfoBorderHover: string;
|
259
|
+
/**
|
260
|
+
* @nameZH 信息色的深色悬浮态
|
261
|
+
*/
|
262
|
+
colorInfoHover: string;
|
263
|
+
/**
|
264
|
+
* @nameZH 信息色
|
265
|
+
*/
|
266
|
+
colorInfo: string;
|
267
|
+
/**
|
268
|
+
* @nameZH 信息色的深色激活态
|
269
|
+
*/
|
270
|
+
colorInfoActive: string;
|
271
|
+
/**
|
272
|
+
* @nameZH 信息色的文本悬浮态
|
273
|
+
*/
|
274
|
+
colorInfoTextHover: string;
|
275
|
+
/**
|
276
|
+
* @nameZH 信息色的文本默认态
|
277
|
+
*/
|
278
|
+
colorInfoText: string;
|
279
|
+
/**
|
280
|
+
* @nameZH 信息色的文本激活态
|
281
|
+
*/
|
282
|
+
colorInfoTextActive: string;
|
283
|
+
}
|
284
|
+
interface ColorErrorMapToken {
|
285
|
+
/**
|
286
|
+
* @nameZH 错误色的浅色背景颜色
|
287
|
+
*/
|
288
|
+
colorErrorBg: string;
|
289
|
+
/**
|
290
|
+
* @nameZH 错误色的浅色背景色悬浮态
|
291
|
+
*/
|
292
|
+
colorErrorBgHover: string;
|
293
|
+
/**
|
294
|
+
* @nameZH 错误色的描边色
|
295
|
+
*/
|
296
|
+
colorErrorBorder: string;
|
297
|
+
/**
|
298
|
+
* @nameZH 错误色的描边色悬浮态
|
299
|
+
*/
|
300
|
+
colorErrorBorderHover: string;
|
301
|
+
/**
|
302
|
+
* @nameZH 错误色的深色悬浮态
|
303
|
+
*/
|
304
|
+
colorErrorHover: string;
|
305
|
+
/**
|
306
|
+
* @nameZH 错误色
|
307
|
+
*/
|
308
|
+
colorError: string;
|
309
|
+
/**
|
310
|
+
* @nameZH 错误色的深色激活态
|
311
|
+
*/
|
312
|
+
colorErrorActive: string;
|
313
|
+
/**
|
314
|
+
* @nameZH 错误色的文本悬浮态
|
315
|
+
*/
|
316
|
+
colorErrorTextHover: string;
|
317
|
+
/**
|
318
|
+
* @nameZH 错误色的文本默认态
|
319
|
+
*/
|
320
|
+
colorErrorText: string;
|
321
|
+
/**
|
322
|
+
* @nameZH 错误色的文本激活态
|
323
|
+
*/
|
324
|
+
colorErrorTextActive: string;
|
325
|
+
}
|
326
|
+
export interface ColorMapToken extends ColorNeutralMapToken, ColorPrimaryMapToken, ColorSuccessMapToken, ColorWarningMapToken, ColorErrorMapToken, ColorInfoMapToken {
|
327
|
+
/**
|
328
|
+
* @nameZH 纯白色
|
329
|
+
* @desc 不随主题变化的纯白色
|
330
|
+
* @descEN Pure white color don't changed by theme
|
331
|
+
* @default #FFFFFF
|
332
|
+
*/
|
333
|
+
colorWhite: string;
|
334
|
+
/**
|
335
|
+
* @nameZH 浮层的背景蒙层颜色
|
336
|
+
* @nameEN Background color of the mask
|
337
|
+
* @desc 浮层的背景蒙层颜色,用于遮罩浮层下面的内容,Modal、Drawer 等组件的蒙层使用的是该 token
|
338
|
+
* @descEN The background color of the mask, used to cover the content below the mask, Modal, Drawer and other components use this token
|
339
|
+
*/
|
340
|
+
colorBgMask: string;
|
341
|
+
}
|
342
|
+
export {};
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import type { ColorPalettes } from '../presetColors';
|
2
|
+
import type { SeedToken } from '../seeds';
|
3
|
+
import type { SizeMapToken, HeightMapToken, FontSizeMapToken } from './size';
|
4
|
+
import type { ColorMapToken } from './colors';
|
5
|
+
import type { StyleMapToken } from './style';
|
6
|
+
export * from './colors';
|
7
|
+
export * from './style';
|
8
|
+
export * from './size';
|
9
|
+
export interface CommonMapToken extends FontSizeMapToken, StyleMapToken {
|
10
|
+
motionDurationFast: string;
|
11
|
+
motionDurationMid: string;
|
12
|
+
motionDurationSlow: string;
|
13
|
+
}
|
14
|
+
export interface MapToken extends SeedToken, ColorPalettes, ColorMapToken, SizeMapToken, HeightMapToken, StyleMapToken, CommonMapToken {
|
15
|
+
}
|