import React from 'react';
import { ErrorMessage } from '@digigov/ui/form/ErrorMessage';
import { FieldContainer } from '@digigov/ui/form/FieldContainer';
import { LabelContainer, LabelTitle } from '@digigov/ui/form/LabelContainer';
import { TextInput } from '@digigov/ui/form/TextInput';
import { Hint } from '@digigov/ui/typography/Hint';

export const WithErrorMessage = (_: any) => (
  <FieldContainer error aria-describedby="input-error">
    <LabelContainer>
      <LabelTitle size="md">Όνομα επιχείρησης</LabelTitle>
      <Hint id="input-hint">
        Ποιο είναι το όνομα που εμφανίζεται στην εφορία;
      </Hint>
      <ErrorMessage id="input-error">
        Πρέπει να συμπληρώσετε το πεδίο.
      </ErrorMessage>
      <TextInput
        aria-describedby="input-hint"
        error
        name="inputext"
      ></TextInput>
    </LabelContainer>
  </FieldContainer>
);

export default WithErrorMessage;