Skip to content

Commit

Permalink
Merge pull request #28 from iman-fs/shayan/74993/circular-progress-co…
Browse files Browse the repository at this point in the history
…mponent-ts-migration

Shayan/74993/circular progress component ts migration
  • Loading branch information
jim-deriv committed Sep 28, 2022
2 parents 9229f7b + 2ab830d commit df64b7b
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 24 deletions.
Original file line number Diff line number Diff line change
@@ -1,9 +1,28 @@
import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import Icon from '../icon/icon';

const CircularProgress = ({ className, danger_limit, icon, is_clockwise, progress, radius, stroke, warning_limit }) => {
type TCircularProgressProps = {
className?: string;
danger_limit?: number;
is_clockwise?: boolean;
progress?: number;
radius?: number;
stroke?: number;
warning_limit?: number;
icon?: string;
};

const CircularProgress = ({
className,
danger_limit = 20,
icon = '',
is_clockwise = false,
progress = 0,
radius = 22,
stroke = 3,
warning_limit = 50,
}: TCircularProgressProps) => {
const normalizedRadius = radius - stroke / 2;
const circumference = normalizedRadius * 2 * Math.PI;
const strokeDashoffset = circumference - (progress / 100) * circumference;
Expand All @@ -30,25 +49,4 @@ const CircularProgress = ({ className, danger_limit, icon, is_clockwise, progres
);
};

CircularProgress.defaultProps = {
icon: 'IcClockOutline',
danger_limit: 20,
is_clockwise: false,
progress: 0,
radius: 22,
stroke: 3,
warning_limit: 50,
};

export default CircularProgress;

CircularProgress.propTypes = {
className: PropTypes.string,
danger_limit: PropTypes.number,
is_clockwise: PropTypes.bool,
progress: PropTypes.number,
radius: PropTypes.number,
stroke: PropTypes.number,
warning_limit: PropTypes.number,
icon: PropTypes.string,
};
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import CircularProgress from './circular-progress.jsx';
import CircularProgress from './circular-progress';
import './circular-progress.scss';

export default CircularProgress;

0 comments on commit df64b7b

Please sign in to comment.