Autocomplete

() => {
  const props = {
    onFoundItems: (...args) => {
      console.log('onFoundItems', ...args)
    },
    onChangeSearchValue: (...args) => {
      console.log('onChangeSearchValue', ...args)
    },
    onSelectItem: (...args) => {
      console.log('onSelectItem', ...args)
    },
    onSelectedItemsChanged: (...args) => {
      console.log('onSelectedItemsChanged', ...args)
    },
    onClickItem: (...args) => {
      console.log('onClickItem', ...args)
    },
    options: [
      {
        id: 1,
        header: 'Республика Коми',
      },
      {
        id: 2,
        header: 'Республика Саха',
      },
      {
        id: 3,
        header: 'Республика Марий Эл',
      },
      {
        id: 4,
        header: 'Республика Мордовия',
      },
    ],
  }
  return (
    <div className="docz-space-between">
      <Autocomplete {...props} placeholder="Начните вводить" />
      <h2>Заполненное значение</h2>
      <Autocomplete
        {...props}
        value="Республика Марий Эл"
        placeholder="Начните вводить"
      />
      <h2>Выключенное состояние</h2>
      <Autocomplete {...props} disabled placeholder="Начните вводить" />
      <h2>Без данных</h2>
      <Autocomplete {...props} options={[]} placeholder="Начните вводить" />
      <h2>Состояние загрузки</h2>
      <Autocomplete {...props} loading placeholder="Начните вводить" />
      <h2>Состояние ошибки</h2>
      <Autocomplete
        {...props}
        error="Ошибка!"
        placeholder="Начните вводить"
      />
      <h2>С иконкой</h2>
      <Autocomplete
        {...props}
        icon="search-icon"
        placeholder="Начните вводить"
      />
      <h2>Переопределения текста несовпадения</h2>
      <Autocomplete
        {...props}
        value="Несовпадения случаются"
        notFound={
          <Autocomplete.NotFound>Nothing found</Autocomplete.NotFound>
        }
        placeholder="Начните вводить"
      />
      <h2>Переопределение текста загрузки</h2>
      <Autocomplete
        {...props}
        loading
        loader={<Autocomplete.Loader>Loading...</Autocomplete.Loader>}
        placeholder="Начните вводить"
      />
      <h2>Переопределение сортировки списка</h2>
      <Autocomplete
        {...props}
        sortOptions={options =>
          options
            .sort((a, b) =>
              a.header.toLowerCase() > b.header.toLowerCase() ? 1 : -1,
            )
            .reverse()
        }
        placeholder="Начните вводить"
      />
      <h2>Много данных</h2>
      <Autocomplete
        {...props}
        placeholder="Много данных"
        options={[
          {
            id: 1,
            header: 'Республика Адыгея',
          },
          {
            id: 2,
            header: 'Республика Башкортостан',
          },
          {
            id: 3,
            header: 'Республика Бурятия',
          },
          {
            id: 4,
            header: 'Республика Алтай',
          },
          {
            id: 5,
            header: 'Республика Дагестан',
          },
          {
            id: 6,
            header: 'Республика Ингушетия',
          },
          {
            id: 7,
            header: 'Кабардино-Балкарская Республика',
          },
          {
            id: 8,
            header: 'Республика Калмыкия',
          },
          {
            id: 9,
            header: 'Карачаево-Черкесская Республика',
          },
          {
            id: 10,
            header: 'Республика Карелия',
          },
          {
            id: 11,
            header: 'Республика Коми',
          },
          {
            id: 12,
            header: 'Республика Марий Эл',
          },
          {
            id: 13,
            header: 'Республика Мордовия',
          },
          {
            id: 14,
            header: 'Республика Саха',
          },
          {
            id: 15,
            header: 'Республика Северная Осетия',
          },
          {
            id: 16,
            header: 'Республика Татарстан',
          },
          {
            id: 17,
            header: 'Республика Тыва',
          },
          {
            id: 18,
            header: 'Удмуртская Республика',
          },
          {
            id: 19,
            header: 'Республика Хакасия',
          },
          {
            id: 20,
            header: 'Чеченская Республика',
          },
          {
            id: 21,
            header: 'Чувашская Республика',
          },
          {
            id: 22,
            header: 'Алтайский край',
          },
          {
            id: 23,
            header: 'Краснодарский край',
          },
          {
            id: 24,
            header: 'Красноярский край',
          },
          {
            id: 25,
            header: 'Приморский край',
          },
          {
            id: 26,
            header: 'Ставропольский край',
          },
          {
            id: 27,
            header: 'Хабаровский край',
          },
          {
            id: 28,
            header: 'Владимирская область',
          },
          {
            id: 29,
            header: 'Волгоградская область',
          },
          {
            id: 30,
            header: 'Вологодская область',
          },
          {
            id: 31,
            header: 'Воронежская область',
          },
          {
            id: 32,
            header: 'Ивановская область',
          },
          {
            id: 33,
            header: 'Иркутская область',
          },
          {
            id: 34,
            header: 'Калининградская область',
          },
          {
            id: 35,
            header: 'Калужская область',
          },
          {
            id: 36,
            header: 'Камчатская область',
          },
          {
            id: 37,
            header: 'Кемеровская область',
          },
          {
            id: 38,
            header: 'Пензенская область',
          },
          {
            id: 39,
            header: 'Псковская область',
          },
          {
            id: 40,
            header: 'Ростовская область',
          },
          {
            id: 41,
            header: 'Рязанская область',
          },
          {
            id: 42,
            header: 'Самарская область',
          },
          {
            id: 43,
            header: 'Саратовская область',
          },
          {
            id: 44,
            header: 'Сахалинская область',
          },
          {
            id: 45,
            header: 'Кировская область',
          },
          {
            id: 46,
            header: 'Костромская область',
          },
          {
            id: 47,
            header: 'Курганская область',
          },
          {
            id: 48,
            header: 'Курская область',
          },
          {
            id: 49,
            header: 'Ленинградская область',
          },
          {
            id: 50,
            header: 'Липецкая область',
          },
          {
            id: 51,
            header: 'Магаданская область',
          },
          {
            id: 52,
            header: 'Московская область',
          },
          {
            id: 53,
            header: 'Мурманская область',
          },
          {
            id: 54,
            header: 'Нижегородская область',
          },
          {
            id: 55,
            header: 'Новгородская область',
          },
          {
            id: 56,
            header: 'Новосибирская область',
          },
          {
            id: 57,
            header: 'Омская область',
          },
          {
            id: 58,
            header: 'Оренбургская область',
          },
          {
            id: 59,
            header: 'Орловская область',
          },
          {
            id: 60,
            header: 'Свердловская область',
          },
          {
            id: 61,
            header: 'Смоленская область',
          },
          {
            id: 62,
            header: 'Тамбовская область',
          },
          {
            id: 63,
            header: 'Тверская область',
          },
          {
            id: 64,
            header: 'Томская область',
          },
          {
            id: 65,
            header: 'Тульская область',
          },
          {
            id: 66,
            header: 'Тюменская область',
          },
          {
            id: 67,
            header: 'Ульяновская область',
          },
          {
            id: 68,
            header: 'Челябинская область',
          },
          {
            id: 69,
            header: 'Читинская область',
          },
          {
            id: 70,
            header: 'Ярославская область',
          },
          {
            id: 71,
            header: 'г. Москва',
          },
          {
            id: 72,
            header: 'г. Санкт-Петербург',
          },
          {
            id: 73,
            header: 'Еврейская автономная область',
          },
          {
            id: 74,
            header: 'Агинский Бурятский автономный округ',
          },
          {
            id: 75,
            header: 'Корякский автономный округ',
          },
          {
            id: 76,
            header: 'Ненецкий автономный округ',
          },
          {
            id: 77,
            header: 'Таймырский',
          },
          {
            id: 78,
            header: 'Усть-Ордынский Бурятский АО',
          },
          {
            id: 79,
            header: 'Ханты-Мансийский АО',
          },
          {
            id: 80,
            header: 'Амурская область',
          },
          {
            id: 81,
            header: 'Архангельская область',
          },
          {
            id: 82,
            header: 'Астраханская область',
          },
          {
            id: 83,
            header: 'Белгородская область',
          },
          {
            id: 84,
            header: 'Брянская область',
          },
          {
            id: 85,
            header: 'Чукотский автономный округ',
          },
          {
            id: 86,
            header: 'Эвенкийский автономный округ',
          },
          {
            id: 87,
            header: 'Ямало-Ненецкий автономный округ',
          },
        ]}
      />
    </div>
  )
}