import React from 'react';

import {
  DateInputContainer,
  DateInputItem,
} from '@digigov/ui/form/DateInputContainer';
import {
  FieldContainer,
  Fieldset,
  FieldsetLegend,
} from '@digigov/ui/form/FieldContainer';

export const Dense = (_: any) => (
  <FieldContainer aria-describedby="passport-hint">
    <Fieldset>
      <FieldsetLegend size="md">
        Πότε εκδόθηκε το διαβατήριό σας;
      </FieldsetLegend>
      <DateInputContainer dense>
        <DateInputItem name="day">Ημέρα</DateInputItem>
        <DateInputItem name="month">Μήνας</DateInputItem>
        <DateInputItem width={4} name="year">
          Έτος
        </DateInputItem>
      </DateInputContainer>
    </Fieldset>
  </FieldContainer>
);

export default Dense;