---
metadata:
  - name: generator
    content: Diplodoc Platform v5.50.6
  - property: og:type
    content: article
  - property: article:section
    content: Платформа плагинов
  - property: og:title
    content: MetaEntitiesSelect
  - property: article:tag
    content: Техническая инструкция
alternate:
  - https://yandex.ru/support/tracker/en/plugins/components/meta-entities-select.md
  - https://yandex.ru/support/tracker/ru/plugins/components/meta-entities-select.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.ru/support/tracker/ru/llms.txt

[← К списку компонентов](https://yandex.ru/support/tracker/ru/plugins/components/index.md)

# MetaEntitiesSelect {#meta-entities-select}

Компонент выбора мета-сущностей Трекера — проекты, портфели, цели, отчеты — на основе саджеста. Отображает каждую сущность с иконкой и именем, поддерживает асинхронную загрузку, состояние загрузки, отображение ошибок и кнопку очистки.

## Базовое использование {#usage}

```tsx
import {MetaEntitiesSelect} from '@weavix/tracker-components';

<MetaEntitiesSelect
    getItems={(text) => fetchProjects(text)}
    onChange={(entity) => console.log('selected', entity)}
/>;
```

## Использование с Tracker API {#tracker-api}

```tsx
import React, {useState} from 'react';
import {MetaEntitiesSelect} from '@weavix/tracker-components';
import type {MetaEntityV2} from '@weavix/tracker-api-types';

interface Props {
    trackerApi: TrackerApi;
    onChange: (entity: MetaEntityV2) => void;
}

export const ProjectSelect: React.FC<Props> = ({trackerApi, onChange}) => {
    const [error, setError] = useState<string | undefined>(undefined);

    const getItems = async (input: string): Promise<MetaEntityV2[]> => {
        setError(undefined);
        try {
            const result = await trackerApi.v3.post['/entities/{entityType}/_search']({
                pathParams: {entityType: 'project'},
                queryParams: {fields: ['summary'], page: 1, perPage: 50},
                bodyParams: {filter: {}, filterTypes: ['ALL'], input},
            });
            return result.data;
        } catch (err) {
            setError(err instanceof Error ? err.message : 'Не удалось загрузить проекты');
            return [];
        }
    };

    return (
        <MetaEntitiesSelect
            getItems={getItems}
            onChange={onChange}
            error={error}
            placeholder="Выберите проект"
        />
    );
};
```

> **Типы сущностей:** параметр `entityType` принимает значения `'portfolio' | 'project' | 'report' | 'goal'`.

## Основные свойства {#props}

#|
|| **Свойство** | **Тип** | **По умолчанию** | **Описание** ||
|| `getItems`
|

```ts
(text: string) =>
  MetaEntityV2[]
  | Promise<MetaEntityV2[]>
```

| — | Функция загрузки элементов. Вызывается при монтировании и при каждом изменении текста ||
|| `onChange`
|

```ts
(entity: MetaEntityV2) =>
  void
```

| — | Колбэк при выборе сущности ||
|| `onTextChange`
|

```ts
(text: string) =>
  void
```

| — | Колбэк при изменении текста в поле ввода ||
|| `text` | `string` | — | Текущее значение поля ввода (управляемый режим) ||
|| `placeholder` | `string` | `'Выберите проект'` | Плейсхолдер при пустом поле ||
|| `error` | `string | boolean` | — | Сообщение об ошибке или флаг ошибки ||
|| `hasClear` | `boolean` | `true` | Показывать кнопку очистки (×) ||
|| `className` | `string` | — | Дополнительный CSS-класс корневого элемента ||
|| `itemClassName` | `string` | — | Дополнительный CSS-класс каждого элемента списка ||
|#
