@platformatic/ui-components 0.3.6 → 0.5.0

package/src/components/icons/ArrowDownFullIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowDownFullIcon = ({ color, size, disabled, inactive }) => {
+const ArrowDownFullIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -82,11 +87,5 @@ ArrowDownFullIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowDownFullIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowDownFullIcon

package/src/components/icons/ArrowDownIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowDownIcon = ({ color, size, disabled, inactive }) => {
+const ArrowDownIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -81,11 +86,5 @@ ArrowDownIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowDownIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowDownIcon

package/src/components/icons/ArrowLeftIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowLeftIcon = ({ color, size, disabled, inactive }) => {
+const ArrowLeftIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -81,11 +86,5 @@ ArrowLeftIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowLeftIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowLeftIcon

package/src/components/icons/ArrowLongLeftIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowLongLeftIcon = ({ color, size, disabled, inactive }) => {
+const ArrowLongLeftIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -82,11 +87,5 @@ ArrowLongLeftIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowLongLeftIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowLongLeftIcon

package/src/components/icons/ArrowLongRightIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowLongRightIcon = ({ color, size, disabled, inactive }) => {
+const ArrowLongRightIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -82,11 +87,5 @@ ArrowLongRightIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowLongRightIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowLongRightIcon

package/src/components/icons/ArrowRightIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowRightIcon = ({ color, size, disabled, inactive }) => {
+const ArrowRightIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -81,11 +86,5 @@ ArrowRightIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowRightIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowRightIcon

package/src/components/icons/ArrowUpIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const ArrowUpIcon = ({ color, size, disabled, inactive }) => {
+const ArrowUpIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -81,11 +86,5 @@ ArrowUpIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ArrowUpIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ArrowUpIcon

package/src/components/icons/BellIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const BellIcon = ({ color, size, disabled, inactive }) => {
+const BellIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -84,11 +89,5 @@ BellIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-BellIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default BellIcon

package/src/components/icons/BillingIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const BillingIcon = ({ color, size, disabled, inactive }) => {
+const BillingIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -104,11 +109,5 @@ BillingIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-BillingIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default BillingIcon

package/src/components/icons/BuiltInLoggingIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const BuiltInLoggingIcon = ({ color, size, disabled, inactive }) => {
+const BuiltInLoggingIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -112,11 +117,5 @@ BuiltInLoggingIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-BuiltInLoggingIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default BuiltInLoggingIcon

package/src/components/icons/CLIIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CLIIcon = ({ color, size, disabled, inactive }) => {
+const CLIIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -105,11 +110,5 @@ CLIIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CLIIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CLIIcon

package/src/components/icons/Calendar1DayIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const Calendar1DayIcon = ({ color, size, disabled, inactive }) => {
+const Calendar1DayIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -96,11 +101,5 @@ Calendar1DayIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-Calendar1DayIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default Calendar1DayIcon

package/src/components/icons/Calendar7DaysIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const Calendar7DaysIcon = ({ color, size, disabled, inactive }) => {
+const Calendar7DaysIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -94,11 +99,5 @@ Calendar7DaysIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-Calendar7DaysIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default Calendar7DaysIcon

package/src/components/icons/CalendarIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CalendarIcon = ({ color, size, disabled, inactive }) => {
+const CalendarIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -108,11 +113,5 @@ CalendarIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CalendarIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CalendarIcon

package/src/components/icons/CheckListIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CheckListIcon = ({ color, size, disabled, inactive }) => {
+const CheckListIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -103,11 +108,5 @@ CheckListIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CheckListIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CheckListIcon

package/src/components/icons/CircleAddIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CircleAddIcon = ({ color, size, disabled, inactive }) => {
+const CircleAddIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -87,11 +92,5 @@ CircleAddIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleAddIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleAddIcon

package/src/components/icons/CircleArrowLeftIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CircleArrowLeftIcon = ({ color, size, disabled, inactive }) => {
+const CircleArrowLeftIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -101,11 +106,5 @@ CircleArrowLeftIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleArrowLeftIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleArrowLeftIcon

package/src/components/icons/CircleArrowRightIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CircleArrowRightIcon = ({ color, size, disabled, inactive }) => {
+const CircleArrowRightIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -104,11 +109,5 @@ CircleArrowRightIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleArrowRightIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleArrowRightIcon

package/src/components/icons/CircleCheckMarkButtonIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, MEDIUM, MAIN_DARK_BLUE } from '../constants'
 
-const CircleCheckMarkButtonIcon = ({ color, size, disabled, inactive }) => {
+const CircleCheckMarkButtonIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -47,11 +52,4 @@ CircleCheckMarkButtonIcon.propTypes = {
   size: PropTypes.oneOf([MEDIUM])
 }
 
-CircleCheckMarkButtonIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
-
 export default CircleCheckMarkButtonIcon

package/src/components/icons/CircleCheckMarkFullIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, MEDIUM, MAIN_DARK_BLUE } from '../constants'
 
-const CircleCheckMarkFullIcon = ({ color, size, disabled, inactive }) => {
+const CircleCheckMarkFullIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = styles.svgClassName
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -55,11 +60,5 @@ CircleCheckMarkFullIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleCheckMarkFullIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleCheckMarkFullIcon

package/src/components/icons/CircleCheckMarkIcon.jsx

@@ -3,7 +3,13 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const CircleCheckMarkIcon = ({ color, size, checked, disabled, inactive }) => {
+const CircleCheckMarkIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  checked = true,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -84,10 +90,5 @@ CircleCheckMarkIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleCheckMarkIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  checked: true
-}
 
 export default CircleCheckMarkIcon

package/src/components/icons/CircleCloseHoverIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, MEDIUM, MAIN_DARK_BLUE } from '../constants'
 
-const CircleCloseHoverIcon = ({ color, size, disabled, inactive }) => {
+const CircleCloseHoverIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -74,11 +79,5 @@ CircleCloseHoverIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleCloseHoverIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleCloseHoverIcon

package/src/components/icons/CircleCloseIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, MEDIUM, LARGE, MAIN_DARK_BLUE, SMALL } from '../constants'
 
-const CircleCloseIcon = ({ color, size, disabled, inactive }) => {
+const CircleCloseIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -99,11 +104,5 @@ CircleCloseIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleCloseIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleCloseIcon

package/src/components/icons/CircleCopyPasteIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MAIN_DARK_BLUE, MEDIUM } from '../constants'
 
-const CircleCopyPasteIcon = ({ color, size, disabled, inactive }) => {
+const CircleCopyPasteIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = SMALL,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -74,11 +79,5 @@ CircleCopyPasteIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleCopyPasteIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: SMALL,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleCopyPasteIcon

package/src/components/icons/CircleDownloadIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, MEDIUM, MAIN_DARK_BLUE } from '../constants'
 
-const CircleDownloadIcon = ({ color, size, disabled, inactive }) => {
+const CircleDownloadIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -56,11 +61,5 @@ CircleDownloadIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleDownloadIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleDownloadIcon

package/src/components/icons/CircleEditIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MAIN_DARK_BLUE, MEDIUM } from '../constants'
 
-const CircleEditIcon = ({ color, size, disabled, inactive }) => {
+const CircleEditIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = SMALL,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -76,11 +81,5 @@ CircleEditIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleEditIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: SMALL,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleEditIcon