"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ProgressCircle = void 0;
const react_1 = __importDefault(require("react"));
const react_circular_progressbar_1 = require("react-circular-progressbar");
const styled_components_1 = require("styled-components");
const GlobalStyle = styled_components_1.createGlobalStyle `
.circlePath{
  stroke: var(--primary-color);
  stroke-linecap: round;
  transition: stroke-dashoffset 0.5s ease 0s;
}
.circleTrail{
  stroke: #ddd;
}
.circleText{
  fill: var(--primary-color);
  font-size: 20px;
  dominant-baseline: middle;
  text-anchor: middle;
}
.circleBackground{
  fill: #ddd;
}
`;
const classes = {
    path: 'circlePath',
    trail: 'circleTrail',
    text: 'circleText',
    background: 'circleBackground',
    root: '',
};
const ProgressCircle = ({ percentage, size = '100%' }) => {
    return (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(GlobalStyle, null),
        react_1.default.createElement(react_circular_progressbar_1.CircularProgressbar, { value: percentage, text: `${percentage}%`, classes: classes, styles: { root: { width: size } } })));
};
exports.ProgressCircle = ProgressCircle;
//# sourceMappingURL=index.js.map