first commit
This commit is contained in:
21
frontend/node_modules/antd/es/input/style/index.d.ts
generated
vendored
Normal file
21
frontend/node_modules/antd/es/input/style/index.d.ts
generated
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
import type { CSSObject } from '@ant-design/cssinjs';
|
||||
import type { GenerateStyle } from '../../theme/internal';
|
||||
import type { ComponentToken, InputToken } from './token';
|
||||
import { initComponentToken, initInputToken } from './token';
|
||||
export type { ComponentToken };
|
||||
export { initComponentToken, initInputToken };
|
||||
export declare const genPlaceholderStyle: (color: string) => CSSObject;
|
||||
export declare const genActiveStyle: (token: InputToken) => {
|
||||
borderColor: string;
|
||||
boxShadow: string;
|
||||
outline: number;
|
||||
backgroundColor: string;
|
||||
};
|
||||
export declare const genInputSmallStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genBasicInputStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genInputGroupStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genInputStyle: GenerateStyle<InputToken>;
|
||||
export declare const genAffixStyle: GenerateStyle<InputToken>;
|
||||
export declare const useSharedStyle: (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
|
||||
declare const _default: (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
|
||||
export default _default;
|
||||
661
frontend/node_modules/antd/es/input/style/index.js
generated
vendored
Normal file
661
frontend/node_modules/antd/es/input/style/index.js
generated
vendored
Normal file
@@ -0,0 +1,661 @@
|
||||
import { unit } from '@ant-design/cssinjs';
|
||||
import { clearFix, resetComponent } from '../../style';
|
||||
import { genCompactItemStyle } from '../../style/compact-item';
|
||||
import { genStyleHooks, mergeToken } from '../../theme/internal';
|
||||
import { initComponentToken, initInputToken } from './token';
|
||||
import { genBorderlessStyle, genFilledGroupStyle, genFilledStyle, genOutlinedGroupStyle, genOutlinedStyle, genUnderlinedStyle } from './variants';
|
||||
export { initComponentToken, initInputToken };
|
||||
export const genPlaceholderStyle = color => ({
|
||||
// Firefox
|
||||
'&::-moz-placeholder': {
|
||||
opacity: 1
|
||||
},
|
||||
'&::placeholder': {
|
||||
color,
|
||||
userSelect: 'none' // https://github.com/ant-design/ant-design/pull/32639
|
||||
},
|
||||
'&:placeholder-shown': {
|
||||
textOverflow: 'ellipsis'
|
||||
}
|
||||
});
|
||||
export const genActiveStyle = token => ({
|
||||
borderColor: token.activeBorderColor,
|
||||
boxShadow: token.activeShadow,
|
||||
outline: 0,
|
||||
backgroundColor: token.activeBg
|
||||
});
|
||||
const genInputLargeStyle = token => {
|
||||
const {
|
||||
paddingBlockLG,
|
||||
lineHeightLG,
|
||||
borderRadiusLG,
|
||||
paddingInlineLG
|
||||
} = token;
|
||||
return {
|
||||
padding: `${unit(paddingBlockLG)} ${unit(paddingInlineLG)}`,
|
||||
fontSize: token.inputFontSizeLG,
|
||||
lineHeight: lineHeightLG,
|
||||
borderRadius: borderRadiusLG
|
||||
};
|
||||
};
|
||||
export const genInputSmallStyle = token => ({
|
||||
padding: `${unit(token.paddingBlockSM)} ${unit(token.paddingInlineSM)}`,
|
||||
fontSize: token.inputFontSizeSM,
|
||||
borderRadius: token.borderRadiusSM
|
||||
});
|
||||
export const genBasicInputStyle = token => Object.assign(Object.assign({
|
||||
position: 'relative',
|
||||
display: 'inline-block',
|
||||
width: '100%',
|
||||
minWidth: 0,
|
||||
padding: `${unit(token.paddingBlock)} ${unit(token.paddingInline)}`,
|
||||
color: token.colorText,
|
||||
fontSize: token.inputFontSize,
|
||||
lineHeight: token.lineHeight,
|
||||
borderRadius: token.borderRadius,
|
||||
transition: `all ${token.motionDurationMid}`
|
||||
}, genPlaceholderStyle(token.colorTextPlaceholder)), {
|
||||
// Size
|
||||
'&-lg': Object.assign({}, genInputLargeStyle(token)),
|
||||
'&-sm': Object.assign({}, genInputSmallStyle(token)),
|
||||
// RTL
|
||||
'&-rtl, &-textarea-rtl': {
|
||||
direction: 'rtl'
|
||||
}
|
||||
});
|
||||
export const genInputGroupStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
antCls
|
||||
} = token;
|
||||
return {
|
||||
position: 'relative',
|
||||
display: 'table',
|
||||
width: '100%',
|
||||
borderCollapse: 'separate',
|
||||
borderSpacing: 0,
|
||||
// Undo padding and float of grid classes
|
||||
"&[class*='col-']": {
|
||||
paddingInlineEnd: token.paddingXS,
|
||||
'&:last-child': {
|
||||
paddingInlineEnd: 0
|
||||
}
|
||||
},
|
||||
// Sizing options
|
||||
[`&-lg ${componentCls}, &-lg > ${componentCls}-group-addon`]: Object.assign({}, genInputLargeStyle(token)),
|
||||
[`&-sm ${componentCls}, &-sm > ${componentCls}-group-addon`]: Object.assign({}, genInputSmallStyle(token)),
|
||||
// Fix https://github.com/ant-design/ant-design/issues/5754
|
||||
[`&-lg ${antCls}-select-single ${antCls}-select-selector`]: {
|
||||
height: token.controlHeightLG
|
||||
},
|
||||
[`&-sm ${antCls}-select-single ${antCls}-select-selector`]: {
|
||||
height: token.controlHeightSM
|
||||
},
|
||||
[`> ${componentCls}`]: {
|
||||
display: 'table-cell',
|
||||
'&:not(:first-child):not(:last-child)': {
|
||||
borderRadius: 0
|
||||
}
|
||||
},
|
||||
[`${componentCls}-group`]: {
|
||||
'&-addon, &-wrap': {
|
||||
display: 'table-cell',
|
||||
width: 1,
|
||||
whiteSpace: 'nowrap',
|
||||
verticalAlign: 'middle',
|
||||
'&:not(:first-child):not(:last-child)': {
|
||||
borderRadius: 0
|
||||
}
|
||||
},
|
||||
'&-wrap > *': {
|
||||
display: 'block !important'
|
||||
},
|
||||
'&-addon': {
|
||||
position: 'relative',
|
||||
padding: `0 ${unit(token.paddingInline)}`,
|
||||
color: token.colorText,
|
||||
fontWeight: 'normal',
|
||||
fontSize: token.inputFontSize,
|
||||
textAlign: 'center',
|
||||
borderRadius: token.borderRadius,
|
||||
transition: `all ${token.motionDurationSlow}`,
|
||||
lineHeight: 1,
|
||||
// Reset Select's style in addon
|
||||
[`${antCls}-select`]: {
|
||||
margin: `${unit(token.calc(token.paddingBlock).add(1).mul(-1).equal())} ${unit(token.calc(token.paddingInline).mul(-1).equal())}`,
|
||||
[`&${antCls}-select-single:not(${antCls}-select-customize-input):not(${antCls}-pagination-size-changer)`]: {
|
||||
[`${antCls}-select-selector`]: {
|
||||
backgroundColor: 'inherit',
|
||||
border: `${unit(token.lineWidth)} ${token.lineType} transparent`,
|
||||
boxShadow: 'none'
|
||||
}
|
||||
}
|
||||
},
|
||||
// https://github.com/ant-design/ant-design/issues/31333
|
||||
[`${antCls}-cascader-picker`]: {
|
||||
margin: `-9px ${unit(token.calc(token.paddingInline).mul(-1).equal())}`,
|
||||
backgroundColor: 'transparent',
|
||||
[`${antCls}-cascader-input`]: {
|
||||
textAlign: 'start',
|
||||
border: 0,
|
||||
boxShadow: 'none'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
[componentCls]: {
|
||||
width: '100%',
|
||||
marginBottom: 0,
|
||||
textAlign: 'inherit',
|
||||
'&:focus': {
|
||||
zIndex: 1,
|
||||
// Fix https://gw.alipayobjects.com/zos/rmsportal/DHNpoqfMXSfrSnlZvhsJ.png
|
||||
borderInlineEndWidth: 1
|
||||
},
|
||||
'&:hover': {
|
||||
zIndex: 1,
|
||||
borderInlineEndWidth: 1,
|
||||
[`${componentCls}-search-with-button &`]: {
|
||||
zIndex: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
// Reset rounded corners
|
||||
[`> ${componentCls}:first-child, ${componentCls}-group-addon:first-child`]: {
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0,
|
||||
// Reset Select's style in addon
|
||||
[`${antCls}-select ${antCls}-select-selector`]: {
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0
|
||||
}
|
||||
},
|
||||
[`> ${componentCls}-affix-wrapper`]: {
|
||||
[`&:not(:first-child) ${componentCls}`]: {
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0
|
||||
},
|
||||
[`&:not(:last-child) ${componentCls}`]: {
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0
|
||||
}
|
||||
},
|
||||
[`> ${componentCls}:last-child, ${componentCls}-group-addon:last-child`]: {
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0,
|
||||
// Reset Select's style in addon
|
||||
[`${antCls}-select ${antCls}-select-selector`]: {
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0
|
||||
}
|
||||
},
|
||||
[`${componentCls}-affix-wrapper`]: {
|
||||
'&:not(:last-child)': {
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0,
|
||||
[`${componentCls}-search &`]: {
|
||||
borderStartStartRadius: token.borderRadius,
|
||||
borderEndStartRadius: token.borderRadius
|
||||
}
|
||||
},
|
||||
[`&:not(:first-child), ${componentCls}-search &:not(:first-child)`]: {
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0
|
||||
}
|
||||
},
|
||||
[`&${componentCls}-group-compact`]: Object.assign(Object.assign({
|
||||
display: 'block'
|
||||
}, clearFix()), {
|
||||
[`${componentCls}-group-addon, ${componentCls}-group-wrap, > ${componentCls}`]: {
|
||||
'&:not(:first-child):not(:last-child)': {
|
||||
borderInlineEndWidth: token.lineWidth,
|
||||
'&:hover, &:focus': {
|
||||
zIndex: 1
|
||||
}
|
||||
}
|
||||
},
|
||||
'& > *': {
|
||||
display: 'inline-flex',
|
||||
float: 'none',
|
||||
verticalAlign: 'top',
|
||||
// https://github.com/ant-design/ant-design-pro/issues/139
|
||||
borderRadius: 0
|
||||
},
|
||||
[`
|
||||
& > ${componentCls}-affix-wrapper,
|
||||
& > ${componentCls}-number-affix-wrapper,
|
||||
& > ${antCls}-picker-range
|
||||
`]: {
|
||||
display: 'inline-flex'
|
||||
},
|
||||
'& > *:not(:last-child)': {
|
||||
marginInlineEnd: token.calc(token.lineWidth).mul(-1).equal(),
|
||||
borderInlineEndWidth: token.lineWidth
|
||||
},
|
||||
// Undo float for .ant-input-group .ant-input
|
||||
[componentCls]: {
|
||||
float: 'none'
|
||||
},
|
||||
// reset border for Select, DatePicker, AutoComplete, Cascader, Mention, TimePicker, Input
|
||||
[`& > ${antCls}-select > ${antCls}-select-selector,
|
||||
& > ${antCls}-select-auto-complete ${componentCls},
|
||||
& > ${antCls}-cascader-picker ${componentCls},
|
||||
& > ${componentCls}-group-wrapper ${componentCls}`]: {
|
||||
borderInlineEndWidth: token.lineWidth,
|
||||
borderRadius: 0,
|
||||
'&:hover, &:focus': {
|
||||
zIndex: 1
|
||||
}
|
||||
},
|
||||
[`& > ${antCls}-select-focused`]: {
|
||||
zIndex: 1
|
||||
},
|
||||
// update z-index for arrow icon
|
||||
[`& > ${antCls}-select > ${antCls}-select-arrow`]: {
|
||||
zIndex: 1 // https://github.com/ant-design/ant-design/issues/20371
|
||||
},
|
||||
[`& > *:first-child,
|
||||
& > ${antCls}-select:first-child > ${antCls}-select-selector,
|
||||
& > ${antCls}-select-auto-complete:first-child ${componentCls},
|
||||
& > ${antCls}-cascader-picker:first-child ${componentCls}`]: {
|
||||
borderStartStartRadius: token.borderRadius,
|
||||
borderEndStartRadius: token.borderRadius
|
||||
},
|
||||
[`& > *:last-child,
|
||||
& > ${antCls}-select:last-child > ${antCls}-select-selector,
|
||||
& > ${antCls}-cascader-picker:last-child ${componentCls},
|
||||
& > ${antCls}-cascader-picker-focused:last-child ${componentCls}`]: {
|
||||
borderInlineEndWidth: token.lineWidth,
|
||||
borderStartEndRadius: token.borderRadius,
|
||||
borderEndEndRadius: token.borderRadius
|
||||
},
|
||||
// https://github.com/ant-design/ant-design/issues/12493
|
||||
[`& > ${antCls}-select-auto-complete ${componentCls}`]: {
|
||||
verticalAlign: 'top'
|
||||
},
|
||||
[`${componentCls}-group-wrapper + ${componentCls}-group-wrapper`]: {
|
||||
marginInlineStart: token.calc(token.lineWidth).mul(-1).equal(),
|
||||
[`${componentCls}-affix-wrapper`]: {
|
||||
borderRadius: 0
|
||||
}
|
||||
},
|
||||
[`${componentCls}-group-wrapper:not(:last-child)`]: {
|
||||
[`&${componentCls}-search > ${componentCls}-group`]: {
|
||||
[`& > ${componentCls}-group-addon > ${componentCls}-search-button`]: {
|
||||
borderRadius: 0
|
||||
},
|
||||
[`& > ${componentCls}`]: {
|
||||
borderStartStartRadius: token.borderRadius,
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0,
|
||||
borderEndStartRadius: token.borderRadius
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
};
|
||||
};
|
||||
export const genInputStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
controlHeightSM,
|
||||
lineWidth,
|
||||
calc
|
||||
} = token;
|
||||
const FIXED_CHROME_COLOR_HEIGHT = 16;
|
||||
const colorSmallPadding = calc(controlHeightSM).sub(calc(lineWidth).mul(2)).sub(FIXED_CHROME_COLOR_HEIGHT).div(2).equal();
|
||||
return {
|
||||
[componentCls]: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, resetComponent(token)), genBasicInputStyle(token)), genOutlinedStyle(token)), genFilledStyle(token)), genBorderlessStyle(token)), genUnderlinedStyle(token)), {
|
||||
'&[type="color"]': {
|
||||
height: token.controlHeight,
|
||||
[`&${componentCls}-lg`]: {
|
||||
height: token.controlHeightLG
|
||||
},
|
||||
[`&${componentCls}-sm`]: {
|
||||
height: controlHeightSM,
|
||||
paddingTop: colorSmallPadding,
|
||||
paddingBottom: colorSmallPadding
|
||||
}
|
||||
},
|
||||
'&[type="search"]::-webkit-search-cancel-button, &[type="search"]::-webkit-search-decoration': {
|
||||
appearance: 'none'
|
||||
}
|
||||
})
|
||||
};
|
||||
};
|
||||
const genAllowClearStyle = token => {
|
||||
const {
|
||||
componentCls
|
||||
} = token;
|
||||
return {
|
||||
// ========================= Input =========================
|
||||
[`${componentCls}-clear-icon`]: {
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
lineHeight: 0,
|
||||
color: token.colorTextQuaternary,
|
||||
fontSize: token.fontSizeIcon,
|
||||
verticalAlign: -1,
|
||||
// https://github.com/ant-design/ant-design/pull/18151
|
||||
// https://codesandbox.io/s/wizardly-sun-u10br
|
||||
cursor: 'pointer',
|
||||
transition: `color ${token.motionDurationSlow}`,
|
||||
border: 'none',
|
||||
outline: 'none',
|
||||
backgroundColor: 'transparent',
|
||||
'&:hover': {
|
||||
color: token.colorIcon
|
||||
},
|
||||
'&:active': {
|
||||
color: token.colorText
|
||||
},
|
||||
'&-hidden': {
|
||||
visibility: 'hidden'
|
||||
},
|
||||
'&-has-suffix': {
|
||||
margin: `0 ${unit(token.inputAffixPadding)}`
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
export const genAffixStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
inputAffixPadding,
|
||||
colorTextDescription,
|
||||
motionDurationSlow,
|
||||
colorIcon,
|
||||
colorIconHover,
|
||||
iconCls
|
||||
} = token;
|
||||
const affixCls = `${componentCls}-affix-wrapper`;
|
||||
const affixClsDisabled = `${componentCls}-affix-wrapper-disabled`;
|
||||
return {
|
||||
[affixCls]: Object.assign(Object.assign(Object.assign(Object.assign({}, genBasicInputStyle(token)), {
|
||||
display: 'inline-flex',
|
||||
[`&:not(${componentCls}-disabled):hover`]: {
|
||||
zIndex: 1,
|
||||
[`${componentCls}-search-with-button &`]: {
|
||||
zIndex: 0
|
||||
}
|
||||
},
|
||||
'&-focused, &:focus': {
|
||||
zIndex: 1
|
||||
},
|
||||
[`> input${componentCls}`]: {
|
||||
padding: 0
|
||||
},
|
||||
[`> input${componentCls}, > textarea${componentCls}`]: {
|
||||
fontSize: 'inherit',
|
||||
border: 'none',
|
||||
borderRadius: 0,
|
||||
outline: 'none',
|
||||
background: 'transparent',
|
||||
color: 'inherit',
|
||||
'&::-ms-reveal': {
|
||||
display: 'none'
|
||||
},
|
||||
'&:focus': {
|
||||
boxShadow: 'none !important'
|
||||
}
|
||||
},
|
||||
'&::before': {
|
||||
display: 'inline-block',
|
||||
width: 0,
|
||||
visibility: 'hidden',
|
||||
content: '"\\a0"'
|
||||
},
|
||||
[componentCls]: {
|
||||
'&-prefix, &-suffix': {
|
||||
display: 'flex',
|
||||
flex: 'none',
|
||||
alignItems: 'center',
|
||||
'> *:not(:last-child)': {
|
||||
marginInlineEnd: token.paddingXS
|
||||
}
|
||||
},
|
||||
'&-show-count-suffix': {
|
||||
color: colorTextDescription,
|
||||
direction: 'ltr'
|
||||
},
|
||||
'&-show-count-has-suffix': {
|
||||
marginInlineEnd: token.paddingXXS
|
||||
},
|
||||
'&-prefix': {
|
||||
marginInlineEnd: inputAffixPadding
|
||||
},
|
||||
'&-suffix': {
|
||||
marginInlineStart: inputAffixPadding
|
||||
}
|
||||
}
|
||||
}), genAllowClearStyle(token)), {
|
||||
// password
|
||||
[`${iconCls}${componentCls}-password-icon`]: {
|
||||
color: colorIcon,
|
||||
cursor: 'pointer',
|
||||
transition: `all ${motionDurationSlow}`,
|
||||
'&:hover': {
|
||||
color: colorIconHover
|
||||
}
|
||||
}
|
||||
}),
|
||||
// 覆盖 affix-wrapper borderRadius!
|
||||
[`${componentCls}-underlined`]: {
|
||||
borderRadius: 0
|
||||
},
|
||||
[affixClsDisabled]: {
|
||||
// password disabled
|
||||
[`${iconCls}${componentCls}-password-icon`]: {
|
||||
color: colorIcon,
|
||||
cursor: 'not-allowed',
|
||||
'&:hover': {
|
||||
color: colorIcon
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
const genGroupStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
borderRadiusLG,
|
||||
borderRadiusSM
|
||||
} = token;
|
||||
return {
|
||||
[`${componentCls}-group`]: Object.assign(Object.assign(Object.assign({}, resetComponent(token)), genInputGroupStyle(token)), {
|
||||
'&-rtl': {
|
||||
direction: 'rtl'
|
||||
},
|
||||
'&-wrapper': Object.assign(Object.assign(Object.assign({
|
||||
display: 'inline-block',
|
||||
width: '100%',
|
||||
textAlign: 'start',
|
||||
verticalAlign: 'top',
|
||||
'&-rtl': {
|
||||
direction: 'rtl'
|
||||
},
|
||||
// Size
|
||||
'&-lg': {
|
||||
[`${componentCls}-group-addon`]: {
|
||||
borderRadius: borderRadiusLG,
|
||||
fontSize: token.inputFontSizeLG
|
||||
}
|
||||
},
|
||||
'&-sm': {
|
||||
[`${componentCls}-group-addon`]: {
|
||||
borderRadius: borderRadiusSM
|
||||
}
|
||||
}
|
||||
}, genOutlinedGroupStyle(token)), genFilledGroupStyle(token)), {
|
||||
// '&-disabled': {
|
||||
// [`${componentCls}-group-addon`]: {
|
||||
// ...genDisabledStyle(token),
|
||||
// },
|
||||
// },
|
||||
// Fix the issue of using icons in Space Compact mode
|
||||
// https://github.com/ant-design/ant-design/issues/42122
|
||||
[`&:not(${componentCls}-compact-first-item):not(${componentCls}-compact-last-item)${componentCls}-compact-item`]: {
|
||||
[`${componentCls}, ${componentCls}-group-addon`]: {
|
||||
borderRadius: 0
|
||||
}
|
||||
},
|
||||
[`&:not(${componentCls}-compact-last-item)${componentCls}-compact-first-item`]: {
|
||||
[`${componentCls}, ${componentCls}-group-addon`]: {
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0
|
||||
}
|
||||
},
|
||||
[`&:not(${componentCls}-compact-first-item)${componentCls}-compact-last-item`]: {
|
||||
[`${componentCls}, ${componentCls}-group-addon`]: {
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0
|
||||
}
|
||||
},
|
||||
// Fix the issue of input use show-count param in space compact mode
|
||||
// https://github.com/ant-design/ant-design/issues/46872
|
||||
[`&:not(${componentCls}-compact-last-item)${componentCls}-compact-item`]: {
|
||||
[`${componentCls}-affix-wrapper`]: {
|
||||
borderStartEndRadius: 0,
|
||||
borderEndEndRadius: 0
|
||||
}
|
||||
},
|
||||
// Fix the issue of input use `addonAfter` param in space compact mode
|
||||
// https://github.com/ant-design/ant-design/issues/52483
|
||||
[`&:not(${componentCls}-compact-first-item)${componentCls}-compact-item`]: {
|
||||
[`${componentCls}-affix-wrapper`]: {
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
};
|
||||
};
|
||||
const genSearchInputStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
antCls
|
||||
} = token;
|
||||
const searchPrefixCls = `${componentCls}-search`;
|
||||
return {
|
||||
[searchPrefixCls]: {
|
||||
[componentCls]: {
|
||||
'&:not([disabled]):hover, &:not([disabled]):focus': {
|
||||
[`+ ${componentCls}-group-addon ${searchPrefixCls}-button:not(${antCls}-btn-color-primary):not(${antCls}-btn-variant-text)`]: {
|
||||
borderInlineStartColor: token.colorPrimaryHover
|
||||
}
|
||||
}
|
||||
},
|
||||
[`${componentCls}-affix-wrapper`]: {
|
||||
height: token.controlHeight,
|
||||
borderRadius: 0
|
||||
},
|
||||
// fix slight height diff in Firefox:
|
||||
// https://ant.design/components/auto-complete-cn/#auto-complete-demo-certain-category
|
||||
[`${componentCls}-lg`]: {
|
||||
lineHeight: token.calc(token.lineHeightLG).sub(0.0002).equal()
|
||||
},
|
||||
[`> ${componentCls}-group`]: {
|
||||
[`> ${componentCls}-group-addon:last-child`]: {
|
||||
insetInlineStart: -1,
|
||||
padding: 0,
|
||||
border: 0,
|
||||
[`${searchPrefixCls}-button`]: {
|
||||
// Fix https://github.com/ant-design/ant-design/issues/47150
|
||||
marginInlineEnd: -1,
|
||||
borderStartStartRadius: 0,
|
||||
borderEndStartRadius: 0,
|
||||
boxShadow: 'none'
|
||||
},
|
||||
[`${searchPrefixCls}-button:not(${antCls}-btn-color-primary)`]: {
|
||||
color: token.colorTextDescription,
|
||||
'&:not([disabled]):hover': {
|
||||
color: token.colorPrimaryHover
|
||||
},
|
||||
'&:active': {
|
||||
color: token.colorPrimaryActive
|
||||
},
|
||||
[`&${antCls}-btn-loading::before`]: {
|
||||
inset: 0
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
[`${searchPrefixCls}-button`]: {
|
||||
height: token.controlHeight,
|
||||
'&:hover, &:focus': {
|
||||
zIndex: 1
|
||||
}
|
||||
},
|
||||
'&-large': {
|
||||
[`${componentCls}-affix-wrapper, ${searchPrefixCls}-button`]: {
|
||||
height: token.controlHeightLG
|
||||
}
|
||||
},
|
||||
'&-small': {
|
||||
[`${componentCls}-affix-wrapper, ${searchPrefixCls}-button`]: {
|
||||
height: token.controlHeightSM
|
||||
}
|
||||
},
|
||||
'&-rtl': {
|
||||
direction: 'rtl'
|
||||
},
|
||||
// ===================== Compact Item Customized Styles =====================
|
||||
[`&${componentCls}-compact-item`]: {
|
||||
[`&:not(${componentCls}-compact-last-item)`]: {
|
||||
[`${componentCls}-group-addon`]: {
|
||||
[`${componentCls}-search-button`]: {
|
||||
marginInlineEnd: token.calc(token.lineWidth).mul(-1).equal(),
|
||||
borderRadius: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
[`&:not(${componentCls}-compact-first-item)`]: {
|
||||
[`${componentCls},${componentCls}-affix-wrapper`]: {
|
||||
borderRadius: 0
|
||||
}
|
||||
},
|
||||
[`> ${componentCls}-group-addon ${componentCls}-search-button,
|
||||
> ${componentCls},
|
||||
${componentCls}-affix-wrapper`]: {
|
||||
'&:hover, &:focus, &:active': {
|
||||
zIndex: 2
|
||||
}
|
||||
},
|
||||
[`> ${componentCls}-affix-wrapper-focused`]: {
|
||||
zIndex: 2
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
// ============================== Range ===============================
|
||||
const genRangeStyle = token => {
|
||||
const {
|
||||
componentCls
|
||||
} = token;
|
||||
return {
|
||||
[`${componentCls}-out-of-range`]: {
|
||||
[`&, & input, & textarea, ${componentCls}-show-count-suffix, ${componentCls}-data-count`]: {
|
||||
color: token.colorError
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
// ============================== Export ==============================
|
||||
export const useSharedStyle = genStyleHooks(['Input', 'Shared'], token => {
|
||||
const inputToken = mergeToken(token, initInputToken(token));
|
||||
return [genInputStyle(inputToken), genAffixStyle(inputToken)];
|
||||
}, initComponentToken, {
|
||||
resetFont: false
|
||||
});
|
||||
export default genStyleHooks(['Input', 'Component'], token => {
|
||||
const inputToken = mergeToken(token, initInputToken(token));
|
||||
return [genGroupStyle(inputToken), genSearchInputStyle(inputToken), genRangeStyle(inputToken),
|
||||
// =====================================================
|
||||
// == Space Compact ==
|
||||
// =====================================================
|
||||
genCompactItemStyle(inputToken)];
|
||||
}, initComponentToken, {
|
||||
resetFont: false
|
||||
});
|
||||
2
frontend/node_modules/antd/es/input/style/otp.d.ts
generated
vendored
Normal file
2
frontend/node_modules/antd/es/input/style/otp.d.ts
generated
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
declare const _default: (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
|
||||
export default _default;
|
||||
58
frontend/node_modules/antd/es/input/style/otp.js
generated
vendored
Normal file
58
frontend/node_modules/antd/es/input/style/otp.js
generated
vendored
Normal file
@@ -0,0 +1,58 @@
|
||||
import { genStyleHooks, mergeToken } from '../../theme/internal';
|
||||
import { initComponentToken, initInputToken } from './token';
|
||||
// =============================== OTP ================================
|
||||
const genOTPStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
paddingXS
|
||||
} = token;
|
||||
return {
|
||||
[componentCls]: {
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
flexWrap: 'nowrap',
|
||||
columnGap: paddingXS,
|
||||
[`${componentCls}-input-wrapper`]: {
|
||||
position: 'relative',
|
||||
[`${componentCls}-mask-icon`]: {
|
||||
position: 'absolute',
|
||||
zIndex: '1',
|
||||
top: '50%',
|
||||
right: '50%',
|
||||
transform: 'translate(50%, -50%)',
|
||||
pointerEvents: 'none'
|
||||
},
|
||||
[`${componentCls}-mask-input`]: {
|
||||
color: 'transparent',
|
||||
caretColor: token.colorText
|
||||
},
|
||||
[`${componentCls}-mask-input[type=number]::-webkit-inner-spin-button`]: {
|
||||
'-webkit-appearance': 'none',
|
||||
margin: 0
|
||||
},
|
||||
[`${componentCls}-mask-input[type=number]`]: {
|
||||
'-moz-appearance': 'textfield'
|
||||
}
|
||||
},
|
||||
'&-rtl': {
|
||||
direction: 'rtl'
|
||||
},
|
||||
[`${componentCls}-input`]: {
|
||||
textAlign: 'center',
|
||||
paddingInline: token.paddingXXS
|
||||
},
|
||||
// ================= Size =================
|
||||
[`&${componentCls}-sm ${componentCls}-input`]: {
|
||||
paddingInline: token.calc(token.paddingXXS).div(2).equal()
|
||||
},
|
||||
[`&${componentCls}-lg ${componentCls}-input`]: {
|
||||
paddingInline: token.paddingXS
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
// ============================== Export ==============================
|
||||
export default genStyleHooks(['Input', 'OTP'], token => {
|
||||
const inputToken = mergeToken(token, initInputToken(token));
|
||||
return genOTPStyle(inputToken);
|
||||
}, initComponentToken);
|
||||
6
frontend/node_modules/antd/es/input/style/textarea.d.ts
generated
vendored
Normal file
6
frontend/node_modules/antd/es/input/style/textarea.d.ts
generated
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
import type { ComponentToken } from './token';
|
||||
import { initComponentToken, initInputToken } from './token';
|
||||
export type { ComponentToken };
|
||||
export { initComponentToken, initInputToken };
|
||||
declare const _default: (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
|
||||
export default _default;
|
||||
108
frontend/node_modules/antd/es/input/style/textarea.js
generated
vendored
Normal file
108
frontend/node_modules/antd/es/input/style/textarea.js
generated
vendored
Normal file
@@ -0,0 +1,108 @@
|
||||
import { genStyleHooks, mergeToken } from '../../theme/internal';
|
||||
import { initComponentToken, initInputToken } from './token';
|
||||
export { initComponentToken, initInputToken };
|
||||
const genTextAreaStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
paddingLG
|
||||
} = token;
|
||||
const textareaPrefixCls = `${componentCls}-textarea`;
|
||||
return {
|
||||
// Raw Textarea
|
||||
[`textarea${componentCls}`]: {
|
||||
maxWidth: '100%',
|
||||
// prevent textarea resize from coming out of its container
|
||||
height: 'auto',
|
||||
minHeight: token.controlHeight,
|
||||
lineHeight: token.lineHeight,
|
||||
verticalAlign: 'bottom',
|
||||
transition: `all ${token.motionDurationSlow}`,
|
||||
resize: 'vertical',
|
||||
[`&${componentCls}-mouse-active`]: {
|
||||
transition: `all ${token.motionDurationSlow}, height 0s, width 0s`
|
||||
}
|
||||
},
|
||||
// Wrapper for resize
|
||||
[`${componentCls}-textarea-affix-wrapper-resize-dirty`]: {
|
||||
width: 'auto'
|
||||
},
|
||||
[textareaPrefixCls]: {
|
||||
position: 'relative',
|
||||
'&-show-count': {
|
||||
[`${componentCls}-data-count`]: {
|
||||
position: 'absolute',
|
||||
bottom: token.calc(token.fontSize).mul(token.lineHeight).mul(-1).equal(),
|
||||
insetInlineEnd: 0,
|
||||
color: token.colorTextDescription,
|
||||
whiteSpace: 'nowrap',
|
||||
pointerEvents: 'none'
|
||||
}
|
||||
},
|
||||
[`
|
||||
&-allow-clear > ${componentCls},
|
||||
&-affix-wrapper${textareaPrefixCls}-has-feedback ${componentCls}
|
||||
`]: {
|
||||
paddingInlineEnd: paddingLG
|
||||
},
|
||||
[`&-affix-wrapper${componentCls}-affix-wrapper`]: {
|
||||
padding: 0,
|
||||
[`> textarea${componentCls}`]: {
|
||||
fontSize: 'inherit',
|
||||
border: 'none',
|
||||
outline: 'none',
|
||||
background: 'transparent',
|
||||
minHeight: token.calc(token.controlHeight).sub(token.calc(token.lineWidth).mul(2)).equal(),
|
||||
'&:focus': {
|
||||
boxShadow: 'none !important'
|
||||
}
|
||||
},
|
||||
[`${componentCls}-suffix`]: {
|
||||
margin: 0,
|
||||
'> *:not(:last-child)': {
|
||||
marginInline: 0
|
||||
},
|
||||
// Clear Icon
|
||||
[`${componentCls}-clear-icon`]: {
|
||||
position: 'absolute',
|
||||
insetInlineEnd: token.paddingInline,
|
||||
insetBlockStart: token.paddingXS
|
||||
},
|
||||
// Feedback Icon
|
||||
[`${textareaPrefixCls}-suffix`]: {
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
insetInlineEnd: token.paddingInline,
|
||||
bottom: 0,
|
||||
zIndex: 1,
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
margin: 'auto',
|
||||
pointerEvents: 'none'
|
||||
}
|
||||
}
|
||||
},
|
||||
[`&-affix-wrapper${componentCls}-affix-wrapper-rtl`]: {
|
||||
[`${componentCls}-suffix`]: {
|
||||
[`${componentCls}-data-count`]: {
|
||||
direction: 'ltr',
|
||||
insetInlineStart: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
[`&-affix-wrapper${componentCls}-affix-wrapper-sm`]: {
|
||||
[`${componentCls}-suffix`]: {
|
||||
[`${componentCls}-clear-icon`]: {
|
||||
insetInlineEnd: token.paddingInlineSM
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
// ============================== Export ==============================
|
||||
export default genStyleHooks(['Input', 'TextArea'], token => {
|
||||
const inputToken = mergeToken(token, initInputToken(token));
|
||||
return genTextAreaStyle(inputToken);
|
||||
}, initComponentToken, {
|
||||
resetFont: false
|
||||
});
|
||||
97
frontend/node_modules/antd/es/input/style/token.d.ts
generated
vendored
Normal file
97
frontend/node_modules/antd/es/input/style/token.d.ts
generated
vendored
Normal file
@@ -0,0 +1,97 @@
|
||||
import type { AliasToken, FullToken } from '../../theme/internal';
|
||||
export interface SharedComponentToken {
|
||||
/**
|
||||
* @desc 输入框横向内边距
|
||||
* @descEN Horizontal padding of input
|
||||
*/
|
||||
paddingInline: number;
|
||||
/**
|
||||
* @desc 小号输入框横向内边距
|
||||
* @descEN Horizontal padding of small input
|
||||
*/
|
||||
paddingInlineSM: number;
|
||||
/**
|
||||
* @desc 大号输入框横向内边距
|
||||
* @descEN Horizontal padding of large input
|
||||
*/
|
||||
paddingInlineLG: number;
|
||||
/**
|
||||
* @desc 输入框纵向内边距
|
||||
* @descEN Vertical padding of input
|
||||
*/
|
||||
paddingBlock: number;
|
||||
/**
|
||||
* @desc 小号输入框纵向内边距
|
||||
* @descEN Vertical padding of small input
|
||||
*/
|
||||
paddingBlockSM: number;
|
||||
/**
|
||||
* @desc 大号输入框纵向内边距
|
||||
* @descEN Vertical padding of large input
|
||||
*/
|
||||
paddingBlockLG: number;
|
||||
/**
|
||||
* @desc 前/后置标签背景色
|
||||
* @descEN Background color of addon
|
||||
*/
|
||||
addonBg: string;
|
||||
/**
|
||||
* @desc 悬浮态边框色
|
||||
* @descEN Hover border color
|
||||
*/
|
||||
hoverBorderColor: string;
|
||||
/**
|
||||
* @desc 激活态边框色
|
||||
* @descEN Active border color
|
||||
*/
|
||||
activeBorderColor: string;
|
||||
/**
|
||||
* @desc 激活态阴影
|
||||
* @descEN Box-shadow when active
|
||||
*/
|
||||
activeShadow: string;
|
||||
/**
|
||||
* @desc 错误状态时激活态阴影
|
||||
* @descEN Box-shadow when active in error status
|
||||
*/
|
||||
errorActiveShadow: string;
|
||||
/**
|
||||
* @desc 警告状态时激活态阴影
|
||||
* @descEN Box-shadow when active in warning status
|
||||
*/
|
||||
warningActiveShadow: string;
|
||||
/**
|
||||
* @desc 输入框hover状态时背景颜色
|
||||
* @descEN Background color when the input box hovers
|
||||
*/
|
||||
hoverBg: string;
|
||||
/**
|
||||
* @desc 输入框激活状态时背景颜色
|
||||
* @descEN Background color when the input box is activated
|
||||
*/
|
||||
activeBg: string;
|
||||
/**
|
||||
* @desc 字体大小
|
||||
* @descEN Font size
|
||||
*/
|
||||
inputFontSize: number;
|
||||
/**
|
||||
* @desc 大号字体大小
|
||||
* @descEN Font size of large
|
||||
*/
|
||||
inputFontSizeLG: number;
|
||||
/**
|
||||
* @desc 小号字体大小
|
||||
* @descEN Font size of small
|
||||
*/
|
||||
inputFontSizeSM: number;
|
||||
}
|
||||
export interface ComponentToken extends SharedComponentToken {
|
||||
}
|
||||
export interface SharedInputToken {
|
||||
inputAffixPadding: number;
|
||||
}
|
||||
export interface InputToken extends FullToken<'Input'>, SharedInputToken {
|
||||
}
|
||||
export declare function initInputToken(token: AliasToken): SharedInputToken;
|
||||
export declare const initComponentToken: (token: AliasToken & Partial<SharedComponentToken>) => SharedComponentToken;
|
||||
57
frontend/node_modules/antd/es/input/style/token.js
generated
vendored
Normal file
57
frontend/node_modules/antd/es/input/style/token.js
generated
vendored
Normal file
@@ -0,0 +1,57 @@
|
||||
import { mergeToken } from '../../theme/internal';
|
||||
export function initInputToken(token) {
|
||||
return mergeToken(token, {
|
||||
inputAffixPadding: token.paddingXXS
|
||||
});
|
||||
}
|
||||
export const initComponentToken = token => {
|
||||
const {
|
||||
controlHeight,
|
||||
fontSize,
|
||||
lineHeight,
|
||||
lineWidth,
|
||||
controlHeightSM,
|
||||
controlHeightLG,
|
||||
fontSizeLG,
|
||||
lineHeightLG,
|
||||
paddingSM,
|
||||
controlPaddingHorizontalSM,
|
||||
controlPaddingHorizontal,
|
||||
colorFillAlter,
|
||||
colorPrimaryHover,
|
||||
colorPrimary,
|
||||
controlOutlineWidth,
|
||||
controlOutline,
|
||||
colorErrorOutline,
|
||||
colorWarningOutline,
|
||||
colorBgContainer,
|
||||
inputFontSize,
|
||||
inputFontSizeLG,
|
||||
inputFontSizeSM
|
||||
} = token;
|
||||
const mergedFontSize = inputFontSize || fontSize;
|
||||
const mergedFontSizeSM = inputFontSizeSM || mergedFontSize;
|
||||
const mergedFontSizeLG = inputFontSizeLG || fontSizeLG;
|
||||
const paddingBlock = Math.round((controlHeight - mergedFontSize * lineHeight) / 2 * 10) / 10 - lineWidth;
|
||||
const paddingBlockSM = Math.round((controlHeightSM - mergedFontSizeSM * lineHeight) / 2 * 10) / 10 - lineWidth;
|
||||
const paddingBlockLG = Math.ceil((controlHeightLG - mergedFontSizeLG * lineHeightLG) / 2 * 10) / 10 - lineWidth;
|
||||
return {
|
||||
paddingBlock: Math.max(paddingBlock, 0),
|
||||
paddingBlockSM: Math.max(paddingBlockSM, 0),
|
||||
paddingBlockLG: Math.max(paddingBlockLG, 0),
|
||||
paddingInline: paddingSM - lineWidth,
|
||||
paddingInlineSM: controlPaddingHorizontalSM - lineWidth,
|
||||
paddingInlineLG: controlPaddingHorizontal - lineWidth,
|
||||
addonBg: colorFillAlter,
|
||||
activeBorderColor: colorPrimary,
|
||||
hoverBorderColor: colorPrimaryHover,
|
||||
activeShadow: `0 0 0 ${controlOutlineWidth}px ${controlOutline}`,
|
||||
errorActiveShadow: `0 0 0 ${controlOutlineWidth}px ${colorErrorOutline}`,
|
||||
warningActiveShadow: `0 0 0 ${controlOutlineWidth}px ${colorWarningOutline}`,
|
||||
hoverBg: colorBgContainer,
|
||||
activeBg: colorBgContainer,
|
||||
inputFontSize: mergedFontSize,
|
||||
inputFontSizeLG: mergedFontSizeLG,
|
||||
inputFontSizeSM: mergedFontSizeSM
|
||||
};
|
||||
};
|
||||
22
frontend/node_modules/antd/es/input/style/variants.d.ts
generated
vendored
Normal file
22
frontend/node_modules/antd/es/input/style/variants.d.ts
generated
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
import type { CSSObject } from '@ant-design/cssinjs';
|
||||
import type { InputToken } from './token';
|
||||
export declare const genHoverStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genDisabledStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genBaseOutlinedStyle: (token: InputToken, options: {
|
||||
borderColor: string;
|
||||
hoverBorderColor: string;
|
||||
activeBorderColor: string;
|
||||
activeShadow: string;
|
||||
}) => CSSObject;
|
||||
export declare const genOutlinedStyle: (token: InputToken, extraStyles?: CSSObject) => CSSObject;
|
||||
export declare const genOutlinedGroupStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genBorderlessStyle: (token: InputToken, extraStyles?: CSSObject) => CSSObject;
|
||||
export declare const genFilledStyle: (token: InputToken, extraStyles?: CSSObject) => CSSObject;
|
||||
export declare const genFilledGroupStyle: (token: InputToken) => CSSObject;
|
||||
export declare const genBaseUnderlinedStyle: (token: InputToken, options: {
|
||||
borderColor: string;
|
||||
hoverBorderColor: string;
|
||||
activeBorderColor: string;
|
||||
activeShadow: string;
|
||||
}) => CSSObject;
|
||||
export declare const genUnderlinedStyle: (token: InputToken, extraStyles?: CSSObject) => CSSObject;
|
||||
298
frontend/node_modules/antd/es/input/style/variants.js
generated
vendored
Normal file
298
frontend/node_modules/antd/es/input/style/variants.js
generated
vendored
Normal file
@@ -0,0 +1,298 @@
|
||||
import { unit } from '@ant-design/cssinjs';
|
||||
import { mergeToken } from '../../theme/internal';
|
||||
export const genHoverStyle = token => ({
|
||||
borderColor: token.hoverBorderColor,
|
||||
backgroundColor: token.hoverBg
|
||||
});
|
||||
export const genDisabledStyle = token => ({
|
||||
color: token.colorTextDisabled,
|
||||
backgroundColor: token.colorBgContainerDisabled,
|
||||
borderColor: token.colorBorder,
|
||||
boxShadow: 'none',
|
||||
cursor: 'not-allowed',
|
||||
opacity: 1,
|
||||
'input[disabled], textarea[disabled]': {
|
||||
cursor: 'not-allowed'
|
||||
},
|
||||
'&:hover:not([disabled])': Object.assign({}, genHoverStyle(mergeToken(token, {
|
||||
hoverBorderColor: token.colorBorder,
|
||||
hoverBg: token.colorBgContainerDisabled
|
||||
})))
|
||||
});
|
||||
/* ============== Outlined ============== */
|
||||
export const genBaseOutlinedStyle = (token, options) => ({
|
||||
background: token.colorBgContainer,
|
||||
borderWidth: token.lineWidth,
|
||||
borderStyle: token.lineType,
|
||||
borderColor: options.borderColor,
|
||||
'&:hover': {
|
||||
borderColor: options.hoverBorderColor,
|
||||
backgroundColor: token.hoverBg
|
||||
},
|
||||
'&:focus, &:focus-within': {
|
||||
borderColor: options.activeBorderColor,
|
||||
boxShadow: options.activeShadow,
|
||||
outline: 0,
|
||||
backgroundColor: token.activeBg
|
||||
}
|
||||
});
|
||||
const genOutlinedStatusStyle = (token, options) => ({
|
||||
[`&${token.componentCls}-status-${options.status}:not(${token.componentCls}-disabled)`]: Object.assign(Object.assign({}, genBaseOutlinedStyle(token, options)), {
|
||||
[`${token.componentCls}-prefix, ${token.componentCls}-suffix`]: {
|
||||
color: options.affixColor
|
||||
}
|
||||
}),
|
||||
[`&${token.componentCls}-status-${options.status}${token.componentCls}-disabled`]: {
|
||||
borderColor: options.borderColor
|
||||
}
|
||||
});
|
||||
export const genOutlinedStyle = (token, extraStyles) => ({
|
||||
'&-outlined': Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, genBaseOutlinedStyle(token, {
|
||||
borderColor: token.colorBorder,
|
||||
hoverBorderColor: token.hoverBorderColor,
|
||||
activeBorderColor: token.activeBorderColor,
|
||||
activeShadow: token.activeShadow
|
||||
})), {
|
||||
[`&${token.componentCls}-disabled, &[disabled]`]: Object.assign({}, genDisabledStyle(token))
|
||||
}), genOutlinedStatusStyle(token, {
|
||||
status: 'error',
|
||||
borderColor: token.colorError,
|
||||
hoverBorderColor: token.colorErrorBorderHover,
|
||||
activeBorderColor: token.colorError,
|
||||
activeShadow: token.errorActiveShadow,
|
||||
affixColor: token.colorError
|
||||
})), genOutlinedStatusStyle(token, {
|
||||
status: 'warning',
|
||||
borderColor: token.colorWarning,
|
||||
hoverBorderColor: token.colorWarningBorderHover,
|
||||
activeBorderColor: token.colorWarning,
|
||||
activeShadow: token.warningActiveShadow,
|
||||
affixColor: token.colorWarning
|
||||
})), extraStyles)
|
||||
});
|
||||
const genOutlinedGroupStatusStyle = (token, options) => ({
|
||||
[`&${token.componentCls}-group-wrapper-status-${options.status}`]: {
|
||||
[`${token.componentCls}-group-addon`]: {
|
||||
borderColor: options.addonBorderColor,
|
||||
color: options.addonColor
|
||||
}
|
||||
}
|
||||
});
|
||||
export const genOutlinedGroupStyle = token => ({
|
||||
'&-outlined': Object.assign(Object.assign(Object.assign({
|
||||
[`${token.componentCls}-group`]: {
|
||||
'&-addon': {
|
||||
background: token.addonBg,
|
||||
border: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`
|
||||
},
|
||||
'&-addon:first-child': {
|
||||
borderInlineEnd: 0
|
||||
},
|
||||
'&-addon:last-child': {
|
||||
borderInlineStart: 0
|
||||
}
|
||||
}
|
||||
}, genOutlinedGroupStatusStyle(token, {
|
||||
status: 'error',
|
||||
addonBorderColor: token.colorError,
|
||||
addonColor: token.colorErrorText
|
||||
})), genOutlinedGroupStatusStyle(token, {
|
||||
status: 'warning',
|
||||
addonBorderColor: token.colorWarning,
|
||||
addonColor: token.colorWarningText
|
||||
})), {
|
||||
[`&${token.componentCls}-group-wrapper-disabled`]: {
|
||||
[`${token.componentCls}-group-addon`]: Object.assign({}, genDisabledStyle(token))
|
||||
}
|
||||
})
|
||||
});
|
||||
/* ============ Borderless ============ */
|
||||
export const genBorderlessStyle = (token, extraStyles) => {
|
||||
const {
|
||||
componentCls
|
||||
} = token;
|
||||
return {
|
||||
'&-borderless': Object.assign({
|
||||
background: 'transparent',
|
||||
border: 'none',
|
||||
'&:focus, &:focus-within': {
|
||||
outline: 'none'
|
||||
},
|
||||
// >>>>> Disabled
|
||||
[`&${componentCls}-disabled, &[disabled]`]: {
|
||||
color: token.colorTextDisabled,
|
||||
cursor: 'not-allowed'
|
||||
},
|
||||
// >>>>> Status
|
||||
[`&${componentCls}-status-error`]: {
|
||||
'&, & input, & textarea': {
|
||||
color: token.colorError
|
||||
}
|
||||
},
|
||||
[`&${componentCls}-status-warning`]: {
|
||||
'&, & input, & textarea': {
|
||||
color: token.colorWarning
|
||||
}
|
||||
}
|
||||
}, extraStyles)
|
||||
};
|
||||
};
|
||||
/* ============== Filled ============== */
|
||||
const genBaseFilledStyle = (token, options) => {
|
||||
var _a;
|
||||
return {
|
||||
background: options.bg,
|
||||
borderWidth: token.lineWidth,
|
||||
borderStyle: token.lineType,
|
||||
borderColor: 'transparent',
|
||||
'input&, & input, textarea&, & textarea': {
|
||||
color: (_a = options === null || options === void 0 ? void 0 : options.inputColor) !== null && _a !== void 0 ? _a : 'unset'
|
||||
},
|
||||
'&:hover': {
|
||||
background: options.hoverBg
|
||||
},
|
||||
'&:focus, &:focus-within': {
|
||||
outline: 0,
|
||||
borderColor: options.activeBorderColor,
|
||||
backgroundColor: token.activeBg
|
||||
}
|
||||
};
|
||||
};
|
||||
const genFilledStatusStyle = (token, options) => ({
|
||||
[`&${token.componentCls}-status-${options.status}:not(${token.componentCls}-disabled)`]: Object.assign(Object.assign({}, genBaseFilledStyle(token, options)), {
|
||||
[`${token.componentCls}-prefix, ${token.componentCls}-suffix`]: {
|
||||
color: options.affixColor
|
||||
}
|
||||
})
|
||||
});
|
||||
export const genFilledStyle = (token, extraStyles) => ({
|
||||
'&-filled': Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, genBaseFilledStyle(token, {
|
||||
bg: token.colorFillTertiary,
|
||||
hoverBg: token.colorFillSecondary,
|
||||
activeBorderColor: token.activeBorderColor
|
||||
})), {
|
||||
[`&${token.componentCls}-disabled, &[disabled]`]: Object.assign({}, genDisabledStyle(token))
|
||||
}), genFilledStatusStyle(token, {
|
||||
status: 'error',
|
||||
bg: token.colorErrorBg,
|
||||
hoverBg: token.colorErrorBgHover,
|
||||
activeBorderColor: token.colorError,
|
||||
inputColor: token.colorErrorText,
|
||||
affixColor: token.colorError
|
||||
})), genFilledStatusStyle(token, {
|
||||
status: 'warning',
|
||||
bg: token.colorWarningBg,
|
||||
hoverBg: token.colorWarningBgHover,
|
||||
activeBorderColor: token.colorWarning,
|
||||
inputColor: token.colorWarningText,
|
||||
affixColor: token.colorWarning
|
||||
})), extraStyles)
|
||||
});
|
||||
const genFilledGroupStatusStyle = (token, options) => ({
|
||||
[`&${token.componentCls}-group-wrapper-status-${options.status}`]: {
|
||||
[`${token.componentCls}-group-addon`]: {
|
||||
background: options.addonBg,
|
||||
color: options.addonColor
|
||||
}
|
||||
}
|
||||
});
|
||||
export const genFilledGroupStyle = token => ({
|
||||
'&-filled': Object.assign(Object.assign(Object.assign({
|
||||
[`${token.componentCls}-group-addon`]: {
|
||||
background: token.colorFillTertiary,
|
||||
'&:last-child': {
|
||||
position: 'static'
|
||||
}
|
||||
}
|
||||
}, genFilledGroupStatusStyle(token, {
|
||||
status: 'error',
|
||||
addonBg: token.colorErrorBg,
|
||||
addonColor: token.colorErrorText
|
||||
})), genFilledGroupStatusStyle(token, {
|
||||
status: 'warning',
|
||||
addonBg: token.colorWarningBg,
|
||||
addonColor: token.colorWarningText
|
||||
})), {
|
||||
[`&${token.componentCls}-group-wrapper-disabled`]: {
|
||||
[`${token.componentCls}-group`]: {
|
||||
'&-addon': {
|
||||
background: token.colorFillTertiary,
|
||||
color: token.colorTextDisabled
|
||||
},
|
||||
'&-addon:first-child': {
|
||||
borderInlineStart: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
|
||||
borderTop: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
|
||||
borderBottom: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`
|
||||
},
|
||||
'&-addon:last-child': {
|
||||
borderInlineEnd: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
|
||||
borderTop: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
|
||||
borderBottom: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
/* ============== Underlined ============== */
|
||||
// https://github.com/ant-design/ant-design/issues/51379
|
||||
export const genBaseUnderlinedStyle = (token, options) => ({
|
||||
background: token.colorBgContainer,
|
||||
borderWidth: `${unit(token.lineWidth)} 0`,
|
||||
borderStyle: `${token.lineType} none`,
|
||||
borderColor: `transparent transparent ${options.borderColor} transparent`,
|
||||
borderRadius: 0,
|
||||
'&:hover': {
|
||||
borderColor: `transparent transparent ${options.hoverBorderColor} transparent`,
|
||||
backgroundColor: token.hoverBg
|
||||
},
|
||||
'&:focus, &:focus-within': {
|
||||
borderColor: `transparent transparent ${options.activeBorderColor} transparent`,
|
||||
outline: 0,
|
||||
backgroundColor: token.activeBg
|
||||
}
|
||||
});
|
||||
const genUnderlinedStatusStyle = (token, options) => ({
|
||||
[`&${token.componentCls}-status-${options.status}:not(${token.componentCls}-disabled)`]: Object.assign(Object.assign({}, genBaseUnderlinedStyle(token, options)), {
|
||||
[`${token.componentCls}-prefix, ${token.componentCls}-suffix`]: {
|
||||
color: options.affixColor
|
||||
}
|
||||
}),
|
||||
[`&${token.componentCls}-status-${options.status}${token.componentCls}-disabled`]: {
|
||||
borderColor: `transparent transparent ${options.borderColor} transparent`
|
||||
}
|
||||
});
|
||||
export const genUnderlinedStyle = (token, extraStyles) => ({
|
||||
'&-underlined': Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, genBaseUnderlinedStyle(token, {
|
||||
borderColor: token.colorBorder,
|
||||
hoverBorderColor: token.hoverBorderColor,
|
||||
activeBorderColor: token.activeBorderColor,
|
||||
activeShadow: token.activeShadow
|
||||
})), {
|
||||
// >>>>> Disabled
|
||||
[`&${token.componentCls}-disabled, &[disabled]`]: {
|
||||
color: token.colorTextDisabled,
|
||||
boxShadow: 'none',
|
||||
cursor: 'not-allowed',
|
||||
'&:hover': {
|
||||
borderColor: `transparent transparent ${token.colorBorder} transparent`
|
||||
}
|
||||
},
|
||||
'input[disabled], textarea[disabled]': {
|
||||
cursor: 'not-allowed'
|
||||
}
|
||||
}), genUnderlinedStatusStyle(token, {
|
||||
status: 'error',
|
||||
borderColor: token.colorError,
|
||||
hoverBorderColor: token.colorErrorBorderHover,
|
||||
activeBorderColor: token.colorError,
|
||||
activeShadow: token.errorActiveShadow,
|
||||
affixColor: token.colorError
|
||||
})), genUnderlinedStatusStyle(token, {
|
||||
status: 'warning',
|
||||
borderColor: token.colorWarning,
|
||||
hoverBorderColor: token.colorWarningBorderHover,
|
||||
activeBorderColor: token.colorWarning,
|
||||
activeShadow: token.warningActiveShadow,
|
||||
affixColor: token.colorWarning
|
||||
})), extraStyles)
|
||||
});
|
||||
Reference in New Issue
Block a user