@platformatic/ui-components 0.15.5 → 0.17.1

package/src/components/Modal.jsx

@@ -1,5 +1,4 @@
 import React, { useRef } from 'react'
-import PropTypes from 'prop-types'
 import ButtonFullRounded from './ButtonFullRounded'
 import useEscapeKey from '../hooks/useEscapeKey'
 import Logo from './Logo'
@@ -7,16 +6,13 @@ import Logos from './logos'
 import styles from './Modal.module.css'
 import commonStyles from './Common.module.css'
 import {
-  MODAL_SIZES,
   SMALL,
-  MODAL_LAYOUTS,
   MODAL_COVER,
   MODAL_POPUP,
   MODAL_POPUP_V2,
   MAIN_DARK_BLUE,
   DULLS_BACKGROUND_COLOR,
   LARGE,
-  PROFILES,
   FREE,
   BASIC,
   MODAL_FULL_DARK,
@@ -262,59 +258,4 @@ function Modal ({
   return whichModal
 }
 
-Modal.propTypes = {
-  /**
-   * children
-   */
-  children: PropTypes.node,
-  /**
-   * childrenClassContainer
-   */
-  childrenClassContainer: PropTypes.string,
-  /**
-   * setIsOpen: function from Parent for close/pen
-   */
-  setIsOpen: PropTypes.func,
-  /**
-   * title: Title on top for small Modals (check MODAL_LAYOUTS)
-   */
-  title: PropTypes.string,
-  /**
-   * layout: type of Layout of the modal
-   */
-  layout: PropTypes.oneOf(MODAL_LAYOUTS),
-  /**
-   * Size: of the modal
-   */
-  size: PropTypes.oneOf(MODAL_SIZES),
-  /**
-   * profile: deprecated
-   */
-  profile: PropTypes.oneOf(PROFILES),
-  /**
-   * backgroundClassName: background of the full screen modal
-   */
-  backgroundClassName: PropTypes.string,
-  /**
-   * titleClassName: classes of the title
-   */
-  titleClassName: PropTypes.string,
-  /**
-   * modalCloseClassName: classes for the closing icon
-   */
-  modalCloseClassName: PropTypes.string,
-  /**
-   * permanent: modal could be closed only with Esc, X or Cancel
-   */
-  permanent: PropTypes.bool,
-  /**
-   * showCloseButtonOnTop: show button on X
-   */
-  showCloseButtonOnTop: PropTypes.bool,
-  /**
-   * additionalModalClassName: show button on X
-   */
-  additionalModalClassName: PropTypes.string
-}
-
 export default Modal

package/src/components/ModalDirectional.jsx

@@ -1,5 +1,4 @@
 import React, { useState, useEffect } from 'react'
-import PropTypes from 'prop-types'
 import useEscapeKey from '../hooks/useEscapeKey'
 import styles from './ModalDirectional.module.css'
 import {
@@ -55,31 +54,4 @@ function ModalDirectional ({
   )
 }
 
-ModalDirectional.propTypes = {
-  /**
-   * children
-   */
-  children: PropTypes.node,
-  /**
-   * setIsOpen
-   */
-  setIsOpen: PropTypes.func,
-  /**
-   * smallLayout
-   */
-  smallLayout: PropTypes.bool,
-  /**
-   * classNameModalLefty
-   */
-  classNameModalLefty: PropTypes.string,
-  /**
-   * permanent: modal could be closed only with Esc, X or Cancel
-   */
-  permanent: PropTypes.bool,
-  /**
-   * blurClassName: override
-   */
-  blurClassName: PropTypes.string
-}
-
 export default ModalDirectional

package/src/components/ModalStepsForward.jsx

@@ -1,10 +1,9 @@
 import React from 'react'
-import PropTypes from 'prop-types'
+import styles from './ModalStepsForward.module.css'
 import ButtonFullRounded from './ButtonFullRounded'
 import useEscapeKey from '../hooks/useEscapeKey'
 import Logo from './Logo'
 import HorizontalSeparator from './HorizontalSeparator'
-import styles from './ModalStepsForward.module.css'
 import commonStyles from './Common.module.css'
 import {
   MAIN_DARK_BLUE,
@@ -55,23 +54,4 @@ function ModalStepsForward ({
   )
 }
 
-ModalStepsForward.propTypes = {
-  /**
-   * setIsOpen
-   */
-  setIsOpen: PropTypes.func,
-  /**
-   * right
-   */
-  right: PropTypes.node,
-  /**
-   * stepper
-   */
-  stepper: PropTypes.node,
-  /**
-   * left
-   */
-  left: PropTypes.node
-}
-
 export default ModalStepsForward

package/src/components/PlatformaticIcon.jsx

@@ -1,8 +1,7 @@
 import React, { useState } from 'react'
-import PropTypes from 'prop-types'
 import Icons from './icons'
 import styles from './PlatformaticIcon.module.css'
-import { COLORS_ICON, MAIN_GREEN, SIZES, SMALL } from './constants'
+import { MAIN_GREEN, SMALL } from './constants'
 
 function PlatformaticIcon ({
   iconName = '',
@@ -50,43 +49,4 @@ function PlatformaticIcon ({
   )
 }
 
-PlatformaticIcon.propTypes = {
-  /**
-   * iconName
-   */
-  iconName: PropTypes.string.isRequired,
-  /**
-   * color
-   */
-  color: PropTypes.oneOf(COLORS_ICON),
-  /**
-   * size
-   */
-  size: PropTypes.oneOf(SIZES),
-  /**
-   * onClick
-   */
-  onClick: PropTypes.func,
-  /**
-   * classes
-   */
-  classes: PropTypes.string,
-  /**
-   * tip
-   */
-  tip: PropTypes.string,
-  /**
-   * disabled
-   */
-  disabled: PropTypes.bool,
-  /**
-   * inactive
-   */
-  inactive: PropTypes.bool,
-  /**
-   * handleOverInternally
-   */
-  internalOverHandling: PropTypes.bool
-}
-
 export default PlatformaticIcon

package/src/components/SearchBarV2.jsx

@@ -1,9 +1,8 @@
 import React, { useRef, useState } from 'react'
-import PropTypes from 'prop-types'
 import commonStyles from './Common.module.css'
 import styles from './SearchBarV2.module.css'
 import PlatformaticIcon from './PlatformaticIcon'
-import { RICH_BLACK, SMALL, TRANSPARENT, WHITE } from './constants'
+import { RICH_BLACK, SMALL, WHITE } from './constants'
 function SearchBarV2 ({
   color = WHITE,
   backgroundColor = RICH_BLACK,
@@ -90,47 +89,4 @@ function SearchBarV2 ({
   )
 }
 
-SearchBarV2.propTypes = {
-  /**
-   * onSubmit
-   */
-  onSubmit: PropTypes.func,
-  /**
-   * onSubmit
-   */
-  onChange: PropTypes.func,
-  /**
-   * onSubmit
-   */
-  onClear: PropTypes.func,
-  /**
-   * color
-   */
-  color: PropTypes.oneOf([WHITE, RICH_BLACK]),
-  /**
-   * backgroundColor
-   */
-  backgroundColor: PropTypes.oneOf([WHITE, RICH_BLACK, TRANSPARENT]),
-  /**
-   * placeholder
-   */
-  placeholder: PropTypes.string,
-  /**
-   * dataAttrName
-  */
-  dataAttrName: PropTypes.string,
-  /**
-   * dataAttrValue
-  */
-  dataAttrValue: PropTypes.string,
-  /**
-   * inputTextClassName
-  */
-  inputTextClassName: PropTypes.string,
-  /**
-   * paddingClass
-  */
-  paddingClass: PropTypes.string
-}
-
 export default SearchBarV2

package/src/components/Sidebar.jsx

@@ -7,7 +7,6 @@ import styles from './Sidebar.module.css'
 import ReactTooltip from 'react-tooltip'
 import HorizontalSeparator from './HorizontalSeparator'
 import PlatformaticIcon from './PlatformaticIcon'
-import PropTypes from 'prop-types'
 import { DULLS_BACKGROUND_COLOR, MEDIUM, WHITE } from './constants'
 
 function Sidebar ({
@@ -137,56 +136,4 @@ function Sidebar ({
   )
 }
 
-Sidebar.propTypes = {
-  /**
-   * title
-   */
-  title: PropTypes.string,
-  /**
-   * title
-   */
-  labelButtonSettings: PropTypes.string,
-  /**
-   * defaultSelected
-   */
-  defaultSelected: PropTypes.string,
-  /**
-   * addTitle
-   */
-  addTitle: PropTypes.string,
-  /**
-   * items: array with keys
-   * id: id of the worspacedSeleted
-   * title: name to display
-   * subtitle: secondary title
-   * icon: what Icon
-   */
-  items: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string.isRequired,
-    title: PropTypes.string,
-    subtitle: PropTypes.string,
-    iconName: PropTypes.string
-  })),
-  /**
-   * Apply onClickItemSelectedParent
-   */
-  onClickItemSelectedParent: PropTypes.func,
-  /**
-   * Apply onClickAdd: function called clicking on plus button
-   */
-  onClickAdd: PropTypes.func,
-  /**
-   * Apply onClickSettings: function called clicking on Settings button
-   */
-  onClickSettings: PropTypes.func,
-  /**
-   * disableClickAdd
-   */
-  disableClickAdd: PropTypes.bool,
-  /**
-   * disableClickSettings
-   */
-  disableClickSettings: PropTypes.bool
-}
-
 export default Sidebar

package/src/components/Status.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-import PropTypes from 'prop-types'
 import PlatformaticIcon from './PlatformaticIcon'
-import { COLORS_ICON, TINY, SIZES, WHITE } from './constants'
+import { TINY, WHITE } from './constants'
 
 function Status ({
   color = WHITE,
@@ -17,20 +16,4 @@ function Status ({
   )
 }
 
-Status.propTypes = {
-  /**
-   * color
-   */
-  color: PropTypes.oneOf(COLORS_ICON),
-  /**
-   * status
-   */
-  status: PropTypes.string,
-  /**
-   * Size
-   */
-  size: PropTypes.oneOf(SIZES)
-
-}
-
 export default Status

package/src/components/TabbedWindow.jsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from 'react'
-import PropTypes from 'prop-types'
 import styles from './TabbedWindow.module.css'
-import { COLORS_BUTTON, WHITE } from './constants'
+import { WHITE } from './constants'
 
 function TabbedWindow ({
   tabs = [],
@@ -53,35 +52,4 @@ function TabbedWindow ({
   )
 }
 
-TabbedWindow.propTypes = {
-  /**
-   * tabs
-   */
-  tabs: PropTypes.array,
-  /**
-   * keySelected
-   */
-  keySelected: PropTypes.string,
-  /**
-   * callbackSelected
-   */
-  callbackSelected: PropTypes.func,
-  /**
-   * tabContainerClassName
-   */
-  tabContainerClassName: PropTypes.string,
-  /**
-   * tabContentClassName
-   */
-  tabContentClassName: PropTypes.string,
-  /**
-   * textClassName
-   */
-  textClassName: PropTypes.string,
-  /**
-   * horizontalSeparatorColor
-   */
-  horizontalSeparatorColor: PropTypes.oneOf(COLORS_BUTTON)
-}
-
 export default TabbedWindow

package/src/components/Tag.jsx

@@ -1,8 +1,7 @@
 import React from 'react'
-import PropTypes from 'prop-types'
 import commonStyles from './Common.module.css'
 import styles from './Tag.module.css'
-import { COLORS_BUTTON, OPACITY_100, OPACITIES, SIZES, WHITE } from './constants'
+import { OPACITY_100, WHITE } from './constants'
 import PlatformaticIcon from './PlatformaticIcon'
 
 function Tag ({
@@ -37,47 +36,5 @@ function Tag ({
     </div>
   )
 }
-Tag.propTypes = {
-  /**
-   * color
-   */
-  color: PropTypes.oneOf(COLORS_BUTTON),
-  /**
-   * text
-   */
-  text: PropTypes.string,
-  /**
-   * textClassName
-   */
-  textClassName: PropTypes.string,
-  /**
-   * backgroundColor
-   */
-  backgroundColor: PropTypes.oneOf(COLORS_BUTTON),
-  /**
-   * bordered
-   */
-  bordered: PropTypes.bool,
-  /**
-   * opaque
-   */
-  opaque: PropTypes.oneOf([OPACITIES]),
-  /**
-     * fullRounded
-     */
-  fullRounded: PropTypes.bool,
-  /**
-   * platformaticIcon
-   */
-  platformaticIcon: PropTypes.shape({
-    iconName: PropTypes.string,
-    color: PropTypes.oneOf(COLORS_BUTTON),
-    size: PropTypes.oneOf(SIZES)
-  }),
-  /**
-   * paddingClass
-   */
-  paddingClass: PropTypes.string
-}
 
 export default Tag

package/src/components/TextWithLabel.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-import PropTypes from 'prop-types'
-import { FONT_BASE, FONT_XS, MAIN_DARK_BLUE, WHITE } from './constants'
+import { FONT_BASE, WHITE } from './constants'
 import commonStyles from './Common.module.css'
 import styles from './TextWithLabel.module.css'
 
@@ -23,27 +22,4 @@ function TextWithLabel (props) {
   )
 }
 
-TextWithLabel.propTypes = {
-  /**
-   * label
-   */
-  label: PropTypes.string,
-  /**
-   * text
-   */
-  text: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  /**
-   * children
-   */
-  children: PropTypes.node,
-  /**
-   * white
-   */
-  color: PropTypes.oneOf([WHITE, MAIN_DARK_BLUE]),
-  /**
-   * Font Size
-   */
-  fontSize: PropTypes.oneOf([FONT_BASE, FONT_XS])
-}
-
 export default TextWithLabel

package/src/components/Tooltip.jsx

@@ -1,7 +1,6 @@
-import PropTypes from 'prop-types'
+import React, { useEffect, useRef, useState } from 'react'
 import styles from './Tooltip.module.css'
-import { useEffect, useRef, useState } from 'react'
-import { DIRECTIONS, DIRECTION_BOTTOM, DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_TOP, POSITIONS, POSITION_CENTER, POSITION_END, POSITION_START } from './constants'
+import { DIRECTION_BOTTOM, DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_TOP, POSITION_CENTER, POSITION_END, POSITION_START } from './constants'
 
 function Tooltip ({
   immediateActive = true,
@@ -24,7 +23,7 @@ function Tooltip ({
     componentClassName += ' ' + styles[`${position}`]
   }
   const fixedStyle = { top: '0px', left: '0px' }
-  const wrapperRef = useRef()
+  const wrapperRef = useRef(null)
 
   useEffect(() => {
     if (activeDependsOnVisible) {
@@ -115,47 +114,4 @@ function Tooltip ({
   )
 }
 
-Tooltip.propTypes = {
-  /**
-   * direction
-   */
-  direction: PropTypes.oneOf(DIRECTIONS),
-  /**
-   * content
-   */
-  content: PropTypes.node,
-  /**
-   * children
-   */
-  children: PropTypes.node,
-  /**
-   * tooltipClassName
-   */
-  tooltipClassName: PropTypes.string,
-  /**
-   * delay
-   */
-  delay: PropTypes.number,
-  /**
-   * visible
-   */
-  visible: PropTypes.bool,
-  /**
-   * immediateActive
-   */
-  immediateActive: PropTypes.bool,
-  /**
-   * activeDependsOnVisible
-   */
-  activeDependsOnVisible: PropTypes.bool,
-  /**
-   * offset
-   */
-  offset: PropTypes.number,
-  /**
-   * position
-   */
-  position: PropTypes.oneOf(POSITIONS)
-}
-
 export default Tooltip

package/src/components/TooltipAbsolute.jsx

@@ -1,7 +1,6 @@
-import PropTypes from 'prop-types'
 import styles from './TooltipAbsolute.module.css'
 import { useEffect, useState } from 'react'
-import { DIRECTIONS, DIRECTION_LEFT, DIRECTION_BOTTOM, DIRECTION_TOP, DIRECTION_RIGHT, POSITION_START } from './constants'
+import { DIRECTION_LEFT, DIRECTION_BOTTOM, DIRECTION_TOP, DIRECTION_RIGHT, POSITION_START } from './constants'
 
 const TooltipAbsolute = ({
   direction = DIRECTION_TOP,
@@ -69,43 +68,4 @@ const TooltipAbsolute = ({
   )
 }
 
-TooltipAbsolute.propTypes = {
-  /**
-   * direction
-   */
-  direction: PropTypes.oneOf(DIRECTIONS),
-  /**
-   * content
-   */
-  content: PropTypes.node,
-  /**
-   * children
-   */
-  children: PropTypes.node,
-  /**
-   * tooltipClassName
-   */
-  tooltipClassName: PropTypes.string,
-  /**
-   * delay
-   */
-  delay: PropTypes.number,
-  /**
-   * offset
-   */
-  offset: PropTypes.number,
-  /**
-   * position
-   */
-  position: PropTypes.string,
-  /**
-   * visible
-   */
-  visible: PropTypes.bool,
-  /**
-   * activeDependsOnVisible
-   */
-  activeDependsOnVisible: PropTypes.bool
-}
-
 export default TooltipAbsolute