@tarojsx/ui/dist/Progress.js

We reinvents the UI for Taro3+

import React from 'react';
import classNames from 'classnames';
import { View, Text } from '@tarojs/components';
import '../style/Progress.scss';
export const Progress = props => {
    const { className, style = {}, percent: initialPercent = 0, status, color, strokeWidth, isHidePercent, transitionDuration = 0.3, } = props;
    const percent = Math.min(100, Math.max(0, initialPercent));
    const rootClass = classNames('at-progress', { [`at-progress--${status}`]: status }, className);
    const iconClass = classNames('at-icon', {
        'at-icon-close-circle': status === 'error',
        'at-icon-check-circle': status === 'success',
    });
    const progressStyle = {
        width: percent && `${+percent}%`,
        height: strokeWidth && `${+strokeWidth}px`,
        backgroundColor: color,
    };
    progressStyle.transitionDuration = `${transitionDuration !== null && transitionDuration !== void 0 ? transitionDuration : 0}s`;
    return (React.createElement(View, { className: rootClass, style: style },
        React.createElement(View, { className: "at-progress__outer" },
            React.createElement(View, { className: "at-progress__outer-inner" },
                React.createElement(View, { className: "at-progress__outer-inner-background", style: progressStyle }))),
        !isHidePercent && (React.createElement(View, { className: "at-progress__content" }, !status || status === 'progress' ? `${percent}%` : React.createElement(Text, { className: iconClass })))));
};
//# sourceMappingURL=Progress.js.map