Sha256: b4d5aaa709ef6d3dcfcc3d8d8a66e76fb09de4ff9ea2d704e9b42d127064d416

Contents?: true

Size: 1.73 KB

Versions: 2

Compression:

Stored size: 1.73 KB

Contents

import React, { useState } from 'react'
import { Body, Inline, Textarea, TextInput } from '../../'

const InlineInputOptions = (props) => {
  const [formFields, setFormFields] = useState({
    inputOne: 'Input One',
    inputTwo: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
  })

  const handleChange = ({ target }) => {
    const { name, value } = target
    setFormFields({ ...formFields, [name]: value })
  }

  return (
    <div>
      <Inline
          {...props}
          displayKit={
            <Body
                {...props}
                kitType="Body"
                text={formFields.inputOne}
            />
          }
          formInput={
            <TextInput
                {...props}
                name="inputOne"
                onChange={handleChange}
                value={formFields.inputOne}
            />
          }
      />
      <Inline
          {...props}
          displayKit={
            <Body
                {...props}
                kitType="Body"
                text={formFields.inputTwo}
            />
          }
          formInput={
            <Textarea
                {...props}
                name="inputTwo"
                onChange={handleChange}
                resize="auto"
                value={formFields.inputTwo}
            />
          }
      />
    </div>
  )
}

export default InlineInputOptions

Version data entries

2 entries across 2 versions & 1 rubygems

Version Path
playbook_ui-8.2.1.pre.alpha1 app/pb_kits/playbook/pb_inline/docs/_inline_input_options.jsx
playbook_ui-8.1.0.pre.alpha1 app/pb_kits/playbook/pb_inline/docs/_inline_input_options.jsx