React-компонент с TypeScript

Генерирует типизированный React-компонент с обработкой состояний и доступностью.

СреднийПромпты для кода

Текст промпта

prompt
Создай React-компонент "{название_компонента}" на TypeScript.

Назначение: {назначение: форма / таблица / модальное окно / карточка / фильтр / навигация}
UI-библиотека: {UI: none (чистый CSS) / Tailwind CSS / shadcn/ui / MUI / Ant Design}
State management: {стейт: useState / useReducer / Zustand / Redux Toolkit / "не нужен"}

Props (входные параметры):
{пропсы: "items: Item[], onSelect: (id: string) => void, isLoading: boolean, className?: string"}

Требования:
- Строгая типизация: interface для props, отдельные type для внутренних данных
- Декомпозиция: если компонент больше 100 строк — разбей на подкомпоненты
- Мемоизация: useMemo / useCallback где уместно (объясни почему)
- Доступность (a11y): aria-атрибуты, keyboard navigation, focus management
- Обработка состояний: loading, error, empty state, success
- Responsive: адаптив для mobile / tablet / desktop

Дополнительно:
- Storybook story или пример использования
- Кастомный хук если логика переиспользуема
- Обработка edge cases: пустой массив, null значения, длинные строки

Вариации

Вариации этого промпта для других AI-инструментов скоро появятся.

Похожие промпты

Загрузка похожих промптов...