Inputs

import React from 'react'
import { InputDate } from 'xf-material-components'

const YourFunction = () => {
  return (
    <InputDate 
      value={yourString} 
      placeHolder={yourString} 
      onChange={yourFunction} 
    />
  )
}

export default YourFunction

import React from 'react'
import { InputText } from 'xf-material-components'

const YourFunction = () => {
  return (
    <InputText 
      value={yourString} 
      placeHolder={yourString} 
      onChange={yourFunction} 
      errorMessage={yourString}
    />
  )
}

export default YourFunction

import React from 'react'
import { TextArea } from 'xf-material-components'

const YourFunction = () => {
  return (
    <InputText 
      value={yourString} 
      placeHolder={yourString} 
      onChange={yourFunction} 
      errorMessage={yourString}
    />
  )
}

export default YourFunction

// need to add logic
import React from 'react'
import { InputCheck } from 'xf-material-components'

const YourFunction = () => {
  return (
    <InputCheck />
  )
}

export default YourFunction

import React from 'react'
import { InputSlider } from 'xf-material-components'

const YourFunction = () => {
  return (
    <InputSlider onChange={yourFunction} />
  )
}

export default YourFunction

import React from 'react'
import { InputDropdown } from 'xf-material-components'

const YourFunction = () => {
  return (
    <InputDropdown
      onChange={yourFunction}
      options={[
        { value: 'yourValue', label: 'yourLabel' }
      ]} 
     />
  )
}

export default YourFunction