@swrve/core/src/input-autosize/input-autosize.stories.js

Core set of Swrve UI Components

import React from 'react'

import Component from '@reach/component-component'

import Input from '../input/input'
import InputAutosize from './input-autosize'

export default {
  title: 'Core/InputAutosize',
  component: Input
}

export const Default = args => {
  return (
    <div className="m-4">
      <Component initialState={{ value: '' }}>
        {({ setState, state }) => (
          <InputAutosize
            maxLength={50}
            value={state.value}
            placeholder={'Input Autosize'}
            onChange={({ target: { value } }) => {
              setState({ value })
            }}
            {...args}
          />
        )}
      </Component>
    </div>
  )
}

Default.storyName = 'default'
Default.parameters = {
  docs: {
    description: {
      component: `The Input Autosize component renders an Input component.\n\nIt accepts all props associated with input attributes, general
      React-related props (e.g. onChange) and custom classNames.`
    }
  }
}