ant-design/components/progress/utils.ts
kiner-tang(文辉) da3babbe39
refactor(progress): progress size (#40903)
* feat: progress size

* feat: update snapshots

* feat: update demo

* feat: update demo

* docs: fix lint

* feat: update demo

* feat: update demo

* docs: update doc

* feat: update snapshots

* docs: update doc

* docs: update doc

* docs: update doc

* Update components/progress/index.en-US.md

Co-authored-by: lijianan <574980606@qq.com>

* Update components/progress/index.zh-CN.md

Co-authored-by: lijianan <574980606@qq.com>

* feat: optimize code

* feat: optimize code

* feat: optimize code

* feat: optimize code

* feat: optimize code

* Update components/progress/utils.ts

Co-authored-by: MadCcc <1075746765@qq.com>

* feat: optimize code

* feat: optimize code

* feat: optimize code

* Update components/progress/Circle.tsx

Co-authored-by: MadCcc <1075746765@qq.com>

* feat: optimize code

* feat: optimize code

* docs: update doc

---------

Co-authored-by: 二货机器人 <smith3816@gmail.com>
Co-authored-by: lijianan <574980606@qq.com>
Co-authored-by: MadCcc <1075746765@qq.com>
2023-03-01 11:49:42 +08:00

97 lines
2.9 KiB
TypeScript

import { presetPrimaryColors } from '@ant-design/colors';
import type { CircleProps } from './Circle';
import type { ProgressProps } from './progress';
import warning from '../_util/warning';
export function validProgress(progress?: number) {
if (!progress || progress < 0) {
return 0;
}
if (progress > 100) {
return 100;
}
return progress;
}
export function getSuccessPercent({ success, successPercent }: ProgressProps) {
let percent = successPercent;
/** @deprecated Use `percent` instead */
if (success && 'progress' in success) {
warning(
false,
'Progress',
'`success.progress` is deprecated. Please use `success.percent` instead.',
);
percent = success.progress;
}
if (success && 'percent' in success) {
percent = success.percent;
}
return percent;
}
export const getPercentage = ({ percent, success, successPercent }: ProgressProps) => {
const realSuccessPercent = validProgress(getSuccessPercent({ success, successPercent }));
return [realSuccessPercent, validProgress(validProgress(percent) - realSuccessPercent)];
};
export const getStrokeColor = ({ success = {}, strokeColor }: Partial<CircleProps>): (
| string
| Record<PropertyKey, string>
)[] => {
const { strokeColor: successColor } = success;
return [successColor || presetPrimaryColors.green, strokeColor || null!];
};
export const getSize = (
size: ProgressProps['size'],
type: ProgressProps['type'] | 'step',
extra?: {
steps?: number;
strokeWidth?: number;
},
): [number, number] => {
let width: number = -1;
let height: number = -1;
if (type === 'step') {
const steps = extra!.steps!;
const strokeWidth = extra!.strokeWidth!;
if (typeof size === 'string' || typeof size === 'undefined') {
width = size === 'small' ? 2 : 14;
height = strokeWidth ?? 8;
} else if (typeof size === 'number') {
[width, height] = [size, size];
} else {
[width = 14, height = 8] = size;
}
width *= steps;
} else if (type === 'line') {
const strokeWidth = extra?.strokeWidth;
if (typeof size === 'string' || typeof size === 'undefined') {
height = strokeWidth || (size === 'small' ? 6 : 8);
} else if (typeof size === 'number') {
[width, height] = [size, size];
} else {
[width = -1, height = 8] = size;
}
} else if (type === 'circle' || type === 'dashboard') {
if (typeof size === 'string' || typeof size === 'undefined') {
[width, height] = size === 'small' ? [60, 60] : [120, 120];
} else if (typeof size === 'number') {
[width, height] = [size, size];
} else {
if (process.env.NODE_ENV !== 'production') {
warning(
false,
'Progress',
'Type "circle" and "dashbord" do not accept array as `size`, please use number or preset size instead.',
);
}
width = size[0] ?? size[1] ?? 120;
height = size[0] ?? size[1] ?? 120;
}
}
return [width, height];
};