// Copyright 2020 Thomas Hintz
//
// This file is part of the Alpha Centauri Farming project.
//
// The Alpha Centauri Farming project is free software: you can
// redistribute it and/or modify it under the terms of the GNU General
// Public License as published by the Free Software Foundation, either
// version 3 of the License, or (at your option) any later version.
//
// The Alpha Centauri Farming project is distributed in the hope that
// it will be useful, but WITHOUT ANY WARRANTY; without even the
// implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR
// PURPOSE.  See the GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with the Alpha Centauri Farming project.  If not, see
// <https://www.gnu.org/licenses/>.

import React, { Fragment } from 'react'

export { GroupBox, Row, Col, Button }

class GroupBox extends React.Component {
    render() {
        return (
            <div className='panel card'>
              {this.props.title ?
                  (<div className='card-divider'>
                    {this.props.title}
                   </div>) : (<Fragment />)}
                <div className={'card-section ' + this.props.className ? this.props.className : ''}>
                {this.props.children}
              </div>
            </div>
        );
    }
}

class Row extends React.Component {
    render() {
        return (<div className={'grid-x full-width ' +
                                (this.props.collapse ? 'collapse' : '') + ' ' +
                                (this.props.className ? this.props.className : '')} >
                {this.props.children}</div>);
    }
}

class Col extends React.Component {
    render() {
        return (
            <div className={'cell small-' + this.props.width}>
                {this.props.children}
            </div>
        );
    }
}

class Button extends React.Component {
    render() {
        return (
            <button className={'button ' + (this.props.size ? this.props.size : '') +
                    ' ' + (this.props.className ? this.props.className : '')}
                    type={this.props.type || 'button'}
                    disabled={this.props.disabled}
                    onClick={this.props.onClick} >
              {this.props.children}
            </button>
        );
    }
}