You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

272 lines
9.9 KiB

import type { PresetColorType } from './presetColors';
// ======================================================================
// == Seed Token ==
// ======================================================================
// 🔥🔥🔥🔥🔥🔥🔥 DO NOT MODIFY THIS. PLEASE CONTACT DESIGNER. 🔥🔥🔥🔥🔥🔥🔥
export interface SeedToken extends PresetColorType {
// ---------- Color ---------- //
/**
* @nameZH
* @nameEN Brand Color
* @desc
* @descEN Brand color is one of the most direct visual elements to reflect the characteristics and communication of the product. After you have selected the brand color, we will automatically generate a complete color palette and assign it effective design semantics.
*/
colorPrimary: string;
/**
* @nameZH
* @nameEN Success Color
* @desc Token ResultProgress 使
* @descEN Used to represent the token sequence of operation success, such as Result, Progress and other components will use these map tokens.
*/
colorSuccess: string;
/**
* @nameZH
* @nameEN Warning Color
* @desc Token Notification Alert等警告类组件或 Input 使
* @descEN Used to represent the warning map token, such as Notification, Alert, etc. Alert or Control component(like Input) will use these map tokens.
*/
colorWarning: string;
/**
* @nameZH
* @nameEN Error Color
* @desc Token Result
* @descEN Used to represent the visual elements of the operation failure, such as the error Button, error Result component, etc.
*/
colorError: string;
/**
* @nameZH
* @nameEN Info Color
* @desc Token Alert Tag Progress
* @descEN Used to represent the operation information of the Token sequence, such as Alert, Tag, Progress, and other components use these map tokens.
*/
colorInfo: string;
/**
* @nameZH
* @nameEN Seed Text Color
* @desc v5 使 Seed Token
* @descEN Used to derive the base variable of the text color gradient. In v5, we added a layer of text color derivation algorithm to produce gradient variables of text color gradient. But please do not use this Seed Token directly in the code!
*/
colorTextBase: string;
/**
* @nameZH
* @nameEN Seed Background Color
* @desc v5 使 Seed Token
* @descEN Used to derive the base variable of the background color gradient. In v5, we added a layer of background color derivation algorithm to produce map token of background color. But PLEASE DO NOT USE this Seed Token directly in the code!
*/
colorBgBase: string;
// ---------- Font ---------- //
/**
* @nameZH
* @nameEN Font family for default text
* @desc Ant Design 使
* @descEN The font family of Ant Design prioritizes the default interface font of the system, and provides a set of alternative font libraries that are suitable for screen display to maintain the readability and readability of the font under different platforms and browsers, reflecting the friendly, stable and professional characteristics.
*/
fontFamily: string;
/**
* @nameZH
* @nameEN Font family for code text
* @desc Typography codepre kbd
* @descEN Code font, used for code, pre and kbd elements in Typography
*/
fontFamilyCode: string;
/**
* @nameZH
* @nameEN Default Font Size
* @desc 使广
* @descEN The most widely used font size in the design system, from which the text gradient will be derived.
* @default 14
*/
fontSize: number;
// ---------- Line ---------- //
/**
* @nameZH 线
* @nameEN Base Line Width
* @desc 线
* @descEN Border width of base components
*/
lineWidth: number;
/**
* @nameZH 线
* @nameEN Line Style
* @desc 线线
* @descEN Border style of base components
*/
lineType: string;
// ---------- BorderRadius ---------- //
/**
* @nameZH
* @nameEN Base Border Radius
* @descEN Border radius of base components
* @desc
*/
borderRadius: number;
// ---------- Size ---------- //
/**
* @nameZH
* @nameEN Size Change Unit
* @desc Ant Design 4 便
* @descEN The unit of size change, in Ant Design, our base unit is 4, which is more fine-grained control of the size step
* @default 4
*/
sizeUnit: number;
/**
* @nameZH
* @nameEN Size Base Step
* @desc V5 2
* @descEN The base step of size change, the size step combined with the size change unit, can derive various size steps. By adjusting the step, you can get different layout modes, such as the size step of the compact mode of V5 is 2
* @default 4
*/
sizeStep: number;
/**
* @nameZH
* @desc
* @descEN The size of the component arrow
*/
sizePopupArrow: number;
/**
* @nameZH
* @nameEN Base Control Height
* @desc Ant Design
* @descEN The height of the basic controls such as buttons and input boxes in Ant Design
* @default 32
*/
controlHeight: number;
// ---------- zIndex ---------- //
/**
* @nameZH zIndex
* @nameEN Base zIndex
* @desc Z Z BackTop Affix
* @descEN The base Z axis value of all components, which can be used to control the level of some floating components based on the Z axis value, such as BackTop, Affix, etc.
*
* @default 0
*/
zIndexBase: number;
/**
* @nameZH zIndex
* @nameEN popup base zIndex
* @desc Z Z FloatButton AffixModal
* @descEN Base zIndex of component like FloatButton, Affix which can be cover by large popup
* @default 1000
*/
zIndexPopupBase: number;
// ---------- Opacity ---------- //
/**
* @nameZH
* @nameEN Define default Image opacity. Useful when in dark-like theme
*/
opacityImage: number;
// ---------- motion ---------- //
// TODO: 缺一个懂 motion 的人来收敛 Motion 相关的 Token
/**
* @nameZH
* @nameEN Animation Duration Unit
* @desc
* @descEN The unit of animation duration change
* @default 100ms
*/
motionUnit: number;
/**
* @nameZH
* @nameEN Animation Base Duration.
*/
motionBase: number;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseOutCirc: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseInOutCirc: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseInOut: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseOutBack: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseInBack: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseInQuint: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseOutQuint: string;
/**
* @desc
* @descEN Preset motion curve.
*/
motionEaseOut: string;
// ---------- Style ---------- //
/**
* @nameZH 线
* @nameEN Wireframe Style
* @desc 线使 V4
* @descEN Used to change the visual effect of the component to wireframe, if you need to use the V4 effect, you need to enable the configuration item
* @default false
*/
wireframe: boolean;
/**
* @nameZH
* @nameEN Motion Style
* @desc `false`
* @descEN Used to configure the motion effect, when it is `false`, the motion is turned off
* @default false
*/
motion: boolean;
}