import * as tslib_1 from "tslib";
import React from 'react';
import classnames from 'classnames';
import { strokePresetColors } from '.';
var defaultProps = {
    prefixCls: 'ty-progress-circle',
    percent: 0,
    strokeWidth: 8,
    width: 120,
    strokeLinecap: 'round',
    strokeColor: 'primary',
};
var Circle = function (props) {
    var _a;
    var percent = props.percent, format = props.format, width = props.width, strokeColor = props.strokeColor, strokeWidth = props.strokeWidth, strokeLinecap = props.strokeLinecap, prefixCls = props.prefixCls, className = props.className, style = props.style, textStyle = props.textStyle;
    var cls = classnames(prefixCls, className);
    var percentage = percent > 100 ? 100 : percent;
    percentage = percentage < 0 ? 0 : percentage;
    var strokeBgCls = classnames(prefixCls + "__path", (_a = {},
        _a[prefixCls + "__path_" + strokeColor] = strokePresetColors.includes(strokeColor),
        _a));
    var _relativeStrokeWidth = function () {
        return (strokeWidth / width * 100).toFixed(1);
    };
    var _trackPath = function () {
        var radius = 50 - parseFloat(_relativeStrokeWidth()) / 2;
        return "M 50 50 m 0 -" + radius + " a " + radius + " " + radius + "\n         0 1 1 0 " + radius * 2 + " a " + radius + " " + radius + " 0 1 1 0 -" + radius * 2;
    };
    var _perimeter = function () {
        var radius = 50 - parseFloat(_relativeStrokeWidth()) / 2;
        return 2 * Math.PI * radius;
    };
    var _circlePathStyle = function () {
        var perimeter = _perimeter();
        return {
            strokeDasharray: perimeter + "px," + perimeter + "px",
            strokeDashoffset: (1 - percentage / 100) * perimeter + 'px',
        };
    };
    var _renderLabel = function () {
        return (React.createElement("div", { className: prefixCls + "__text", style: textStyle }, format ? format(percent) : percentage + "%"));
    };
    return (React.createElement("div", { className: cls, style: tslib_1.__assign({ width: width, height: width }, style) },
        React.createElement("svg", { viewBox: "0 0 100 100", width: width, height: width },
            React.createElement("path", { className: prefixCls + "__bg", d: _trackPath(), strokeWidth: _relativeStrokeWidth() }),
            React.createElement("path", { className: strokeBgCls, d: _trackPath(), strokeLinecap: strokeLinecap, strokeWidth: _relativeStrokeWidth(), style: _circlePathStyle() })),
        _renderLabel()));
};
Circle.defaultProps = defaultProps;
export default Circle;
//# sourceMappingURL=circle.js.map