bpk-component-fieldset

> Backpack fieldset component.

Installation

``sh
npm install bpk-component-fieldset --save-dev
`

Usage

`js
import React, { Component } from 'react';
import BpkFieldset from 'bpk-component-fieldset';
import BpkInput, { INPUT_TYPES } from 'bpk-component-input';

class FieldsetContainer extends Component {
constructor(props) {
super(props);

this.state = {
value: '',
};

}

onChange = (e) => {
this.setState({
value: e.target.value,
});
}

render() {
const isValid = this.state.value !== '';

return (
label="Name"
validationMessage="Please enter a name"
>
id="name_input"
name="name"
type={INPUT_TYPES.text}
placeholder="e.g. Joe Bloggs"
value={this.state.value}
valid={isValid}
/>

);
}
}
`

Props

| Property | PropType | Required | Default Value |
| ----------------- | -------- | -------- | ------------- |
| children | node | true | - |
| label | string | true | - |
| className | string | false | null |
| disabled | bool | false | false |
| isCheckbox | bool | false | false |
| required | bool | false | false |
| valid | bool | false | null |
| validationMessage | string | false | null |
| validationProps | object | false | {} |
| description | string | false | null |

> Note: There are a couple of props that behave differently when using isCheckbox:
> - valid: checkboxes don't have a valid prop so you have to apply it to the fieldset directly
> - label`: checkboxes have their own labels so it's safe to omit these