<script>
// @flow
/** @jsx h */

export default {
  name: 'GenericFormGroup',
  functional: true,
  props: {
    error: {
      type: Boolean,
      default: false,
    },
    loading: {
      type: Boolean,
      default: false,
    },
    loadingIcon: {
      type: Boolean,
      default: false,
    },
  },
  render(h: Function, { props, data, children }: Functional): Element {
    return (
      <div
        {...data}
        class={{
          'tao__form-group relative flex flex-wrap mb-3 line-height-default align-end': true,
          'tao__form-group--error': props.error,
          'tao__form-group--loading': props.loading,
          'tao__form-group--loading-icon': props.loadingIcon,
        }}>
        { children }
      </div>
    );
  },
};
</script>
