grantglidewell

export function WithLoader(props) {
  return props.condition ? (
    props.children
  ) : (
    <section
      className={styles.Loading}
      style={{ height: props.height, width: props.width }}>
      <h3>{props.message}</h3>
      <Loader />
    </section>

grantglidewell

export function Option({ value, html, text, onClick }) {
  if (html) {
    return (
      <li
        data-value={value}
        onClick={onClick}
        dangerouslySetInnerHTML={{ __html: html }}
      />
    )
  } else {

grantglidewell

export class SelectGuide extends Component {
  state = {
    value: 'Initial message',
    text: 'Initial'
  }
  render() {
    return (
      <React.Fragment>
        <p>
          The Select component requires that you also import the Option

grantglidewell

Usage:

<Input name="name" placeholder="Name" disabled />
<Input
  name="name"
  autoComplete="off"
  placeholder="Name (autocomplete disabled)"
/>

    

grantglidewell

export function Toggle(props) {
  return (
    <label className={styles.switch}>
      <input {...props} type="checkbox" />
      <span className={styles.slider} />
    </label>
  );
}

grantglidewell

Usage:

<React.Fragment>
  <p>Mouseover for more information</p>
  <Infotip title="This is the Infotip title" />
</React.Fragment>

Code:

export function Infotip(props) {

grantglidewell

export class Search extends Component {
  state = {
    searchTerm: ''
  }
  componentDidMount() {
    // lets the user override the initial value in the search box
    if (this.props.override) {
      this.setState({ searchTerm: this.props.override })
    }

grantglidewell

Data:

const content = [
  {
    title: 'CONTENT TITLE',
    icon: 'fa-icon',
    children: [
      {
        name: 'CONTENT LINK',

grantglidewell

export class TextFieldType extends Component {
  constructor(props) {
    super(props);
    this.state = {
      textInput: ""
    };
  }
  render() {
    const { textInput } = this.state;
    return (

grantglidewell

export class TextareaFieldType extends Component {
  constructor(props) {
    super(props)
    this.state = {
      textInput: ''
    }
  }
  render() {
    const { textInput } = this.state
    return (