Files
slider/src/Steps.jsx
T

25 lines
905 B
React

import React from 'react';
import { classSet } from 'rc-util';
const Steps = ({prefixCls, points, dots, included, lowerBound, upperBound, max, min}) => {
const range = max - min;
const elements = points.filter((point) => typeof point === 'string' || dots).map(parseFloat)
.map((point) => {
const offset = (point - min) / range * 100 + '%';
const style = { left: offset };
const isActived = (!included && point === upperBound) ||
(included && point <= upperBound && point >= lowerBound);
const pointClassName = classSet({
[prefixCls + '-dot']: true,
[prefixCls + '-dot-active']: isActived,
});
return <span className={pointClassName} style={style} key={point} />;
});
return <div className={prefixCls + '-step'}>{elements}</div>;
};
export default Steps;