import React from 'react'
import { useInputValue } from './useInputValue.js'

function InputValueDemo () {
  const [username, setUsername] = useInputValue()
  return (
    <>
      <input
        id="path"
        type="text"
        placeholder="Username"
        value={username}
        onChange={setUsername}
      />
      <span>your username is: {username}</span>
    </>
  )
}

export default {
  title: 'Design System/Base/useInputValue',
  component: useInputValue,
  render: () => <InputValueDemo />,
}

export const Default = {}