@platformatic/ui-components 0.4.0 → 0.5.0

package/src/components/icons/CirclePlayIcon.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 CirclePlayIcon = ({ color, size, disabled, inactive }) => {
+const CirclePlayIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -88,11 +93,5 @@ CirclePlayIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CirclePlayIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CirclePlayIcon

package/src/components/icons/CircleRestartIcon.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 CircleRestartIcon = ({ color, size, disabled, inactive }) => {
+const CircleRestartIcon = ({
+  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 @@ CircleRestartIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleRestartIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: SMALL,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleRestartIcon

package/src/components/icons/CircleStopIcon.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 CircleStopIcon = ({ color, size, disabled, inactive }) => {
+const CircleStopIcon = ({
+  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 @@ CircleStopIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleStopIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleStopIcon

package/src/components/icons/CircleSubtractIcon.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 CircleSubtractIcon = ({ color, size, disabled, inactive }) => {
+const CircleSubtractIcon = ({
+  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 @@ CircleSubtractIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleSubtractIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleSubtractIcon

package/src/components/icons/CircleTwoArrowsDownIcon.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 CircleTwoArrowsDownIcon = ({ color, size, disabled, inactive }) => {
+const CircleTwoArrowsDownIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -90,11 +95,5 @@ CircleTwoArrowsDownIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleTwoArrowsDownIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleTwoArrowsDownIcon

package/src/components/icons/CircleTwoArrowsUpIcon.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 CircleTwoArrowsUpIcon = ({ color, size, disabled, inactive }) => {
+const CircleTwoArrowsUpIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -93,11 +98,5 @@ CircleTwoArrowsUpIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CircleTwoArrowsUpIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CircleTwoArrowsUpIcon

package/src/components/icons/CloseIcon.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 CloseIcon = ({ color, size, disabled, inactive }) => {
+const CloseIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -85,11 +90,5 @@ CloseIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CloseIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CloseIcon

package/src/components/icons/CloudIcon.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 CloudIcon = ({ color, size, disabled, inactive }) => {
+const CloudIcon = ({
+  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 @@ CloudIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CloudIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CloudIcon

package/src/components/icons/CodeTestingIcon.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 CodeTestingIcon = ({ color, size, disabled, inactive }) => {
+const CodeTestingIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -109,11 +114,5 @@ CodeTestingIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CodeTestingIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CodeTestingIcon

package/src/components/icons/ComputerIcon.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 ComputerIcon = ({ color, size, disabled, inactive }) => {
+const ComputerIcon = ({
+  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 @@ ComputerIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ComputerIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ComputerIcon

package/src/components/icons/ConfigureDatabaseIcon.jsx

@@ -3,7 +3,12 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, LARGE, MAIN_DARK_BLUE, MEDIUM, SIZES, SMALL } from '../constants'
 
-const ConfigureDatabaseIcon = ({ color, size, disabled, inactive }) => {
+const ConfigureDatabaseIcon = ({
+  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 @@ ConfigureDatabaseIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ConfigureDatabaseIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ConfigureDatabaseIcon

package/src/components/icons/CopyPasteIcon.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 CopyPasteIcon = ({ color, size, disabled, inactive }) => {
+const CopyPasteIcon = ({
+  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 @@ CopyPasteIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CopyPasteIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CopyPasteIcon

package/src/components/icons/CreateAppIcon.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 CreateAppIcon = ({ color, size, disabled, inactive }) => {
+const CreateAppIcon = ({
+  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 @@ CreateAppIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CreateAppIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CreateAppIcon

package/src/components/icons/CreditCardIcon.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 CreditCardIcon = ({ color, size, disabled, inactive }) => {
+const CreditCardIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -90,11 +95,5 @@ CreditCardIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-CreditCardIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default CreditCardIcon

package/src/components/icons/DatabaseIcon.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 DatabaseIcon = ({ color, size, disabled, inactive }) => {
+const DatabaseIcon = ({
+  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 @@ DatabaseIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-DatabaseIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default DatabaseIcon

package/src/components/icons/DatabaseMigrationIcon.jsx

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

package/src/components/icons/DepencenciesReloadIcon.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 DepencenciesReloadIcon = ({ color, size, disabled, inactive }) => {
+const DepencenciesReloadIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -95,11 +100,5 @@ DepencenciesReloadIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-DepencenciesReloadIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default DepencenciesReloadIcon

package/src/components/icons/EditDocumentIcon.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 EditDocumentIcon = ({ color, size, disabled, inactive }) => {
+const EditDocumentIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -102,11 +107,5 @@ EditDocumentIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-EditDocumentIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default EditDocumentIcon

package/src/components/icons/EditIcon.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 EditIcon = ({ color, size, disabled, inactive }) => {
+const EditIcon = ({
+  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 @@ EditIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-EditIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default EditIcon

package/src/components/icons/EnlargeIcon.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 EnlargeIcon = ({ color, size, disabled, inactive }) => {
+const EnlargeIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -91,11 +96,5 @@ EnlargeIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-EnlargeIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default EnlargeIcon

package/src/components/icons/EntryIcon.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 EntryIcon = ({ color, size, disabled, inactive }) => {
+const EntryIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -88,11 +93,5 @@ EntryIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-EntryIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default EntryIcon

package/src/components/icons/EntrypointIcon.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 EntrypointIcon = ({ color, size, disabled, inactive }) => {
+const EntrypointIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -85,11 +90,5 @@ EntrypointIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-EntrypointIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default EntrypointIcon

package/src/components/icons/ExpandIcon.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 ExpandIcon = ({ color, size, disabled, inactive }) => {
+const ExpandIcon = ({
+  color = MAIN_DARK_BLUE,
+  size = MEDIUM,
+  disabled = false,
+  inactive = false
+}) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
@@ -90,11 +95,5 @@ ExpandIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ExpandIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ExpandIcon

package/src/components/icons/ExploreDocIcon.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 ExploreDocIcon = ({ color, size, disabled, inactive }) => {
+const ExploreDocIcon = ({
+  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 @@ ExploreDocIcon.propTypes = {
    */
   inactive: PropTypes.bool
 }
-ExploreDocIcon.defaultProps = {
-  color: MAIN_DARK_BLUE,
-  size: MEDIUM,
-  disabled: false,
-  inactive: false
-}
 
 export default ExploreDocIcon

package/src/components/icons/EyeClosedIcon.jsx

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

package/src/components/icons/EyeOpenedIcon.jsx

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