---

📦 Установка

``bash
yarn add @alfalab/hooks
`

🔨 Использование

`jsx
import { usePrevious } from '@alfalab/hooks';
`

Состав

$3

Подписка на событие mousedown, touchstart. При нажатии вне элемента вызывает переданный callback

$3

Хук обратного отсчёта времени. Возвращает оставшееся количество секунд до определённой даты.

$3

Вызывает коллбэк при изменении значений, переданных в зависимостях.
В отличии от useEffect — пропускает начальный рендер (аналог ComponentDidUpdate).

$3

Хук для измерения DOM-элемента, в том числе в live-режиме

$3

https://github.com/facebook/react/issues/14099#issuecomment-440013892

$3

Подписка на событие focusin, focusout для конкретного события фокуса (клавиатура/мышка).
Возвращает true/false о состоянии фокуса на элементе или на одном из его дочерних элементов

$3

Возвращает результат загрузки изображения — loading | loaded | error

$3

Подписка на событие keydown. При нажатии вне элемента вызывает переданный callback

$3

Возвращает значение, которое соответствует сработавшему медиа-выражению

`
const [columns] = useMedia([
[1, '(min-width: 400px)'],
[2, '(min-width: 600px)'],
[3, '(min-width: 900px)'],
], 1);
`

$3

Возвращает предыдущее состояние из useState

`jsx
function Counter() {
const [count, setCount] = useState(0);
const prevCount = usePrevious(count);
return (



Сейчас: {count}, до этого: {prevCount}



);
}
``

$3

Возвращает коллбек для принудительного ререндера компонента

$3

Возвращает статус доступности компонента

$3

Возвращает уникальный идентификатор

$3

Хук для layout-эффекта с фоллбэком к обычному эффекту для сред, где layout-эффекты не должны использоваться (например, рендеринг на стороне сервера).