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

export default {
  name: 'GenericFormInput',
  functional: true,
  props: {
    disabled: {
      type: Boolean,
      default: false,
    },
    multiple: {
      type: Boolean,
      default: false,
    },
    readonly: {
      type: Boolean,
      default: false,
    },
  },
  render(h: Function, { props, data, children }: Functional): Element {
    return (
      <div
        {...data}
        class={{
          'tao__form-input w-full flex rounded bg-white line-height-default border-form-02': true,
          'disabled cursor-not-allowed': props.disabled,
          'tao__form-input-multiple': props.multiple,
          'read-only cursor-pointer': props.readonly,
        }}>
        { children }
      </div>
    );
  },
};
</script>
