From d187b5f9ddfb2c029cc87e976c83769ddb98f1ee Mon Sep 17 00:00:00 2001 From: ngorin Date: Tue, 3 Oct 2023 17:20:07 +0300 Subject: [PATCH 1/5] fix: refactor hooks: useBodyScrollLock, usePortalContainer, useVirtualElementRef --- src/components/Modal/Modal.tsx | 2 +- .../Popup/__stories__/Popup.stories.tsx | 2 +- src/components/Portal/Portal.tsx | 2 +- src/components/Portal/index.ts | 1 + src/components/index.ts | 4 ---- src/hooks/index.ts | 3 +++ src/hooks/useBodyScrollLock/README.md | 17 +++++++++++++ src/hooks/useBodyScrollLock/index.ts | 2 ++ .../useBodyScrollLock}/useBodyScrollLock.ts | 4 ++-- .../usePortalContainer}/PortalProvider.tsx | 0 src/hooks/usePortalContainer/README.md | 17 +++++++++++++ src/hooks/usePortalContainer/index.ts | 3 +++ .../usePortalContainer}/usePortalContainer.ts | 4 +++- src/hooks/useVirtualElementRef/README.md | 24 +++++++++++++++++++ src/hooks/useVirtualElementRef/index.ts | 6 +++++ .../useVirtualElementRef.ts | 6 +++-- 16 files changed, 85 insertions(+), 12 deletions(-) create mode 100644 src/hooks/useBodyScrollLock/README.md create mode 100644 src/hooks/useBodyScrollLock/index.ts rename src/{components/utils => hooks/useBodyScrollLock}/useBodyScrollLock.ts (93%) rename src/{components/utils => hooks/usePortalContainer}/PortalProvider.tsx (100%) create mode 100644 src/hooks/usePortalContainer/README.md create mode 100644 src/hooks/usePortalContainer/index.ts rename src/{components/utils => hooks/usePortalContainer}/usePortalContainer.ts (69%) create mode 100644 src/hooks/useVirtualElementRef/README.md create mode 100644 src/hooks/useVirtualElementRef/index.ts rename src/{components/utils => hooks/useVirtualElementRef}/useVirtualElementRef.ts (89%) diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx index f490b4a86c..1ced9e296a 100644 --- a/src/components/Modal/Modal.tsx +++ b/src/components/Modal/Modal.tsx @@ -2,12 +2,12 @@ import React from 'react'; import {CSSTransition} from 'react-transition-group'; +import {useBodyScrollLock} from '../../hooks/useBodyScrollLock'; import {Portal} from '../Portal'; import type {DOMProps, QAProps} from '../types'; import {FocusTrap} from '../utils/FocusTrap'; import {block} from '../utils/cn'; import {getCSSTransitionClassNames} from '../utils/transition'; -import {useBodyScrollLock} from '../utils/useBodyScrollLock'; import {useLayer} from '../utils/useLayer'; import type {LayerCloseReason, LayerExtendableProps} from '../utils/useLayer'; import {useRestoreFocus} from '../utils/useRestoreFocus'; diff --git a/src/components/Popup/__stories__/Popup.stories.tsx b/src/components/Popup/__stories__/Popup.stories.tsx index 6a7348b8f7..cd2e6c6ae7 100644 --- a/src/components/Popup/__stories__/Popup.stories.tsx +++ b/src/components/Popup/__stories__/Popup.stories.tsx @@ -2,9 +2,9 @@ import React from 'react'; import type {Meta, StoryFn} from '@storybook/react'; +import {useVirtualElementRef} from '../../../hooks/useVirtualElementRef'; import {Button} from '../../Button'; import {TextInput} from '../../controls'; -import {useVirtualElementRef} from '../../utils/useVirtualElementRef'; import {Popup} from '../Popup'; import type {PopupPlacement, PopupProps} from '../Popup'; diff --git a/src/components/Portal/Portal.tsx b/src/components/Portal/Portal.tsx index 3da43f5622..1e6588548f 100644 --- a/src/components/Portal/Portal.tsx +++ b/src/components/Portal/Portal.tsx @@ -2,7 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import {usePortalContainer} from '../utils/usePortalContainer'; +import {usePortalContainer} from '../../hooks/usePortalContainer/usePortalContainer'; export interface PortalProps { container?: HTMLElement; diff --git a/src/components/Portal/index.ts b/src/components/Portal/index.ts index 73d42c80c4..1fa7cdec53 100644 --- a/src/components/Portal/index.ts +++ b/src/components/Portal/index.ts @@ -1 +1,2 @@ export * from './Portal'; +export * from '../../hooks/usePortalContainer/PortalProvider'; diff --git a/src/components/index.ts b/src/components/index.ts index 3b820c3d7a..af7bcfca2e 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -51,13 +51,9 @@ export * from './utils/class-transform'; export * from './utils/event-broker'; export {getComponentName} from './utils/getComponentName'; export * from './utils/withEventBrokerDomHandlers'; -export * from './utils/useBodyScrollLock'; export * from './utils/useEventBroker'; export * from './utils/useLayer'; -export * from './utils/useVirtualElementRef'; export {Lang, configure} from './utils/configure'; -export * from './utils/PortalProvider'; -export * from './utils/usePortalContainer'; export * from './utils/useSelect'; export * from './utils/useListNavigation'; export * from './utils/useForkRef'; diff --git a/src/hooks/index.ts b/src/hooks/index.ts index bcd5297292..c2f62a9d45 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -1 +1,4 @@ export * from './useOutsideClick'; +export * from './useBodyScrollLock'; +export * from './useVirtualElementRef'; +export * from './usePortalContainer'; diff --git a/src/hooks/useBodyScrollLock/README.md b/src/hooks/useBodyScrollLock/README.md new file mode 100644 index 0000000000..fbd0b0a033 --- /dev/null +++ b/src/hooks/useBodyScrollLock/README.md @@ -0,0 +1,17 @@ + + +# useBodyScrollLock + + + +```tsx +import {useBodyScrollLock} from '@gravity-ui/uikit'; +``` + +The `useBodyScrollLock` hook helps to blocks scrolling on the body element. + +## Properties + +| Name | Description | Type | Default | +| :------ | :---------- | :-------: | :-----: | +| enabled | Enable flag | `boolean` | | diff --git a/src/hooks/useBodyScrollLock/index.ts b/src/hooks/useBodyScrollLock/index.ts new file mode 100644 index 0000000000..de319276c0 --- /dev/null +++ b/src/hooks/useBodyScrollLock/index.ts @@ -0,0 +1,2 @@ +export {useBodyScrollLock} from './useBodyScrollLock'; +export type {UseBodyScrollLockProps} from './useBodyScrollLock'; diff --git a/src/components/utils/useBodyScrollLock.ts b/src/hooks/useBodyScrollLock/useBodyScrollLock.ts similarity index 93% rename from src/components/utils/useBodyScrollLock.ts rename to src/hooks/useBodyScrollLock/useBodyScrollLock.ts index 3d47b0fc53..c50f5229b6 100644 --- a/src/components/utils/useBodyScrollLock.ts +++ b/src/hooks/useBodyScrollLock/useBodyScrollLock.ts @@ -1,13 +1,13 @@ import React from 'react'; -export interface BodyScrollLockProps { +export interface UseBodyScrollLockProps { enabled: boolean; } let locks = 0; let storedBodyStyle: string | undefined; -export function useBodyScrollLock({enabled}: BodyScrollLockProps) { +export function useBodyScrollLock({enabled}: UseBodyScrollLockProps) { React.useLayoutEffect(() => { if (enabled) { locks++; diff --git a/src/components/utils/PortalProvider.tsx b/src/hooks/usePortalContainer/PortalProvider.tsx similarity index 100% rename from src/components/utils/PortalProvider.tsx rename to src/hooks/usePortalContainer/PortalProvider.tsx diff --git a/src/hooks/usePortalContainer/README.md b/src/hooks/usePortalContainer/README.md new file mode 100644 index 0000000000..45207cb319 --- /dev/null +++ b/src/hooks/usePortalContainer/README.md @@ -0,0 +1,17 @@ + + +# usePortalContainer + + + +```tsx +import {usePortalContainer} from '@gravity-ui/uikit'; +``` + +The `usePortalContainer` hook helps to create portal container + +## Return + +| Name | Description | Type | +| :-------- | :--------------------------- | :------------------: | +| container | Container element for portal | `HTMLElement - null` | diff --git a/src/hooks/usePortalContainer/index.ts b/src/hooks/usePortalContainer/index.ts new file mode 100644 index 0000000000..a152b18a94 --- /dev/null +++ b/src/hooks/usePortalContainer/index.ts @@ -0,0 +1,3 @@ +export {usePortalContainer} from './usePortalContainer'; +export {PortalProvider} from './PortalProvider'; +export type {UsePortalContainerReturnType} from './usePortalContainer'; diff --git a/src/components/utils/usePortalContainer.ts b/src/hooks/usePortalContainer/usePortalContainer.ts similarity index 69% rename from src/components/utils/usePortalContainer.ts rename to src/hooks/usePortalContainer/usePortalContainer.ts index 392a81b82f..d05b08303b 100644 --- a/src/components/utils/usePortalContainer.ts +++ b/src/hooks/usePortalContainer/usePortalContainer.ts @@ -2,7 +2,9 @@ import React from 'react'; import {PortalContext} from './PortalProvider'; -export function usePortalContainer(): HTMLElement | null { +export type UsePortalContainerReturnType = HTMLElement | null; + +export function usePortalContainer(): UsePortalContainerReturnType { const context = React.useContext(PortalContext); let defaultContainer = null; diff --git a/src/hooks/useVirtualElementRef/README.md b/src/hooks/useVirtualElementRef/README.md new file mode 100644 index 0000000000..4ed780d9f8 --- /dev/null +++ b/src/hooks/useVirtualElementRef/README.md @@ -0,0 +1,24 @@ + + +# useVirtualElementRef + + + +```tsx +import {useVirtualElementRef} from '@gravity-ui/uikit'; +``` + +The `useVirtualElementRef` hook helps to create virtual element for popup + +## Properties + +| Name | Description | Type | Default | +| :------------- | :-------------------------------------------------- | :----------------------------------------: | :-----: | +| rect | Position of virtual element in relation to viewport | `{top, bottom, left, right}: {[x]:number}` | | +| contextElement | DOM-context of virtual element | `Element` | | + +## Return + +| Name | Description | Type | +| :--- | :----------------------- | :----------------------: | +| ref | Virtual element ref link | `React.MutableRefObject` | diff --git a/src/hooks/useVirtualElementRef/index.ts b/src/hooks/useVirtualElementRef/index.ts new file mode 100644 index 0000000000..5f154ad945 --- /dev/null +++ b/src/hooks/useVirtualElementRef/index.ts @@ -0,0 +1,6 @@ +export {useVirtualElementRef} from './useVirtualElementRef'; +export type { + VirtualElementRect, + UseVirtualElementRefProps, + UseVirtualElementRefReturnType, +} from './useVirtualElementRef'; diff --git a/src/components/utils/useVirtualElementRef.ts b/src/hooks/useVirtualElementRef/useVirtualElementRef.ts similarity index 89% rename from src/components/utils/useVirtualElementRef.ts rename to src/hooks/useVirtualElementRef/useVirtualElementRef.ts index 88ff2d04bf..b3d4a39af9 100644 --- a/src/components/utils/useVirtualElementRef.ts +++ b/src/hooks/useVirtualElementRef/useVirtualElementRef.ts @@ -16,17 +16,19 @@ export interface UseVirtualElementRefProps { rect?: VirtualElementRect | null; /** - * DOM-context of virual element + * DOM-context of virtual element */ contextElement?: Element; } +export type UseVirtualElementRefReturnType = React.MutableRefObject; + const initialPosition = {top: 0, right: 0, bottom: 0, left: 0}; // React hook for creating virtual element for popup export function useVirtualElementRef( props: UseVirtualElementRefProps = {}, -): React.RefObject { +): UseVirtualElementRefReturnType { const {rect, contextElement} = props; const rectRef = React.useRef(initialPosition); From 19d04b775ca35a4a2746a4207af3a4f9409b1af9 Mon Sep 17 00:00:00 2001 From: ngorin Date: Tue, 3 Oct 2023 17:24:11 +0300 Subject: [PATCH 2/5] fix: refactor hooks: del extra export --- src/components/Portal/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Portal/index.ts b/src/components/Portal/index.ts index 1fa7cdec53..73d42c80c4 100644 --- a/src/components/Portal/index.ts +++ b/src/components/Portal/index.ts @@ -1,2 +1 @@ export * from './Portal'; -export * from '../../hooks/usePortalContainer/PortalProvider'; From 9b8c8614294786fe741dd1d4221d2448260aaf19 Mon Sep 17 00:00:00 2001 From: ngorin Date: Wed, 4 Oct 2023 11:18:40 +0300 Subject: [PATCH 3/5] fix: comment review fix --- src/hooks/index.ts | 4 ++-- src/hooks/useBodyScrollLock/index.ts | 2 +- src/hooks/useBodyScrollLock/useBodyScrollLock.ts | 4 ++-- src/hooks/usePortalContainer/README.md | 4 ++-- src/hooks/usePortalContainer/index.ts | 2 +- src/hooks/usePortalContainer/usePortalContainer.ts | 4 ++-- src/hooks/useVirtualElementRef/README.md | 14 +++++++------- src/hooks/useVirtualElementRef/index.ts | 2 +- .../useVirtualElementRef/useVirtualElementRef.ts | 6 +++--- 9 files changed, 21 insertions(+), 21 deletions(-) diff --git a/src/hooks/index.ts b/src/hooks/index.ts index c2f62a9d45..8ce4679d64 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -1,4 +1,4 @@ -export * from './useOutsideClick'; export * from './useBodyScrollLock'; -export * from './useVirtualElementRef'; +export * from './useOutsideClick'; export * from './usePortalContainer'; +export * from './useVirtualElementRef'; diff --git a/src/hooks/useBodyScrollLock/index.ts b/src/hooks/useBodyScrollLock/index.ts index de319276c0..66226dde7f 100644 --- a/src/hooks/useBodyScrollLock/index.ts +++ b/src/hooks/useBodyScrollLock/index.ts @@ -1,2 +1,2 @@ export {useBodyScrollLock} from './useBodyScrollLock'; -export type {UseBodyScrollLockProps} from './useBodyScrollLock'; +export type {BodyScrollLockProps} from './useBodyScrollLock'; diff --git a/src/hooks/useBodyScrollLock/useBodyScrollLock.ts b/src/hooks/useBodyScrollLock/useBodyScrollLock.ts index c50f5229b6..3d47b0fc53 100644 --- a/src/hooks/useBodyScrollLock/useBodyScrollLock.ts +++ b/src/hooks/useBodyScrollLock/useBodyScrollLock.ts @@ -1,13 +1,13 @@ import React from 'react'; -export interface UseBodyScrollLockProps { +export interface BodyScrollLockProps { enabled: boolean; } let locks = 0; let storedBodyStyle: string | undefined; -export function useBodyScrollLock({enabled}: UseBodyScrollLockProps) { +export function useBodyScrollLock({enabled}: BodyScrollLockProps) { React.useLayoutEffect(() => { if (enabled) { locks++; diff --git a/src/hooks/usePortalContainer/README.md b/src/hooks/usePortalContainer/README.md index 45207cb319..71f1f45d2a 100644 --- a/src/hooks/usePortalContainer/README.md +++ b/src/hooks/usePortalContainer/README.md @@ -8,9 +8,9 @@ import {usePortalContainer} from '@gravity-ui/uikit'; ``` -The `usePortalContainer` hook helps to create portal container +The `usePortalContainer` hook returns portal container element in the current scope -## Return +## Result | Name | Description | Type | | :-------- | :--------------------------- | :------------------: | diff --git a/src/hooks/usePortalContainer/index.ts b/src/hooks/usePortalContainer/index.ts index a152b18a94..e768dc2839 100644 --- a/src/hooks/usePortalContainer/index.ts +++ b/src/hooks/usePortalContainer/index.ts @@ -1,3 +1,3 @@ export {usePortalContainer} from './usePortalContainer'; export {PortalProvider} from './PortalProvider'; -export type {UsePortalContainerReturnType} from './usePortalContainer'; +export type {UsePortalContainerResult} from './usePortalContainer'; diff --git a/src/hooks/usePortalContainer/usePortalContainer.ts b/src/hooks/usePortalContainer/usePortalContainer.ts index d05b08303b..e85939edef 100644 --- a/src/hooks/usePortalContainer/usePortalContainer.ts +++ b/src/hooks/usePortalContainer/usePortalContainer.ts @@ -2,9 +2,9 @@ import React from 'react'; import {PortalContext} from './PortalProvider'; -export type UsePortalContainerReturnType = HTMLElement | null; +export type UsePortalContainerResult = HTMLElement | null; -export function usePortalContainer(): UsePortalContainerReturnType { +export function usePortalContainer(): UsePortalContainerResult { const context = React.useContext(PortalContext); let defaultContainer = null; diff --git a/src/hooks/useVirtualElementRef/README.md b/src/hooks/useVirtualElementRef/README.md index 4ed780d9f8..ef30665da4 100644 --- a/src/hooks/useVirtualElementRef/README.md +++ b/src/hooks/useVirtualElementRef/README.md @@ -12,13 +12,13 @@ The `useVirtualElementRef` hook helps to create virtual element for popup ## Properties -| Name | Description | Type | Default | -| :------------- | :-------------------------------------------------- | :----------------------------------------: | :-----: | -| rect | Position of virtual element in relation to viewport | `{top, bottom, left, right}: {[x]:number}` | | -| contextElement | DOM-context of virtual element | `Element` | | +| Name | Description | Type | Default | +| :------------- | :----------------------------------------------- | :----------------------------------------: | :-----: | +| rect | Position of virtual element relative to viewport | `{top, bottom, left, right}: {[x]:number}` | | +| contextElement | DOM-context of virtual element | `Element` | | ## Return -| Name | Description | Type | -| :--- | :----------------------- | :----------------------: | -| ref | Virtual element ref link | `React.MutableRefObject` | +| Name | Description | Type | +| :--- | :----------------------- | :---------------: | +| ref | Virtual element ref link | `React.RefObject` | diff --git a/src/hooks/useVirtualElementRef/index.ts b/src/hooks/useVirtualElementRef/index.ts index 5f154ad945..47af80691d 100644 --- a/src/hooks/useVirtualElementRef/index.ts +++ b/src/hooks/useVirtualElementRef/index.ts @@ -2,5 +2,5 @@ export {useVirtualElementRef} from './useVirtualElementRef'; export type { VirtualElementRect, UseVirtualElementRefProps, - UseVirtualElementRefReturnType, + UseVirtualElementRefResult, } from './useVirtualElementRef'; diff --git a/src/hooks/useVirtualElementRef/useVirtualElementRef.ts b/src/hooks/useVirtualElementRef/useVirtualElementRef.ts index b3d4a39af9..d45af8bdfd 100644 --- a/src/hooks/useVirtualElementRef/useVirtualElementRef.ts +++ b/src/hooks/useVirtualElementRef/useVirtualElementRef.ts @@ -11,7 +11,7 @@ export type VirtualElementRect = { export interface UseVirtualElementRefProps { /** - * Position of virtual element in relation to viewport + * Position of virtual element relative to viewport */ rect?: VirtualElementRect | null; @@ -21,14 +21,14 @@ export interface UseVirtualElementRefProps { contextElement?: Element; } -export type UseVirtualElementRefReturnType = React.MutableRefObject; +export type UseVirtualElementRefResult = React.MutableRefObject; const initialPosition = {top: 0, right: 0, bottom: 0, left: 0}; // React hook for creating virtual element for popup export function useVirtualElementRef( props: UseVirtualElementRefProps = {}, -): UseVirtualElementRefReturnType { +): UseVirtualElementRefResult { const {rect, contextElement} = props; const rectRef = React.useRef(initialPosition); From 8efe6916d0597058e2762b757803cb668d83227e Mon Sep 17 00:00:00 2001 From: ngorin Date: Wed, 4 Oct 2023 12:41:37 +0300 Subject: [PATCH 4/5] fix: refactor readme --- src/components/Modal/Modal.tsx | 2 +- src/components/Popup/__stories__/Popup.stories.tsx | 2 +- src/components/Portal/Portal.tsx | 2 +- .../layout/demo/LayoutPresenter/LayoutPresenter.tsx | 2 +- src/hooks/useBodyScrollLock/index.ts | 2 +- src/hooks/useBodyScrollLock/useBodyScrollLock.ts | 6 ++++-- src/hooks/usePortalContainer/README.md | 4 +--- src/hooks/useVirtualElementRef/README.md | 6 ++---- 8 files changed, 12 insertions(+), 14 deletions(-) diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx index 1ced9e296a..ffd1833a03 100644 --- a/src/components/Modal/Modal.tsx +++ b/src/components/Modal/Modal.tsx @@ -2,7 +2,7 @@ import React from 'react'; import {CSSTransition} from 'react-transition-group'; -import {useBodyScrollLock} from '../../hooks/useBodyScrollLock'; +import {useBodyScrollLock} from '../../hooks'; import {Portal} from '../Portal'; import type {DOMProps, QAProps} from '../types'; import {FocusTrap} from '../utils/FocusTrap'; diff --git a/src/components/Popup/__stories__/Popup.stories.tsx b/src/components/Popup/__stories__/Popup.stories.tsx index cd2e6c6ae7..43f6c49966 100644 --- a/src/components/Popup/__stories__/Popup.stories.tsx +++ b/src/components/Popup/__stories__/Popup.stories.tsx @@ -2,7 +2,7 @@ import React from 'react'; import type {Meta, StoryFn} from '@storybook/react'; -import {useVirtualElementRef} from '../../../hooks/useVirtualElementRef'; +import {useVirtualElementRef} from '../../../hooks'; import {Button} from '../../Button'; import {TextInput} from '../../controls'; import {Popup} from '../Popup'; diff --git a/src/components/Portal/Portal.tsx b/src/components/Portal/Portal.tsx index 1e6588548f..cbc0bdb7ea 100644 --- a/src/components/Portal/Portal.tsx +++ b/src/components/Portal/Portal.tsx @@ -2,7 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import {usePortalContainer} from '../../hooks/usePortalContainer/usePortalContainer'; +import {usePortalContainer} from '../../hooks'; export interface PortalProps { container?: HTMLElement; diff --git a/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx b/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx index 87dc2eaccd..ad675a7502 100644 --- a/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx +++ b/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx @@ -3,7 +3,7 @@ import React from 'react'; import {Text} from '../../../Text'; import {Flex} from '../../Flex/Flex'; import {LayoutProvider} from '../../LayoutProvider/LayoutProvider'; -import {useLayoutContext} from '../../hooks/useLayoutContext'; +import {useLayoutContext} from '../../hooks'; import {sp} from '../../spacing/spacing'; interface LayoutPresenterProps { diff --git a/src/hooks/useBodyScrollLock/index.ts b/src/hooks/useBodyScrollLock/index.ts index 66226dde7f..59656edbbe 100644 --- a/src/hooks/useBodyScrollLock/index.ts +++ b/src/hooks/useBodyScrollLock/index.ts @@ -1,2 +1,2 @@ export {useBodyScrollLock} from './useBodyScrollLock'; -export type {BodyScrollLockProps} from './useBodyScrollLock'; +export type {BodyScrollLockProps, UseBodyScrollLockProps} from './useBodyScrollLock'; diff --git a/src/hooks/useBodyScrollLock/useBodyScrollLock.ts b/src/hooks/useBodyScrollLock/useBodyScrollLock.ts index 3d47b0fc53..56cfdff249 100644 --- a/src/hooks/useBodyScrollLock/useBodyScrollLock.ts +++ b/src/hooks/useBodyScrollLock/useBodyScrollLock.ts @@ -1,13 +1,15 @@ import React from 'react'; -export interface BodyScrollLockProps { +export interface UseBodyScrollLockProps { enabled: boolean; } +export type BodyScrollLockProps = UseBodyScrollLockProps; + let locks = 0; let storedBodyStyle: string | undefined; -export function useBodyScrollLock({enabled}: BodyScrollLockProps) { +export function useBodyScrollLock({enabled}: UseBodyScrollLockProps) { React.useLayoutEffect(() => { if (enabled) { locks++; diff --git a/src/hooks/usePortalContainer/README.md b/src/hooks/usePortalContainer/README.md index 71f1f45d2a..1b1d59e6fe 100644 --- a/src/hooks/usePortalContainer/README.md +++ b/src/hooks/usePortalContainer/README.md @@ -12,6 +12,4 @@ The `usePortalContainer` hook returns portal container element in the current sc ## Result -| Name | Description | Type | -| :-------- | :--------------------------- | :------------------: | -| container | Container element for portal | `HTMLElement - null` | +Container element for portal. `HTMLElement | null` diff --git a/src/hooks/useVirtualElementRef/README.md b/src/hooks/useVirtualElementRef/README.md index ef30665da4..41a01eb7b1 100644 --- a/src/hooks/useVirtualElementRef/README.md +++ b/src/hooks/useVirtualElementRef/README.md @@ -17,8 +17,6 @@ The `useVirtualElementRef` hook helps to create virtual element for popup | rect | Position of virtual element relative to viewport | `{top, bottom, left, right}: {[x]:number}` | | | contextElement | DOM-context of virtual element | `Element` | | -## Return +## Result -| Name | Description | Type | -| :--- | :----------------------- | :---------------: | -| ref | Virtual element ref link | `React.RefObject` | +Virtual element ref link. `React.RefObject` From c240271f51598c6185674e11baa3a65ffc46b284 Mon Sep 17 00:00:00 2001 From: ngorin Date: Wed, 4 Oct 2023 13:47:18 +0300 Subject: [PATCH 5/5] fix: fixed imports --- src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx b/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx index ad675a7502..87dc2eaccd 100644 --- a/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx +++ b/src/components/layout/demo/LayoutPresenter/LayoutPresenter.tsx @@ -3,7 +3,7 @@ import React from 'react'; import {Text} from '../../../Text'; import {Flex} from '../../Flex/Flex'; import {LayoutProvider} from '../../LayoutProvider/LayoutProvider'; -import {useLayoutContext} from '../../hooks'; +import {useLayoutContext} from '../../hooks/useLayoutContext'; import {sp} from '../../spacing/spacing'; interface LayoutPresenterProps {