import React from 'react';
import { AutoComplete } from '@digigov/ui/form/AutoComplete';
import { suggest } from '@digigov/ui/form/AutoComplete/utils';
import { Button } from '@digigov/ui/form/Button';
import { FieldContainer, Fieldset } from '@digigov/ui/form/FieldContainer';
import Paragraph from '@digigov/ui/typography/Paragraph';

export const MultipleWithMinLength = (_: any) => (
  <div>
    <Paragraph>
      Εδώ, ο ελάχιστος αριθμός χαρακτήρων που πρέπει να εισαχθεί ώστε να αρχίσει
      να φιλτράρεται η αναζήτηση είναι 2.
    </Paragraph>
    <FieldContainer>
      <Fieldset marginBottom={4}>
        <AutoComplete
          source={suggest}
          multiple
          minLength={2}
          width="50%"
          id="multiple-select-default"
        />
      </Fieldset>
    </FieldContainer>
    <Button>Υποβολή</Button>
  </div>
);

export default MultipleWithMinLength;