@platformatic/ui-components 0.1.142 → 0.1.144

package/src/components/icons/SocialXIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const SocialXIcon = ({ color, size, disabled }) => {
+const SocialXIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   const filledClassName = styles[`filled-${color}`]
   let icon = <></>
 
@@ -75,12 +78,17 @@ SocialXIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 SocialXIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default SocialXIcon

package/src/components/icons/SortableIcon.jsx

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

package/src/components/icons/StackablesIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const StackablesIcon = ({ color, size, disabled }) => {
+const StackablesIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -111,12 +114,17 @@ StackablesIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 StackablesIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default StackablesIcon

package/src/components/icons/StackablesPluginIcon.jsx

@@ -3,12 +3,15 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const StackablesPluginIcon = ({ color, size, disabled }) => {
+const StackablesPluginIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   const filledClassName = styles[`filled-${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -124,12 +127,17 @@ StackablesPluginIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 StackablesPluginIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default StackablesPluginIcon

package/src/components/icons/StackablesTemplateIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const StackablesTemplateIcon = ({ color, size, disabled }) => {
+const StackablesTemplateIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -122,12 +125,17 @@ StackablesTemplateIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 StackablesTemplateIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default StackablesTemplateIcon

package/src/components/icons/StopIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const StopIcon = ({ color, size, disabled }) => {
+const StopIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -75,12 +78,17 @@ StopIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 StopIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default StopIcon

package/src/components/icons/SwitchIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const SwitchIcon = ({ color, size, disabled }) => {
+const SwitchIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -77,12 +80,17 @@ SwitchIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 SwitchIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default SwitchIcon

package/src/components/icons/TeamsIcon.jsx

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

package/src/components/icons/TerminalIcon.jsx

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

package/src/components/icons/TrashIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const TrashIcon = ({ color, size, disabled }) => {
+const TrashIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -83,13 +86,18 @@ TrashIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 
 TrashIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default TrashIcon

package/src/components/icons/TwoUsersIcon.jsx

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

package/src/components/icons/UpgradeIcon.jsx

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

package/src/components/icons/UserComputerIcon.jsx

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

package/src/components/icons/UserIcon.jsx

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

package/src/components/icons/UserRemoveIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const UserRemoveIcon = ({ color, size, tip, disabled }) => {
+const UserRemoveIcon = ({ color, size, tip, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {

package/src/components/icons/UserRoleIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const UserRoleIcon = ({ color, size, tip, disabled }) => {
+const UserRoleIcon = ({ color, size, tip, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {

package/src/components/icons/WorkspaceDynamicIcon.jsx

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

package/src/components/icons/WorkspaceEmptyIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, MEDIUM, EXTRA_LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const WorkspaceEmptyIcon = ({ color, size, disabled }) => {
+const WorkspaceEmptyIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   let icon = <></>
 
   switch (size) {
@@ -51,12 +54,17 @@ WorkspaceEmptyIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 WorkspaceEmptyIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default WorkspaceEmptyIcon

package/src/components/icons/WorkspaceFailIcon.jsx

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

package/src/components/icons/WorkspaceGitHubIcon.jsx

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types'
 import styles from './Icons.module.css'
 import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, EXTRA_LARGE, MAIN_DARK_BLUE } from '../constants'
 
-const WorkspaceGitHubIcon = ({ color, size, disabled }) => {
+const WorkspaceGitHubIcon = ({ color, size, disabled, inactive }) => {
   let className = `${styles.svgClassName} ` + styles[`${color}`]
   if (disabled) {
     className += ` ${styles.iconDisabled}`
   }
+  if (inactive) {
+    className += ` ${styles.iconInactive}`
+  }
   const filledClassName = styles[`filled-${color}`]
   let icon = <></>
 
@@ -128,12 +131,17 @@ WorkspaceGitHubIcon.propTypes = {
   /**
    * disabled
    */
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  /**
+   * inactive
+   */
+  inactive: PropTypes.bool
 }
 WorkspaceGitHubIcon.defaultProps = {
   color: MAIN_DARK_BLUE,
   size: MEDIUM,
-  disabled: false
+  disabled: false,
+  inactive: false
 }
 
 export default WorkspaceGitHubIcon