mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-30 12:28:33 +08:00
0352b2fd2e
* feat: spin support ptg * chore: ptg * chore: update demo * chore: popout component * chore: adjust logic * test: update snapshot * test: update snapshot * docs: update docs * test: update snapshot * test: update snapshot * test: update snapshot * chore: back of snapshot * chore: clean up * test: fix test case * chore: fix types * test: update snapshot * chore: opt * test: update testcase * test: coverage * test: update snapshot
47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
import * as React from 'react';
|
|
|
|
const AUTO_INTERVAL = 200;
|
|
const STEP_BUCKETS: [limit: number, stepPtg: number][] = [
|
|
[30, 0.05],
|
|
[70, 0.03],
|
|
[96, 0.01],
|
|
];
|
|
|
|
export default function usePercent(
|
|
spinning: boolean,
|
|
percent?: number | 'auto',
|
|
): number | undefined {
|
|
const [mockPercent, setMockPercent] = React.useState(0);
|
|
const mockIntervalRef = React.useRef<ReturnType<typeof setInterval>>();
|
|
|
|
const isAuto = percent === 'auto';
|
|
|
|
React.useEffect(() => {
|
|
if (isAuto && spinning) {
|
|
setMockPercent(0);
|
|
|
|
mockIntervalRef.current = setInterval(() => {
|
|
setMockPercent((prev) => {
|
|
const restPTG = 100 - prev;
|
|
|
|
for (let i = 0; i < STEP_BUCKETS.length; i += 1) {
|
|
const [limit, stepPtg] = STEP_BUCKETS[i];
|
|
|
|
if (prev <= limit) {
|
|
return prev + restPTG * stepPtg;
|
|
}
|
|
}
|
|
|
|
return prev;
|
|
});
|
|
}, AUTO_INTERVAL);
|
|
}
|
|
|
|
return () => {
|
|
clearInterval(mockIntervalRef.current);
|
|
};
|
|
}, [isAuto, spinning]);
|
|
|
|
return isAuto ? mockPercent : percent;
|
|
}
|