import React from 'react';

import {
  FieldContainer,
  Fieldset,
  FieldsetLegend,
} from '@digigov/ui/form/FieldContainer';
import { RadioContainer, RadioItem } from '@digigov/ui/form/RadioContainer';

import { Hint } from '@digigov/ui/typography/Hint';

export const MultipleQuestions = (_: any) => (
  <FieldContainer>
    <Fieldset aria-describedby="country-hint">
      <FieldsetLegend size="sm">
        Ποιά είναι η χώρα της διαμονής σας;
      </FieldsetLegend>
      <Hint id="country-hint">
        Πείτε μας σχετικά με πρόσφατες αλλαγές. Επιλέξτε ό,τι ισχύει.
      </Hint>
      <RadioContainer>
        <RadioItem name="country" value="greece">
          Ελλάδα
        </RadioItem>
        <RadioItem name="country" value="eu">
          Χώρα εντός της Ευρωπαϊκής Ένωσης
        </RadioItem>
        <RadioItem name="country" value="world">
          Χώρα εκτός της Ευρωπαϊκής Ένωσης
        </RadioItem>
      </RadioContainer>
    </Fieldset>
  </FieldContainer>
);

export default MultipleQuestions;
