\n\n\n\n## 📦 Установка\n\n```bash\nyarn add @alfalab/hooks\n```\n\n## 🔨 Использование\n\n```jsx\nimport { usePrevious } from '@alfalab/hooks';\n```\n\n## Состав\n\n### [useClickOutside](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useClickOutside/hook.ts)\n\nПодписка на событие `mousedown`, `touchstart`. При нажатии вне элемента вызывает переданный callback\n\n### [useCountdown](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useCountdown/hook.ts)\n\nХук обратного отсчёта времени. Возвращает оставшееся количество секунд до определённой даты.\n\n### [useDidUpdateEffect](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useDidUpdateEffect/hook.ts)\n\nВызывает коллбэк при изменении значений, переданных в зависимостях.\nВ отличии от useEffect — пропускает начальный рендер (аналог ComponentDidUpdate).\n\n### [useDimensions](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useDimensions/hook.ts)\n\nХук для измерения DOM-элемента, в том числе в live-режиме\n\n### [useEventCallback](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useEventCallback/hook.ts)\n\nhttps://github.com/facebook/react/issues/14099#issuecomment-440013892\n\n### [useFocus](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useFocus/hook.ts)\n\nПодписка на событие `focusin`, `focusout` для конкретного события фокуса (клавиатура/мышка).\nВозвращает true/false о состоянии фокуса на элементе или на одном из его дочерних элементов\n\n### [useImageLoadingState](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useImageLoadingState/hook.ts)\n\nВозвращает результат загрузки изображения — `loading | loaded | error`\n\n### [useKeydownOutside](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useKeydownOutside/hook.ts)\n\nПодписка на событие `keydown`. При нажатии вне элемента вызывает переданный callback\n\n### [useMedia](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useMedia/hook.ts)\n\nВозвращает значение, которое соответствует сработавшему медиа-выражению\n\n```\nconst [columns] = useMedia([\n [1, '(min-width: 400px)'],\n [2, '(min-width: 600px)'],\n [3, '(min-width: 900px)'],\n], 1);\n```\n\n### [usePrevious](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/usePrevious/hook.ts)\n\nВозвращает предыдущее состояние из useState\n\n```jsx\nfunction Counter() {\n const [count, setCount] = useState(0);\n const prevCount = usePrevious(count);\n return (\n
\n Сейчас: {count}, до этого: {prevCount}\n
\n );\n}\n```\n\n### [useForceUpdate](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useForceUpdate/hook.ts)\n\nВозвращает коллбек для принудительного ререндера компонента\n\n\n### [useIsMounted](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useIsMounted/hook.ts)\n\nВозвращает статус доступности компонента\n\n### [useId](https://github.com/alfa-laboratory/utils/blob/master/packages/hooks/src/useId/hook.ts)\n\nВозвращает уникальный идентификатор\n\n### useLayoutEffect_SAFE_FOR_SSR\nХук для layout-эффекта с фоллбэком к обычному эффекту для сред, где layout-эффекты не должны использоваться (например, рендеринг на стороне сервера).\n","readmeFilename":"README.md"}