@vkontakte/vkui 5.9.1 → 5.9.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/ActionSheet/ActionSheet.js +1 -1
- package/dist/cjs/components/ActionSheet/ActionSheet.js.map +1 -1
- package/dist/cjs/components/Alert/Alert.d.ts +3 -3
- package/dist/cjs/components/Alert/Alert.d.ts.map +1 -1
- package/dist/cjs/components/Alert/Alert.js +5 -3
- package/dist/cjs/components/Alert/Alert.js.map +1 -1
- package/dist/cjs/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/dist/cjs/components/CalendarRange/CalendarRange.d.ts.map +1 -1
- package/dist/cjs/components/CalendarRange/CalendarRange.js +1 -2
- package/dist/cjs/components/CalendarRange/CalendarRange.js.map +1 -1
- package/dist/cjs/components/ChipsSelect/ChipsSelect.js +1 -1
- package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
- package/dist/cjs/components/CustomScrollView/CustomScrollView.d.ts +4 -2
- package/dist/cjs/components/CustomScrollView/CustomScrollView.d.ts.map +1 -1
- package/dist/cjs/components/CustomScrollView/CustomScrollView.js +17 -5
- package/dist/cjs/components/CustomScrollView/CustomScrollView.js.map +1 -1
- package/dist/cjs/components/CustomSelect/CustomSelect.d.ts +4 -1
- package/dist/cjs/components/CustomSelect/CustomSelect.d.ts.map +1 -1
- package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cjs/components/FormLayout/FormLayout.d.ts +3 -3
- package/dist/cjs/components/FormLayout/FormLayout.d.ts.map +1 -1
- package/dist/cjs/components/FormLayout/FormLayout.js +5 -2
- package/dist/cjs/components/FormLayout/FormLayout.js.map +1 -1
- package/dist/cjs/components/Gallery/Gallery.d.ts.map +1 -1
- package/dist/cjs/components/Gallery/Gallery.js +3 -10
- package/dist/cjs/components/Gallery/Gallery.js.map +1 -1
- package/dist/cjs/components/Gallery/hooks.d.ts +2 -0
- package/dist/cjs/components/Gallery/hooks.d.ts.map +1 -0
- package/dist/cjs/components/Gallery/hooks.js +52 -0
- package/dist/cjs/components/Gallery/hooks.js.map +1 -0
- package/dist/cjs/components/Header/Header.d.ts +3 -3
- package/dist/cjs/components/Header/Header.d.ts.map +1 -1
- package/dist/cjs/components/Header/Header.js +4 -5
- package/dist/cjs/components/Header/Header.js.map +1 -1
- package/dist/cjs/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
- package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js +4 -0
- package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
- package/dist/cjs/components/ModalPageHeader/ModalPageHeader.d.ts +3 -3
- package/dist/cjs/components/ModalPageHeader/ModalPageHeader.d.ts.map +1 -1
- package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js +5 -2
- package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
- package/dist/cjs/components/ModalRoot/ModalRoot.js +6 -8
- package/dist/cjs/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/cjs/components/PullToRefresh/PullToRefresh.d.ts.map +1 -1
- package/dist/cjs/components/PullToRefresh/PullToRefresh.js +22 -7
- package/dist/cjs/components/PullToRefresh/PullToRefresh.js.map +1 -1
- package/dist/cjs/components/Typography/Caption/Caption.d.ts +2 -0
- package/dist/cjs/components/Typography/Caption/Caption.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Caption/Caption.js.map +1 -1
- package/dist/cjs/components/Typography/Footnote/Footnote.d.ts +2 -0
- package/dist/cjs/components/Typography/Footnote/Footnote.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Footnote/Footnote.js.map +1 -1
- package/dist/cjs/components/Typography/Headline/Headline.d.ts +2 -0
- package/dist/cjs/components/Typography/Headline/Headline.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Headline/Headline.js.map +1 -1
- package/dist/cjs/components/Typography/Paragraph/Paragraph.d.ts +2 -0
- package/dist/cjs/components/Typography/Paragraph/Paragraph.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Paragraph/Paragraph.js.map +1 -1
- package/dist/cjs/components/Typography/Subhead/Subhead.d.ts +2 -0
- package/dist/cjs/components/Typography/Subhead/Subhead.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Subhead/Subhead.js.map +1 -1
- package/dist/cjs/components/Typography/Text/Text.d.ts +2 -0
- package/dist/cjs/components/Typography/Text/Text.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Text/Text.js.map +1 -1
- package/dist/cjs/components/Typography/Title/Title.d.ts +2 -0
- package/dist/cjs/components/Typography/Title/Title.d.ts.map +1 -1
- package/dist/cjs/components/Typography/Title/Title.js.map +1 -1
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +3 -3
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts.map +1 -1
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js +6 -3
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -1
- package/dist/cjs/lib/floating/adapters.d.ts +1 -1
- package/dist/cjs/lib/floating/adapters.d.ts.map +1 -1
- package/dist/cjs/lib/floating/adapters.js +1 -1
- package/dist/cjs/lib/floating/adapters.js.map +1 -1
- package/dist/cjs/lib/floating/index.d.ts +1 -1
- package/dist/cjs/lib/floating/index.d.ts.map +1 -1
- package/dist/cjs/lib/floating/index.js +1 -1
- package/dist/cjs/lib/floating/index.js.map +1 -1
- package/dist/cjs/lib/floating/types.d.ts +2 -2
- package/dist/cjs/lib/floating/types.d.ts.map +1 -1
- package/dist/components/ActionSheet/ActionSheet.js +1 -1
- package/dist/components/ActionSheet/ActionSheet.js.map +1 -1
- package/dist/components/Alert/Alert.d.ts +3 -3
- package/dist/components/Alert/Alert.d.ts.map +1 -1
- package/dist/components/Alert/Alert.js +5 -3
- package/dist/components/Alert/Alert.js.map +1 -1
- package/dist/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/dist/components/CalendarRange/CalendarRange.d.ts.map +1 -1
- package/dist/components/CalendarRange/CalendarRange.js +1 -2
- package/dist/components/CalendarRange/CalendarRange.js.map +1 -1
- package/dist/components/ChipsSelect/ChipsSelect.js +1 -1
- package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
- package/dist/components/CustomScrollView/CustomScrollView.d.ts +4 -2
- package/dist/components/CustomScrollView/CustomScrollView.d.ts.map +1 -1
- package/dist/components/CustomScrollView/CustomScrollView.js +17 -5
- package/dist/components/CustomScrollView/CustomScrollView.js.map +1 -1
- package/dist/components/CustomSelect/CustomSelect.d.ts +4 -1
- package/dist/components/CustomSelect/CustomSelect.d.ts.map +1 -1
- package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/components/FormLayout/FormLayout.d.ts +3 -3
- package/dist/components/FormLayout/FormLayout.d.ts.map +1 -1
- package/dist/components/FormLayout/FormLayout.js +5 -2
- package/dist/components/FormLayout/FormLayout.js.map +1 -1
- package/dist/components/Gallery/Gallery.d.ts.map +1 -1
- package/dist/components/Gallery/Gallery.js +3 -10
- package/dist/components/Gallery/Gallery.js.map +1 -1
- package/dist/components/Gallery/hooks.d.ts +2 -0
- package/dist/components/Gallery/hooks.d.ts.map +1 -0
- package/dist/components/Gallery/hooks.js +41 -0
- package/dist/components/Gallery/hooks.js.map +1 -0
- package/dist/components/Header/Header.d.ts +3 -3
- package/dist/components/Header/Header.d.ts.map +1 -1
- package/dist/components/Header/Header.js +4 -5
- package/dist/components/Header/Header.js.map +1 -1
- package/dist/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
- package/dist/components/HorizontalScroll/HorizontalScroll.js +4 -0
- package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
- package/dist/components/ModalPageHeader/ModalPageHeader.d.ts +3 -3
- package/dist/components/ModalPageHeader/ModalPageHeader.d.ts.map +1 -1
- package/dist/components/ModalPageHeader/ModalPageHeader.js +5 -2
- package/dist/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
- package/dist/components/ModalRoot/ModalRoot.js +6 -8
- package/dist/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/components/PullToRefresh/PullToRefresh.d.ts.map +1 -1
- package/dist/components/PullToRefresh/PullToRefresh.js +22 -7
- package/dist/components/PullToRefresh/PullToRefresh.js.map +1 -1
- package/dist/components/Typography/Caption/Caption.d.ts +2 -0
- package/dist/components/Typography/Caption/Caption.d.ts.map +1 -1
- package/dist/components/Typography/Caption/Caption.js +2 -0
- package/dist/components/Typography/Caption/Caption.js.map +1 -1
- package/dist/components/Typography/Footnote/Footnote.d.ts +2 -0
- package/dist/components/Typography/Footnote/Footnote.d.ts.map +1 -1
- package/dist/components/Typography/Footnote/Footnote.js +2 -0
- package/dist/components/Typography/Footnote/Footnote.js.map +1 -1
- package/dist/components/Typography/Headline/Headline.d.ts +2 -0
- package/dist/components/Typography/Headline/Headline.d.ts.map +1 -1
- package/dist/components/Typography/Headline/Headline.js +2 -0
- package/dist/components/Typography/Headline/Headline.js.map +1 -1
- package/dist/components/Typography/Paragraph/Paragraph.d.ts +2 -0
- package/dist/components/Typography/Paragraph/Paragraph.d.ts.map +1 -1
- package/dist/components/Typography/Paragraph/Paragraph.js +2 -0
- package/dist/components/Typography/Paragraph/Paragraph.js.map +1 -1
- package/dist/components/Typography/Subhead/Subhead.d.ts +2 -0
- package/dist/components/Typography/Subhead/Subhead.d.ts.map +1 -1
- package/dist/components/Typography/Subhead/Subhead.js +2 -0
- package/dist/components/Typography/Subhead/Subhead.js.map +1 -1
- package/dist/components/Typography/Text/Text.d.ts +2 -0
- package/dist/components/Typography/Text/Text.d.ts.map +1 -1
- package/dist/components/Typography/Text/Text.js +2 -0
- package/dist/components/Typography/Text/Text.js.map +1 -1
- package/dist/components/Typography/Title/Title.d.ts +2 -0
- package/dist/components/Typography/Title/Title.d.ts.map +1 -1
- package/dist/components/Typography/Title/Title.js +2 -0
- package/dist/components/Typography/Title/Title.js.map +1 -1
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +3 -3
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts.map +1 -1
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js +6 -3
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -1
- package/dist/components.css +6 -6
- package/dist/components.css.map +1 -1
- package/dist/components.js.tmp +3783 -2492
- package/dist/cssm/components/ActionSheet/ActionSheet.js +1 -1
- package/dist/cssm/components/ActionSheet/ActionSheet.js.map +1 -1
- package/dist/cssm/components/Alert/Alert.d.ts +3 -3
- package/dist/cssm/components/Alert/Alert.d.ts.map +1 -1
- package/dist/cssm/components/Alert/Alert.js +3 -2
- package/dist/cssm/components/Alert/Alert.js.map +1 -1
- package/dist/cssm/components/Alert/Alert.module.css +5 -0
- package/dist/cssm/components/Button/Button.module.css +3 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.d.ts.map +1 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.js +1 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.js.map +1 -1
- package/dist/cssm/components/ChipsSelect/ChipsSelect.js +1 -1
- package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
- package/dist/cssm/components/CustomScrollView/CustomScrollView.d.ts +4 -2
- package/dist/cssm/components/CustomScrollView/CustomScrollView.d.ts.map +1 -1
- package/dist/cssm/components/CustomScrollView/CustomScrollView.js +4 -2
- package/dist/cssm/components/CustomScrollView/CustomScrollView.js.map +1 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +4 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.d.ts.map +1 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cssm/components/CustomSelectOption/CustomSelectOption.module.css +0 -5
- package/dist/cssm/components/FormLayout/FormLayout.d.ts +3 -3
- package/dist/cssm/components/FormLayout/FormLayout.d.ts.map +1 -1
- package/dist/cssm/components/FormLayout/FormLayout.js +4 -2
- package/dist/cssm/components/FormLayout/FormLayout.js.map +1 -1
- package/dist/cssm/components/Gallery/Gallery.d.ts.map +1 -1
- package/dist/cssm/components/Gallery/Gallery.js +2 -7
- package/dist/cssm/components/Gallery/Gallery.js.map +1 -1
- package/dist/cssm/components/Gallery/hooks.d.ts +2 -0
- package/dist/cssm/components/Gallery/hooks.d.ts.map +1 -0
- package/dist/cssm/components/Gallery/hooks.js +39 -0
- package/dist/cssm/components/Gallery/hooks.js.map +1 -0
- package/dist/cssm/components/Header/Header.d.ts +3 -3
- package/dist/cssm/components/Header/Header.d.ts.map +1 -1
- package/dist/cssm/components/Header/Header.js +2 -3
- package/dist/cssm/components/Header/Header.js.map +1 -1
- package/dist/cssm/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
- package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +4 -0
- package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
- package/dist/cssm/components/ModalPage/ModalPage.module.css +1 -4
- package/dist/cssm/components/ModalPageHeader/ModalPageHeader.d.ts +3 -3
- package/dist/cssm/components/ModalPageHeader/ModalPageHeader.d.ts.map +1 -1
- package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js +4 -2
- package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
- package/dist/cssm/components/ModalRoot/ModalRoot.js +6 -8
- package/dist/cssm/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.module.css +7 -1
- package/dist/cssm/components/PullToRefresh/PullToRefresh.d.ts.map +1 -1
- package/dist/cssm/components/PullToRefresh/PullToRefresh.js +22 -7
- package/dist/cssm/components/PullToRefresh/PullToRefresh.js.map +1 -1
- package/dist/cssm/components/Snackbar/Snackbar.module.css +1 -1
- package/dist/cssm/components/Typography/Caption/Caption.d.ts +2 -0
- package/dist/cssm/components/Typography/Caption/Caption.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Caption/Caption.js +2 -0
- package/dist/cssm/components/Typography/Caption/Caption.js.map +1 -1
- package/dist/cssm/components/Typography/Footnote/Footnote.d.ts +2 -0
- package/dist/cssm/components/Typography/Footnote/Footnote.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Footnote/Footnote.js +2 -0
- package/dist/cssm/components/Typography/Footnote/Footnote.js.map +1 -1
- package/dist/cssm/components/Typography/Headline/Headline.d.ts +2 -0
- package/dist/cssm/components/Typography/Headline/Headline.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Headline/Headline.js +2 -0
- package/dist/cssm/components/Typography/Headline/Headline.js.map +1 -1
- package/dist/cssm/components/Typography/Paragraph/Paragraph.d.ts +2 -0
- package/dist/cssm/components/Typography/Paragraph/Paragraph.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Paragraph/Paragraph.js +2 -0
- package/dist/cssm/components/Typography/Paragraph/Paragraph.js.map +1 -1
- package/dist/cssm/components/Typography/Subhead/Subhead.d.ts +2 -0
- package/dist/cssm/components/Typography/Subhead/Subhead.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Subhead/Subhead.js +2 -0
- package/dist/cssm/components/Typography/Subhead/Subhead.js.map +1 -1
- package/dist/cssm/components/Typography/Text/Text.d.ts +2 -0
- package/dist/cssm/components/Typography/Text/Text.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Text/Text.js +2 -0
- package/dist/cssm/components/Typography/Text/Text.js.map +1 -1
- package/dist/cssm/components/Typography/Title/Title.d.ts +2 -0
- package/dist/cssm/components/Typography/Title/Title.d.ts.map +1 -1
- package/dist/cssm/components/Typography/Title/Title.js +2 -0
- package/dist/cssm/components/Typography/Title/Title.js.map +1 -1
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +3 -3
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts.map +1 -1
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js +4 -2
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -1
- package/dist/cssm/lib/floating/adapters.d.ts +1 -1
- package/dist/cssm/lib/floating/adapters.d.ts.map +1 -1
- package/dist/cssm/lib/floating/adapters.js +1 -1
- package/dist/cssm/lib/floating/adapters.js.map +1 -1
- package/dist/cssm/lib/floating/index.d.ts +1 -1
- package/dist/cssm/lib/floating/index.d.ts.map +1 -1
- package/dist/cssm/lib/floating/index.js +1 -1
- package/dist/cssm/lib/floating/index.js.map +1 -1
- package/dist/cssm/lib/floating/types.d.ts +2 -2
- package/dist/cssm/lib/floating/types.d.ts.map +1 -1
- package/dist/cssm/lib/floating/types.js.map +1 -1
- package/dist/lib/floating/adapters.d.ts +1 -1
- package/dist/lib/floating/adapters.d.ts.map +1 -1
- package/dist/lib/floating/adapters.js +1 -1
- package/dist/lib/floating/adapters.js.map +1 -1
- package/dist/lib/floating/index.d.ts +1 -1
- package/dist/lib/floating/index.d.ts.map +1 -1
- package/dist/lib/floating/index.js +1 -1
- package/dist/lib/floating/index.js.map +1 -1
- package/dist/lib/floating/types.d.ts +2 -2
- package/dist/lib/floating/types.d.ts.map +1 -1
- package/dist/lib/floating/types.js.map +1 -1
- package/dist/vkui.css +6 -6
- package/dist/vkui.css.map +1 -1
- package/dist/vkui.js.tmp +3783 -2492
- package/package.json +2 -2
- package/src/components/ActionSheet/ActionSheet.tsx +2 -2
- package/src/components/Alert/Alert.module.css +5 -0
- package/src/components/Alert/Alert.tsx +10 -3
- package/src/components/Button/Button.module.css +3 -1
- package/src/components/CalendarRange/CalendarRange.tsx +0 -1
- package/src/components/ChipsSelect/ChipsSelect.tsx +1 -1
- package/src/components/CustomScrollView/CustomScrollView.tsx +13 -2
- package/src/components/CustomSelect/CustomSelect.tsx +5 -1
- package/src/components/CustomSelectOption/CustomSelectOption.module.css +0 -5
- package/src/components/FormLayout/FormLayout.tsx +8 -3
- package/src/components/Gallery/Gallery.tsx +2 -6
- package/src/components/Gallery/hooks.ts +39 -0
- package/src/components/Header/Header.tsx +3 -3
- package/src/components/HorizontalScroll/HorizontalScroll.tsx +4 -0
- package/src/components/ModalPage/ModalPage.module.css +1 -4
- package/src/components/ModalPageHeader/ModalPageHeader.tsx +8 -4
- package/src/components/ModalRoot/ModalRoot.tsx +6 -5
- package/src/components/PanelHeaderButton/PanelHeaderButton.module.css +6 -1
- package/src/components/PullToRefresh/PullToRefresh.tsx +28 -9
- package/src/components/Snackbar/Snackbar.module.css +1 -1
- package/src/components/Typography/Caption/Caption.tsx +2 -0
- package/src/components/Typography/Footnote/Footnote.tsx +2 -0
- package/src/components/Typography/Headline/Headline.tsx +2 -0
- package/src/components/Typography/Paragraph/Paragraph.tsx +2 -0
- package/src/components/Typography/Subhead/Subhead.tsx +2 -0
- package/src/components/Typography/Text/Text.tsx +2 -0
- package/src/components/Typography/Title/Title.tsx +2 -0
- package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.tsx +6 -2
- package/src/lib/floating/adapters.ts +1 -1
- package/src/lib/floating/index.ts +1 -1
- package/src/lib/floating/types.ts +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n scrollElement: HTMLElement | null;\n scrollAnimationDuration: number;\n animationQueue: VoidFunction[];\n getScrollPosition: (currentPosition: number) => number;\n onScrollToEndBorder: VoidFunction;\n onScrollEnd: VoidFunction;\n onScrollStart: VoidFunction;\n /**\n * Начальная ширина прокрутки.\n * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n */\n initialScrollWidth: number;\n textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n extends HTMLAttributesWithRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n /**\n * Функция для расчета величины прокрутки при клике на левую стрелку.\n */\n getScrollToLeft?: ScrollPositionHandler;\n /**\n * Функция для расчета величины прокрутки при клике на правую стрелку.\n */\n getScrollToRight?: ScrollPositionHandler;\n arrowSize?: 'm' | 'l';\n /**\n * Смещает иконки кнопок навигации по вертикали.\n */\n arrowOffsetY?: number | string;\n showArrows?: boolean | 'always';\n scrollAnimationDuration?: number;\n /**\n * Добавляет возможность прокручивать контент на любое колесо мыши.\n * По умолчанию прокручивается как любой горизонтальный контент через shift.\n */\n scrollOnAnyWheel?: boolean;\n}\n\n/**\n * timing method\n */\nfunction now() {\n return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue,\n onScrollToEndBorder,\n onScrollEnd,\n onScrollStart,\n initialScrollWidth,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n textDirection,\n}: ScrollContext) {\n if (!scrollElement || !getScrollPosition) {\n return;\n }\n\n /**\n * крайнее значение сдвига\n */\n const extremeScrollLeft =\n (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n let endScrollLeft = getScrollPosition(startScrollLeft);\n\n onScrollStart();\n\n /**\n * Если окончание прокрутки вышло за ноль\n */\n if (startScrollLeft * endScrollLeft < 0) {\n endScrollLeft = 0;\n }\n\n if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n onScrollToEndBorder();\n endScrollLeft = extremeScrollLeft;\n }\n\n const startTime = now();\n\n (function scroll() {\n if (!scrollElement) {\n onScrollEnd();\n return;\n }\n\n const time = now();\n const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n const value = easeInOutSine(elapsed);\n\n const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n const scrollEnd =\n textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && elapsed !== 1) {\n requestAnimationFrame(scroll);\n return;\n }\n\n onScrollEnd();\n animationQueue.shift();\n if (animationQueue.length > 0) {\n animationQueue[0]();\n }\n })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n children,\n getScrollToLeft,\n getScrollToRight,\n showArrows = true,\n arrowSize = 'l',\n arrowOffsetY,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n getRef,\n scrollOnAnyWheel = false,\n ...restProps\n}: HorizontalScrollProps) => {\n const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n const [canScrollRight, setCanScrollRight] = React.useState(false);\n const [directionRef, textDirection = 'ltr'] = useDirection<HTMLDivElement>();\n\n const setCanScrollStart = textDirection === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n const setCanScrollEnd = textDirection === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n const isCustomScrollingRef = React.useRef(false);\n\n const scrollerRef = useExternRef(getRef, directionRef);\n\n const animationQueue = React.useRef<VoidFunction[]>([]);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const scrollTo = React.useCallback(\n (getScrollPosition: ScrollPositionHandler) => {\n const scrollElement = scrollerRef.current;\n\n animationQueue.current.push(() =>\n doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue: animationQueue.current,\n onScrollToEndBorder: () => setCanScrollEnd(false),\n onScrollEnd: () => (isCustomScrollingRef.current = false),\n onScrollStart: () => (isCustomScrollingRef.current = true),\n initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n scrollAnimationDuration,\n textDirection,\n }),\n );\n if (animationQueue.current.length === 1) {\n animationQueue.current[0]();\n }\n },\n [scrollerRef, scrollAnimationDuration, textDirection, setCanScrollEnd],\n );\n\n const scrollToLeft = React.useCallback(() => {\n const getScrollPosition =\n getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n const scrollToRight = React.useCallback(() => {\n const getScrollPosition =\n getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToRight, scrollTo, scrollerRef]);\n\n const calculateArrowsVisibility = React.useCallback(() => {\n if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n const scrollElement = scrollerRef.current;\n\n setCanScrollStart(scrollElement.scrollLeft !== 0);\n setCanScrollEnd(\n Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n scrollElement.scrollWidth,\n );\n }\n }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n const scrollEvent = useEventListener('scroll', calculateArrowsVisibility);\n React.useEffect(\n function addScrollerRefToScrollEvent() {\n if (!scrollerRef.current) {\n return noop;\n }\n\n scrollEvent.add(scrollerRef.current);\n return scrollEvent.remove;\n },\n [scrollEvent, scrollerRef],\n );\n\n React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n /**\n * Прокрутка с помощью любого колеса мыши\n */\n const onwheel = React.useCallback(\n (e: WheelEvent) => {\n scrollerRef.current!.scrollBy({ left: e.deltaX + e.deltaY, behavior: 'auto' });\n e.preventDefault();\n },\n [scrollerRef],\n );\n\n const wheelEvent = useEventListener('wheel', onwheel);\n React.useEffect(\n function addScrollerRefToWheelEvent() {\n if (!scrollerRef.current || !scrollOnAnyWheel) {\n return noop;\n }\n\n wheelEvent.add(scrollerRef.current);\n\n return wheelEvent.remove;\n },\n [wheelEvent, scrollerRef, scrollOnAnyWheel],\n );\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['HorizontalScroll'],\n 'vkuiInternalHorizontalScroll',\n showArrows === 'always' && styles['HorizontalScroll--withConstArrows'],\n )}\n onMouseEnter={calculateArrowsVisibility}\n >\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n <ScrollArrow\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"left\"\n className={classNames(\n styles['HorizontalScroll__arrow'],\n styles['HorizontalScroll__arrowLeft'],\n )}\n onClick={scrollToLeft}\n />\n )}\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n <ScrollArrow\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"right\"\n className={classNames(\n styles['HorizontalScroll__arrow'],\n styles['HorizontalScroll__arrowRight'],\n )}\n onClick={scrollToRight}\n />\n )}\n <div className={styles['HorizontalScroll__in']} ref={scrollerRef}>\n <div className={styles['HorizontalScroll__in-wrapper']}>{children}</div>\n </div>\n </RootComponent>\n );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useEventListener","useExternRef","easeInOutSine","RootComponent","ScrollArrow","styles","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","scrollEvent","useEffect","addScrollerRefToScrollEvent","add","remove","onwheel","e","scrollBy","left","deltaX","deltaY","behavior","preventDefault","wheelEvent","addScrollerRefToWheelEvent","baseClassName","onMouseEnter","undefined","size","offsetY","direction","className","onClick","div","ref"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n scrollElement: HTMLElement | null;\n scrollAnimationDuration: number;\n animationQueue: VoidFunction[];\n getScrollPosition: (currentPosition: number) => number;\n onScrollToEndBorder: VoidFunction;\n onScrollEnd: VoidFunction;\n onScrollStart: VoidFunction;\n /**\n * Начальная ширина прокрутки.\n * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n */\n initialScrollWidth: number;\n textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n extends HTMLAttributesWithRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n /**\n * Функция для расчета величины прокрутки при клике на левую стрелку.\n */\n getScrollToLeft?: ScrollPositionHandler;\n /**\n * Функция для расчета величины прокрутки при клике на правую стрелку.\n */\n getScrollToRight?: ScrollPositionHandler;\n arrowSize?: 'm' | 'l';\n /**\n * Смещает иконки кнопок навигации по вертикали.\n */\n arrowOffsetY?: number | string;\n showArrows?: boolean | 'always';\n scrollAnimationDuration?: number;\n /**\n * Добавляет возможность прокручивать контент на любое колесо мыши.\n * По умолчанию прокручивается как любой горизонтальный контент через shift.\n */\n scrollOnAnyWheel?: boolean;\n}\n\n/**\n * timing method\n */\nfunction now() {\n return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue,\n onScrollToEndBorder,\n onScrollEnd,\n onScrollStart,\n initialScrollWidth,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n textDirection,\n}: ScrollContext) {\n if (!scrollElement || !getScrollPosition) {\n return;\n }\n\n /**\n * крайнее значение сдвига\n */\n const extremeScrollLeft =\n (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n let endScrollLeft = getScrollPosition(startScrollLeft);\n\n onScrollStart();\n\n /**\n * Если окончание прокрутки вышло за ноль\n */\n if (startScrollLeft * endScrollLeft < 0) {\n endScrollLeft = 0;\n }\n\n if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n onScrollToEndBorder();\n endScrollLeft = extremeScrollLeft;\n }\n\n const startTime = now();\n\n (function scroll() {\n if (!scrollElement) {\n onScrollEnd();\n return;\n }\n\n const time = now();\n const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n const value = easeInOutSine(elapsed);\n\n const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n const scrollEnd =\n textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && elapsed !== 1) {\n requestAnimationFrame(scroll);\n return;\n }\n\n onScrollEnd();\n animationQueue.shift();\n if (animationQueue.length > 0) {\n animationQueue[0]();\n }\n })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n children,\n getScrollToLeft,\n getScrollToRight,\n showArrows = true,\n arrowSize = 'l',\n arrowOffsetY,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n getRef,\n scrollOnAnyWheel = false,\n ...restProps\n}: HorizontalScrollProps) => {\n const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n const [canScrollRight, setCanScrollRight] = React.useState(false);\n const [directionRef, textDirection = 'ltr'] = useDirection<HTMLDivElement>();\n\n const setCanScrollStart = textDirection === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n const setCanScrollEnd = textDirection === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n const isCustomScrollingRef = React.useRef(false);\n\n const scrollerRef = useExternRef(getRef, directionRef);\n\n const animationQueue = React.useRef<VoidFunction[]>([]);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const scrollTo = React.useCallback(\n (getScrollPosition: ScrollPositionHandler) => {\n const scrollElement = scrollerRef.current;\n\n animationQueue.current.push(() =>\n doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue: animationQueue.current,\n onScrollToEndBorder: () => setCanScrollEnd(false),\n onScrollEnd: () => (isCustomScrollingRef.current = false),\n onScrollStart: () => (isCustomScrollingRef.current = true),\n initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n scrollAnimationDuration,\n textDirection,\n }),\n );\n if (animationQueue.current.length === 1) {\n animationQueue.current[0]();\n }\n },\n [scrollerRef, scrollAnimationDuration, textDirection, setCanScrollEnd],\n );\n\n const scrollToLeft = React.useCallback(() => {\n const getScrollPosition =\n getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n const scrollToRight = React.useCallback(() => {\n const getScrollPosition =\n getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToRight, scrollTo, scrollerRef]);\n\n const calculateArrowsVisibility = React.useCallback(() => {\n if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n const scrollElement = scrollerRef.current;\n\n setCanScrollStart(scrollElement.scrollLeft !== 0);\n setCanScrollEnd(\n Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n scrollElement.scrollWidth,\n );\n }\n }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n const scrollEvent = useEventListener('scroll', calculateArrowsVisibility);\n React.useEffect(\n function addScrollerRefToScrollEvent() {\n if (!scrollerRef.current) {\n return noop;\n }\n\n scrollEvent.add(scrollerRef.current);\n return scrollEvent.remove;\n },\n [scrollEvent, scrollerRef],\n );\n\n React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n /**\n * Прокрутка с помощью любого колеса мыши\n */\n const onwheel = React.useCallback(\n (e: WheelEvent) => {\n scrollerRef.current!.scrollBy({ left: e.deltaX + e.deltaY, behavior: 'auto' });\n e.preventDefault();\n },\n [scrollerRef],\n );\n\n const wheelEvent = useEventListener('wheel', onwheel);\n React.useEffect(\n function addScrollerRefToWheelEvent() {\n if (!scrollerRef.current || !scrollOnAnyWheel) {\n return noop;\n }\n\n wheelEvent.add(scrollerRef.current);\n\n return wheelEvent.remove;\n },\n [wheelEvent, scrollerRef, scrollOnAnyWheel],\n );\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['HorizontalScroll'],\n 'vkuiInternalHorizontalScroll',\n showArrows === 'always' && styles['HorizontalScroll--withConstArrows'],\n )}\n onMouseEnter={calculateArrowsVisibility}\n >\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n <ScrollArrow\n data-testid={process.env.NODE_ENV === 'test' ? 'ScrollArrow' : undefined}\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"left\"\n aria-hidden\n className={classNames(\n styles['HorizontalScroll__arrow'],\n styles['HorizontalScroll__arrowLeft'],\n )}\n onClick={scrollToLeft}\n />\n )}\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n <ScrollArrow\n data-testid={process.env.NODE_ENV === 'test' ? 'ScrollArrow' : undefined}\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"right\"\n aria-hidden\n className={classNames(\n styles['HorizontalScroll__arrow'],\n styles['HorizontalScroll__arrowRight'],\n )}\n onClick={scrollToRight}\n />\n )}\n <div className={styles['HorizontalScroll__in']} ref={scrollerRef}>\n <div className={styles['HorizontalScroll__in-wrapper']}>{children}</div>\n </div>\n </RootComponent>\n );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useEventListener","useExternRef","easeInOutSine","RootComponent","ScrollArrow","styles","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","scrollEvent","useEffect","addScrollerRefToScrollEvent","add","remove","onwheel","e","scrollBy","left","deltaX","deltaY","behavior","preventDefault","wheelEvent","addScrollerRefToWheelEvent","baseClassName","onMouseEnter","undefined","data-testid","process","env","NODE_ENV","size","offsetY","direction","aria-hidden","className","onClick","div","ref"],"mappings":"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"}
|
|
@@ -116,10 +116,7 @@
|
|
|
116
116
|
}
|
|
117
117
|
|
|
118
118
|
.ModalPage--desktop .ModalPage__content-in,
|
|
119
|
-
:global(.vkuiInternalModalRoot__modal--expandable)
|
|
120
|
-
:global(.vkuiInternalModalRoot__modal--collapsed)
|
|
121
|
-
)
|
|
122
|
-
.ModalPage__content-in {
|
|
119
|
+
:global(.vkuiInternalModalRoot__modal--expandable) .ModalPage__content-in {
|
|
123
120
|
height: 100%;
|
|
124
121
|
}
|
|
125
122
|
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { HasRef } from '../../types';
|
|
2
|
+
import { HasRef, HasRootRef } from '../../types';
|
|
3
3
|
import { PanelHeaderProps } from '../PanelHeader/PanelHeader';
|
|
4
|
-
export interface ModalPageHeaderProps extends React.HTMLAttributes<HTMLDivElement>, Omit<PanelHeaderProps, 'fixed' | 'shadow'>, HasRef<HTMLDivElement> {
|
|
4
|
+
export interface ModalPageHeaderProps extends React.HTMLAttributes<HTMLDivElement>, Omit<PanelHeaderProps, 'fixed' | 'shadow'>, HasRef<HTMLDivElement>, HasRootRef<HTMLDivElement> {
|
|
5
5
|
}
|
|
6
6
|
/**
|
|
7
7
|
* @see https://vkcom.github.io/VKUI/#/ModalPageHeader
|
|
8
8
|
*/
|
|
9
|
-
export declare const ModalPageHeader: ({ children, separator, getRef, className, typographyProps, ...restProps }: ModalPageHeaderProps) => React.JSX.Element;
|
|
9
|
+
export declare const ModalPageHeader: ({ children, separator, getRef, getRootRef, className, typographyProps, ...restProps }: ModalPageHeaderProps) => React.JSX.Element;
|
|
10
10
|
//# sourceMappingURL=ModalPageHeader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalPageHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ModalPageHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAAe,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAI3E,MAAM,WAAW,oBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,QAAQ,CAAC,EAC1C,MAAM,CAAC,cAAc,CAAC,EACtB,UAAU,CAAC,cAAc,CAAC;CAAG;AAEjC;;GAEG;AACH,eAAO,MAAM,eAAe,0FAQzB,oBAAoB,sBAiCtB,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { classNames } from '@vkontakte/vkjs';
|
|
3
3
|
import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
|
|
4
|
+
import { useExternRef } from '../../hooks/useExternRef';
|
|
4
5
|
import { usePlatform } from '../../hooks/usePlatform';
|
|
5
6
|
import { Platform } from '../../lib/platform';
|
|
6
7
|
import { ModalPageContext } from '../ModalPage/ModalPageContext';
|
|
@@ -9,14 +10,15 @@ import { Separator } from '../Separator/Separator';
|
|
|
9
10
|
import styles from './ModalPageHeader.module.css';
|
|
10
11
|
/**
|
|
11
12
|
* @see https://vkcom.github.io/VKUI/#/ModalPageHeader
|
|
12
|
-
*/ export const ModalPageHeader = ({ children, separator = true, getRef, className, typographyProps, ...restProps })=>{
|
|
13
|
+
*/ export const ModalPageHeader = ({ children, separator = true, getRef, getRootRef, className, typographyProps, ...restProps })=>{
|
|
13
14
|
const platform = usePlatform();
|
|
14
15
|
const hasSeparator = separator && platform === Platform.VKCOM;
|
|
15
16
|
const { isDesktop } = useAdaptivityWithJSMediaQueries();
|
|
16
17
|
const { labelId } = React.useContext(ModalPageContext);
|
|
18
|
+
const modalPageHeaderRef = useExternRef(getRef, getRootRef);
|
|
17
19
|
return /*#__PURE__*/ React.createElement("div", {
|
|
18
20
|
className: classNames(styles['ModalPageHeader'], platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'], isDesktop && styles['ModalPageHeader--desktop']),
|
|
19
|
-
ref:
|
|
21
|
+
ref: modalPageHeaderRef
|
|
20
22
|
}, /*#__PURE__*/ React.createElement(PanelHeader, {
|
|
21
23
|
className: classNames('vkuiInternalModalPageHeader__in', className),
|
|
22
24
|
typographyProps: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { ModalPageContext } from '../ModalPage/ModalPageContext';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n Omit<PanelHeaderProps, 'fixed' | 'shadow'>,\n HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n children,\n separator = true,\n getRef,\n className,\n typographyProps,\n ...restProps\n}: ModalPageHeaderProps) => {\n const platform = usePlatform();\n const hasSeparator = separator && platform === Platform.VKCOM;\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n const { labelId } = React.useContext(ModalPageContext);\n\n return (\n <div\n className={classNames(\n styles['ModalPageHeader'],\n platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n isDesktop && styles['ModalPageHeader--desktop'],\n )}\n ref={
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { ModalPageContext } from '../ModalPage/ModalPageContext';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n Omit<PanelHeaderProps, 'fixed' | 'shadow'>,\n HasRef<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n children,\n separator = true,\n getRef, // TODO [>=6]: remove\n getRootRef,\n className,\n typographyProps,\n ...restProps\n}: ModalPageHeaderProps) => {\n const platform = usePlatform();\n const hasSeparator = separator && platform === Platform.VKCOM;\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n const { labelId } = React.useContext(ModalPageContext);\n const modalPageHeaderRef = useExternRef(getRef, getRootRef);\n\n return (\n <div\n className={classNames(\n styles['ModalPageHeader'],\n platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n isDesktop && styles['ModalPageHeader--desktop'],\n )}\n ref={modalPageHeaderRef}\n >\n <PanelHeader\n className={classNames('vkuiInternalModalPageHeader__in', className)}\n typographyProps={{\n Component: 'h2',\n id: labelId,\n ...typographyProps,\n }}\n {...restProps}\n fixed={false}\n separator={false}\n transparent\n >\n {children}\n </PanelHeader>\n {hasSeparator && <Separator wide />}\n </div>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useExternRef","usePlatform","Platform","ModalPageContext","PanelHeader","Separator","styles","ModalPageHeader","children","separator","getRef","getRootRef","className","typographyProps","restProps","platform","hasSeparator","VKCOM","isDesktop","labelId","useContext","modalPageHeaderRef","div","ref","Component","id","fixed","transparent","wide"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,SAAS,QAAQ,yBAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAQlD;;CAEC,GACD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,QAAQ,EACRC,YAAY,IAAI,EAChBC,MAAM,EACNC,UAAU,EACVC,SAAS,EACTC,eAAe,EACf,GAAGC,WACkB;IACrB,MAAMC,WAAWd;IACjB,MAAMe,eAAeP,aAAaM,aAAab,SAASe,KAAK;IAC7D,MAAM,EAAEC,SAAS,EAAE,GAAGnB;IACtB,MAAM,EAAEoB,OAAO,EAAE,GAAGtB,MAAMuB,UAAU,CAACjB;IACrC,MAAMkB,qBAAqBrB,aAAaU,QAAQC;IAEhD,qBACE,oBAACW;QACCV,WAAWd,WACTQ,MAAM,CAAC,kBAAkB,EACzBS,aAAab,SAASe,KAAK,IAAIX,MAAM,CAAC,4BAA4B,EAClEY,aAAaZ,MAAM,CAAC,2BAA2B;QAEjDiB,KAAKF;qBAEL,oBAACjB;QACCQ,WAAWd,WAAW,mCAAmCc;QACzDC,iBAAiB;YACfW,WAAW;YACXC,IAAIN;YACJ,GAAGN,eAAe;QACpB;QACC,GAAGC,SAAS;QACbY,OAAO;QACPjB,WAAW;QACXkB,aAAAA;OAECnB,WAEFQ,8BAAgB,oBAACX;QAAUuB,MAAAA;;AAGlC,EAAE"}
|
|
@@ -331,7 +331,7 @@ class ModalRootTouchComponent extends React.Component {
|
|
|
331
331
|
}
|
|
332
332
|
modalState.translateY = translateY;
|
|
333
333
|
modalState.translateYCurrent = translateY;
|
|
334
|
-
modalState.collapsed = translateY
|
|
334
|
+
modalState.collapsed = numberInRange(translateY, modalState.collapsedRange);
|
|
335
335
|
modalState.expanded = translateY === 0;
|
|
336
336
|
modalState.hidden = translateY === 100;
|
|
337
337
|
if (modalState.hidden) {
|
|
@@ -512,6 +512,7 @@ function initPageModal(modalState) {
|
|
|
512
512
|
let expandedRange;
|
|
513
513
|
let collapsedRange;
|
|
514
514
|
let hiddenRange;
|
|
515
|
+
const hasCollapsedState = Boolean(modalState.expandable && modalState.settlingHeight !== 100);
|
|
515
516
|
if (modalState.expandable) {
|
|
516
517
|
translateYFrom = 100 - (modalState.settlingHeight ?? 0);
|
|
517
518
|
const shiftHalf = translateYFrom / 2;
|
|
@@ -520,15 +521,15 @@ function initPageModal(modalState) {
|
|
|
520
521
|
0,
|
|
521
522
|
shiftHalf
|
|
522
523
|
];
|
|
523
|
-
collapsedRange = [
|
|
524
|
+
collapsedRange = hasCollapsedState ? [
|
|
524
525
|
shiftHalf,
|
|
525
526
|
translateYFrom + visiblePart / 4
|
|
526
|
-
];
|
|
527
|
+
] : undefined;
|
|
527
528
|
hiddenRange = [
|
|
528
529
|
translateYFrom + visiblePart / 4,
|
|
529
530
|
100
|
|
530
531
|
];
|
|
531
|
-
collapsed = translateYFrom > 0;
|
|
532
|
+
collapsed = hasCollapsedState && translateYFrom > 0;
|
|
532
533
|
expanded = translateYFrom <= 0;
|
|
533
534
|
translateY = translateYFrom;
|
|
534
535
|
} else {
|
|
@@ -540,10 +541,7 @@ function initPageModal(modalState) {
|
|
|
540
541
|
translateY,
|
|
541
542
|
translateY + 25
|
|
542
543
|
];
|
|
543
|
-
collapsedRange =
|
|
544
|
-
translateY + 25,
|
|
545
|
-
translateY + 25
|
|
546
|
-
];
|
|
544
|
+
collapsedRange = undefined;
|
|
547
545
|
hiddenRange = [
|
|
548
546
|
translateY + 25,
|
|
549
547
|
translateY + 100
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { withContext } from '../../hoc/withContext';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { DOMProps, withDOM } from '../../lib/dom';\nimport { getNavId } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { setTransformStyle } from '../../lib/styles';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { rubber } from '../../lib/touch';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { ModalRootContext, ModalRootContextInterface } from './ModalRootContext';\nimport { MODAL_PAGE_DEFAULT_PERCENT_HEIGHT } from './constants';\nimport { ModalRootWithDOMProps, ModalsStateEntry, ModalType, TranslateRange } from './types';\nimport { ModalTransitionProps, withModalManager } from './useModalManager';\nimport styles from './ModalRoot.module.css';\n\nconst warn = warnOnce('ModalRoot');\n\nfunction numberInRange(number: number, range: TranslateRange | undefined) {\n if (!range) {\n return false;\n }\n return number >= range[0] && number <= range[1];\n}\n\nfunction rangeTranslate(number: number) {\n return clamp(number, 0, 98);\n}\n\ninterface ModalRootState {\n touchDown?: boolean;\n dragging?: boolean;\n modalOpenedLog: string[];\n}\n\nclass ModalRootTouchComponent extends React.Component<\n ModalRootWithDOMProps & DOMProps & ModalTransitionProps,\n ModalRootState\n> {\n constructor(props: ModalRootWithDOMProps & ModalTransitionProps) {\n super(props);\n this.state = {\n touchDown: false,\n dragging: false,\n modalOpenedLog: [],\n };\n\n this.maskElementRef = React.createRef();\n\n this.modalRootContext = {\n updateModalHeight: this.updateModalHeight,\n registerModal: ({ id, ...data }) => Object.assign(this.props.getModalState(id) ?? {}, data),\n onClose: () => this.props.onExit(),\n isInsideModal: true,\n };\n\n this.frameIds = {};\n }\n\n private documentScrolling = false;\n private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n private readonly viewportRef = React.createRef<HTMLDivElement>();\n private maskAnimationFrame: number | undefined = undefined;\n private readonly modalRootContext: ModalRootContextInterface;\n private readonly frameIds: {\n [index: string]: number;\n };\n private restoreFocusTo: HTMLElement | undefined | null = undefined;\n\n get timeout(): number {\n return this.props.platform === Platform.IOS ? 400 : 320;\n }\n\n get document(): Document {\n return this.props.document as Document;\n }\n\n get window(): Window {\n return this.props.window as Window;\n }\n\n getModals() {\n return React.Children.toArray(this.props.children) as React.ReactElement[];\n }\n\n componentDidMount() {\n // Отслеживаем изменение размеров viewport\n this.window?.addEventListener('resize', this.updateModalHeight, false);\n }\n\n componentWillUnmount() {\n this.toggleDocumentScrolling(true);\n this.window.removeEventListener('resize', this.updateModalHeight, false);\n }\n\n componentDidUpdate(prevProps: ModalRootWithDOMProps & ModalTransitionProps) {\n // transition phase 2: animate exiting modal\n if (this.props.exitingModal && this.props.exitingModal !== prevProps.exitingModal) {\n this.closeModal(this.props.exitingModal);\n }\n\n // transition phase 3: animate entering modal\n if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {\n const { enteringModal } = this.props;\n const enteringState = this.props.getModalState(enteringModal);\n this.props.onEnter();\n this.waitTransitionFinish(enteringState, () => {\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = '';\n }\n this.props.onEntered(enteringModal);\n });\n\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = this.props.delayEnter\n ? `${this.timeout}ms`\n : '';\n this.animateTranslate(enteringState, enteringState.translateY);\n this.setMaskOpacity(enteringState, 1);\n }\n }\n\n // focus restoration\n if (this.props.activeModal && !prevProps.activeModal) {\n this.restoreFocusTo = this.document.activeElement as HTMLElement;\n }\n if (!this.props.activeModal && !this.props.exitingModal && this.restoreFocusTo) {\n this.restoreFocusTo.focus();\n this.restoreFocusTo = null;\n }\n\n this.toggleDocumentScrolling(!this.props.activeModal && !this.props.exitingModal);\n }\n\n /* Отключает скролл документа */\n toggleDocumentScrolling(enabled: boolean) {\n if (this.documentScrolling === enabled) {\n return;\n }\n this.documentScrolling = enabled;\n\n if (enabled) {\n // Здесь нужен последний аргумент с такими же параметрами, потому что\n // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.\n // https://github.com/VKCOM/VKUI/issues/444\n this.window.removeEventListener('touchmove', this.preventTouch, {\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions нет поля passive\n passive: false,\n });\n } else {\n this.window.addEventListener('touchmove', this.preventTouch, {\n passive: false,\n });\n }\n }\n\n preventTouch = (event: any) => {\n if (!event) {\n return false;\n }\n while (event.originalEvent) {\n event = event.originalEvent;\n }\n if (event.preventDefault) {\n event.preventDefault();\n }\n return false;\n };\n\n checkPageContentHeight() {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {\n const prevModalState = { ...modalState };\n initPageModal(modalState);\n const currentModalState = { ...modalState };\n\n let needAnimate = false;\n\n if (prevModalState.expandable === currentModalState.expandable) {\n if (prevModalState.translateYFrom !== currentModalState.translateYFrom) {\n needAnimate = true;\n }\n } else {\n needAnimate = true;\n }\n\n if (needAnimate) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n }\n }\n\n updateModalHeight = () => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState && modalState.type === ModalType.PAGE) {\n if (this.props.enteringModal) {\n this.waitTransitionFinish(modalState, () => {\n requestAnimationFrame(() => this.checkPageContentHeight());\n });\n } else {\n requestAnimationFrame(() => this.checkPageContentHeight());\n }\n }\n };\n\n closeModal(id: string) {\n // Сбрасываем состояния, которые могут помешать закрытию модального окна\n this.setState({ touchDown: false });\n\n const prevModalState = this.props.getModalState(id);\n\n if (!prevModalState) {\n id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');\n return;\n }\n if (!this.state.modalOpenedLog.length) {\n this.setState((prevState) => ({\n modalOpenedLog: [...prevState.modalOpenedLog, id],\n }));\n }\n const nextModalState = this.props.getModalState(this.props.activeModal);\n const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;\n\n const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;\n this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n const exitTranslate =\n prevIsPage &&\n nextIsPage &&\n (prevModalState.translateY ?? 0) <= (nextModalState?.translateYFrom ?? 0) &&\n !this.props.isBack\n ? (nextModalState?.translateYFrom ?? 0) + 10\n : 100;\n this.animateTranslate(prevModalState, exitTranslate);\n\n if (!nextModalState) {\n // NOTE: was only for clean exit\n this.setMaskOpacity(prevModalState, 0);\n this.setState({ modalOpenedLog: [] });\n prevModalState.translateY = undefined;\n } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {\n nextModalState.translateY = undefined;\n this.setState((prevState) => ({\n modalOpenedLog: [...prevState.modalOpenedLog, nextModalState.id!],\n }));\n }\n }\n\n onTouchMove = (e: TouchEvent) => {\n if (this.props.exitingModal) {\n return;\n }\n const modalState = this.props.getModalState(this.props.activeModal);\n if (!modalState) {\n return;\n }\n\n if (modalState.type === ModalType.PAGE) {\n return this.onPageTouchMove(e, modalState);\n }\n\n if (modalState.type === ModalType.CARD) {\n return this.onCardTouchMove(e, modalState);\n }\n };\n\n onPageTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { shiftY, originalEvent } = event;\n const target = originalEvent.target as HTMLElement;\n\n if (!event.isY) {\n if (this.viewportRef.current?.contains(target)) {\n originalEvent.preventDefault();\n }\n return;\n }\n\n if (!modalState.innerElement?.contains(target)) {\n return originalEvent.preventDefault();\n }\n\n originalEvent.stopPropagation();\n\n const { expandable, contentScrolled, collapsed, expanded } = modalState;\n\n if (!this.state.touchDown) {\n modalState.touchStartContentScrollTop = modalState.contentElement?.scrollTop ?? 0;\n this.setState({ touchDown: true });\n }\n\n if (contentScrolled) {\n return;\n }\n\n if (modalState.touchMovePositive === null) {\n modalState.touchMovePositive = shiftY > 0;\n }\n\n if (\n !modalState.expandable ||\n collapsed ||\n (expanded && modalState.touchMovePositive && modalState.touchStartContentScrollTop === 0) ||\n modalState.headerElement?.contains(target)\n ) {\n originalEvent.preventDefault();\n\n if ((!expandable && shiftY < 0) || !this.window) {\n return;\n }\n\n !this.state.dragging && this.setState({ dragging: true });\n\n const shiftYPercent = (shiftY / this.window.innerHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 0.8, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = rangeTranslate((modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onCardTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { originalEvent, shiftY } = event;\n const target = originalEvent.target as HTMLElement;\n if (modalState.innerElement?.contains(target)) {\n if (!this.state.touchDown) {\n this.setState({ touchDown: true, dragging: true });\n }\n\n const shiftYPercent = (shiftY / modalState.innerElement.offsetHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 1.2, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = Math.max(0, (modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onTouchEnd = (e: TouchEvent) => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE) {\n return this.onPageTouchEnd(e, modalState);\n }\n\n if (modalState?.type === ModalType.CARD) {\n return this.onCardTouchEnd(e, modalState);\n }\n };\n\n onPageTouchEnd(event: TouchEvent, modalState: ModalsStateEntry) {\n const { startY, shiftY } = event;\n\n modalState.contentScrolled = false;\n modalState.touchMovePositive = null;\n\n let setStateCallback;\n\n if (this.state.dragging && this.window) {\n const shiftYEndPercent = ((startY + shiftY) / this.window.innerHeight) * 100;\n\n let translateY = modalState.translateYCurrent ?? 0;\n const expectTranslateY =\n (translateY / event.duration) *\n 240 *\n 0.6 *\n ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = rangeTranslate(translateY + expectTranslateY);\n\n if (modalState.settlingHeight !== 100) {\n if (numberInRange(translateY, modalState.expandedRange)) {\n translateY = modalState.expandedRange?.[0] ?? 0;\n } else if (numberInRange(translateY, modalState.collapsedRange)) {\n translateY = modalState.translateYFrom ?? 0;\n } else if (numberInRange(translateY, modalState.hiddenRange)) {\n translateY = 100;\n } else {\n translateY = modalState.translateYFrom ?? 0;\n }\n } else {\n if (numberInRange(translateY, [0, 25])) {\n translateY = 0;\n } else {\n translateY = 100;\n }\n }\n\n if (translateY !== 100 && shiftYEndPercent >= 75) {\n translateY = 100;\n }\n\n modalState.translateY = translateY;\n modalState.translateYCurrent = translateY;\n modalState.collapsed = translateY > 0 && translateY < shiftYEndPercent;\n modalState.expanded = translateY === 0;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onCardTouchEnd({ duration }: TouchEvent, modalState: ModalsStateEntry) {\n let setStateCallback;\n\n if (this.state.dragging) {\n let translateY = modalState.translateYCurrent ?? 0;\n\n const expectTranslateY =\n (translateY / duration) * 240 * 0.6 * ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = Math.max(0, translateY + expectTranslateY);\n\n if (translateY >= 30) {\n translateY = 100;\n } else {\n translateY = 0;\n }\n\n modalState.translateY = translateY;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onScroll = (e: React.SyntheticEvent) => {\n const activeModal = this.props.activeModal;\n\n const target = e.target as HTMLElement;\n\n if (!activeModal) {\n return;\n }\n const modalState = this.props.getModalState(activeModal);\n if (modalState?.type === ModalType.PAGE && modalState?.contentElement?.contains(target)) {\n modalState.contentScrolled = true;\n\n if (modalState.contentScrollStopTimeout) {\n clearTimeout(modalState.contentScrollStopTimeout);\n }\n\n modalState.contentScrollStopTimeout = setTimeout(() => {\n if (modalState.contentScrolled) {\n modalState.contentScrolled = false;\n }\n }, 250);\n }\n };\n\n waitTransitionFinish(modalState: ModalsStateEntry | undefined, eventHandler: () => void) {\n if (transitionEvent.supported) {\n const onceHandler = () => {\n modalState?.innerElement?.removeEventListener(transitionEvent.name as string, onceHandler);\n eventHandler();\n };\n\n modalState?.innerElement?.addEventListener(transitionEvent.name as string, onceHandler);\n } else {\n setTimeout(eventHandler, this.timeout);\n }\n }\n\n /**\n * Анимирует сдвиг модалки\n *\n * @param {ModalsStateEntry} modalState\n * @param {number} percent Процент сдвига: 0 – полностью открыта, 100 – полностью закрыта\n */\n animateTranslate(modalState: ModalsStateEntry, percent: number | undefined) {\n const frameId = `animateTranslateFrame${modalState.id}`;\n\n cancelAnimationFrame(this.frameIds[frameId]);\n\n this.frameIds[frameId] = requestAnimationFrame(() => {\n setTransformStyle(modalState.innerElement, `translate3d(0, ${percent}%, 0)`);\n });\n }\n\n /* Устанавливает прозрачность для полупрозрачной подложки */\n setMaskOpacity(modalState: ModalsStateEntry, forceOpacity: number | null = null) {\n if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n return;\n }\n if (this.maskAnimationFrame) {\n cancelAnimationFrame(this.maskAnimationFrame);\n }\n this.maskAnimationFrame = requestAnimationFrame(() => {\n if (this.maskElementRef.current) {\n const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n const opacity =\n forceOpacity === null\n ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0\n : forceOpacity;\n this.maskElementRef.current.style.opacity = clamp(opacity, 0, 100).toString();\n this.maskElementRef.current.style.transitionDelay =\n opacity && this.props.delayEnter ? `${this.timeout}ms` : '';\n }\n });\n }\n\n render() {\n const { activeModal, exitingModal, enteringModal } = this.props;\n const { touchDown, dragging } = this.state;\n\n if (!activeModal && !exitingModal) {\n return null;\n }\n\n return (\n <TouchRootContext.Provider value={true}>\n <ModalRootContext.Provider value={this.modalRootContext}>\n <Touch\n className={classNames(\n styles['ModalRoot'],\n this.props.configProvider?.hasCustomPanelHeaderAfter &&\n styles['ModalRoot--hasCustomPanelHeaderAfterSlot'],\n touchDown &&\n classNames(styles['ModalRoot--touched'], 'vkuiInternalModalRoot--touched'),\n !!(enteringModal || exitingModal) &&\n classNames(styles['ModalRoot--switching'], 'vkuiInternalModalRoot--switching'),\n )}\n onMove={this.onTouchMove}\n onEnd={this.onTouchEnd}\n onScroll={this.onScroll}\n >\n <div\n className={styles['ModalRoot__mask']}\n onClick={this.props.onExit}\n ref={this.maskElementRef}\n />\n <div className={styles['ModalRoot__viewport']} ref={this.viewportRef}>\n {this.getModals().map((Modal) => {\n const modalId = getNavId(Modal.props, warn);\n const _modalState = this.props.getModalState(modalId);\n if ((modalId !== activeModal && modalId !== exitingModal) || !_modalState) {\n return null;\n }\n const modalState = { ..._modalState };\n\n const isPage = modalState.type === ModalType.PAGE;\n const key = `modal-${modalId}`;\n\n return (\n <FocusTrap\n key={key}\n getRootRef={(e) => {\n const modalState = this.props.getModalState(modalId);\n if (modalState) {\n modalState.modalElement = e;\n }\n }}\n onClose={this.props.onExit}\n timeout={this.timeout}\n className={classNames(\n styles['ModalRoot__modal'],\n\n dragging && 'vkuiInternalModalRoot__modal--dragging',\n\n isPage && modalState.expandable && 'vkuiInternalModalRoot__modal--expandable',\n isPage && modalState.collapsed && 'vkuiInternalModalRoot__modal--collapsed',\n )}\n restoreFocus={false}\n >\n {Modal}\n </FocusTrap>\n );\n })}\n </div>\n </Touch>\n </ModalRootContext.Provider>\n </TouchRootContext.Provider>\n );\n }\n}\n\nexport const ModalRootTouch = withContext(\n withPlatform(\n withDOM<ModalRootWithDOMProps>(withModalManager(initModal)(ModalRootTouchComponent)),\n ),\n ConfigProviderContext,\n 'configProvider',\n);\n\n/**\n * Инициализирует модалку перед анимацией открытия\n */\nfunction initModal(modalState: ModalsStateEntry) {\n switch (modalState.type) {\n case ModalType.PAGE:\n modalState.settlingHeight = modalState.settlingHeight || MODAL_PAGE_DEFAULT_PERCENT_HEIGHT;\n return initPageModal(modalState);\n case ModalType.CARD:\n return initCardModal(modalState);\n default:\n process.env.NODE_ENV === 'development' &&\n warn(`initActiveModal: modalState.type=\"${modalState.type}\" не поддерживается`, 'error');\n }\n}\n\nfunction initPageModal(modalState: ModalsStateEntry) {\n const { contentElement, bottomInset } = modalState;\n const contentElementHeight = (contentElement?.firstElementChild as HTMLElement).scrollHeight;\n const bottomInsetHeight = bottomInset?.offsetHeight || 0;\n const contentHeight = contentElementHeight + bottomInsetHeight;\n let prevTranslateY = modalState.translateY;\n\n modalState.expandable =\n contentHeight > (contentElement?.clientHeight ?? 0) ||\n modalState.settlingHeight === 100 ||\n modalState.expanded;\n\n let collapsed = false;\n let expanded = false;\n let translateYFrom;\n let translateY;\n let expandedRange: TranslateRange;\n let collapsedRange: TranslateRange;\n let hiddenRange: TranslateRange;\n\n if (modalState.expandable) {\n translateYFrom = 100 - (modalState.settlingHeight ?? 0);\n\n const shiftHalf = translateYFrom / 2;\n const visiblePart = 100 - translateYFrom;\n\n expandedRange = [0, shiftHalf];\n collapsedRange = [shiftHalf, translateYFrom + visiblePart / 4];\n hiddenRange = [translateYFrom + visiblePart / 4, 100];\n\n collapsed = translateYFrom > 0;\n expanded = translateYFrom <= 0;\n translateY = translateYFrom;\n } else {\n const headerHeight = modalState.headerElement?.offsetHeight ?? 0;\n const height = contentHeight + headerHeight;\n\n translateYFrom =\n 100 - (height / (modalState.innerElement?.parentElement?.offsetHeight ?? 0)) * 100;\n translateY = translateYFrom;\n\n expandedRange = [translateY, translateY + 25];\n collapsedRange = [translateY + 25, translateY + 25];\n hiddenRange = [translateY + 25, translateY + 100];\n }\n\n // Если модалка может открываться на весь экран, и новый сдвиг больше предыдущего, то откроем её на весь экран\n if (\n (modalState.expandable && translateY > (prevTranslateY ?? 100)) ||\n modalState.settlingHeight === 100\n ) {\n translateY = 0;\n }\n\n // Если модалка уже раскрыта обновляем состояния\n if (translateY === 0) {\n expanded = true;\n collapsed = false;\n }\n\n modalState.expandedRange = expandedRange;\n modalState.collapsedRange = collapsedRange;\n modalState.hiddenRange = hiddenRange;\n modalState.translateY = translateY;\n modalState.translateYFrom = translateYFrom;\n modalState.collapsed = collapsed;\n modalState.expanded = expanded;\n}\n\nfunction initCardModal(modalState: ModalsStateEntry) {\n modalState.translateY = 0;\n}\n"],"names":["React","classNames","clamp","withContext","withPlatform","withDOM","getNavId","Platform","setTransformStyle","transitionEvent","rubber","warnOnce","ConfigProviderContext","FocusTrap","Touch","TouchRootContext","ModalRootContext","MODAL_PAGE_DEFAULT_PERCENT_HEIGHT","ModalType","withModalManager","styles","warn","numberInRange","number","range","rangeTranslate","ModalRootTouchComponent","Component","constructor","props","state","touchDown","dragging","modalOpenedLog","maskElementRef","createRef","modalRootContext","updateModalHeight","registerModal","id","data","Object","assign","getModalState","onClose","onExit","isInsideModal","frameIds","documentScrolling","viewportRef","maskAnimationFrame","undefined","restoreFocusTo","timeout","platform","IOS","document","window","getModals","Children","toArray","children","componentDidMount","addEventListener","componentWillUnmount","toggleDocumentScrolling","removeEventListener","componentDidUpdate","prevProps","exitingModal","closeModal","enteringModal","enteringState","onEnter","waitTransitionFinish","innerElement","style","transitionDelay","onEntered","delayEnter","animateTranslate","translateY","setMaskOpacity","activeModal","activeElement","focus","enabled","preventTouch","passive","event","originalEvent","preventDefault","checkPageContentHeight","modalState","type","PAGE","modalElement","prevModalState","initPageModal","currentModalState","needAnimate","expandable","translateYFrom","requestAnimationFrame","setState","length","prevState","nextModalState","nextIsPage","prevIsPage","onExited","exitTranslate","isBack","includes","onTouchMove","e","onPageTouchMove","CARD","onCardTouchMove","shiftY","target","isY","current","contains","stopPropagation","contentScrolled","collapsed","expanded","touchStartContentScrollTop","contentElement","scrollTop","touchMovePositive","headerElement","shiftYPercent","innerHeight","shiftYCurrent","touchShiftYPercent","translateYCurrent","offsetHeight","Math","max","onTouchEnd","onPageTouchEnd","onCardTouchEnd","startY","setStateCallback","shiftYEndPercent","expectTranslateY","duration","settlingHeight","expandedRange","collapsedRange","hiddenRange","hidden","onScroll","contentScrollStopTimeout","clearTimeout","setTimeout","eventHandler","supported","onceHandler","name","percent","frameId","cancelAnimationFrame","forceOpacity","history","opacity","toString","render","Provider","value","className","configProvider","hasCustomPanelHeaderAfter","onMove","onEnd","div","onClick","ref","map","Modal","modalId","_modalState","isPage","key","getRootRef","restoreFocus","ModalRootTouch","initModal","initCardModal","process","env","NODE_ENV","bottomInset","contentElementHeight","firstElementChild","scrollHeight","bottomInsetHeight","contentHeight","prevTranslateY","clientHeight","shiftHalf","visiblePart","headerHeight","height","parentElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { withContext } from '../../hoc/withContext';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { DOMProps, withDOM } from '../../lib/dom';\nimport { getNavId } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { setTransformStyle } from '../../lib/styles';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { rubber } from '../../lib/touch';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { ModalRootContext, ModalRootContextInterface } from './ModalRootContext';\nimport { MODAL_PAGE_DEFAULT_PERCENT_HEIGHT } from './constants';\nimport { ModalRootWithDOMProps, ModalsStateEntry, ModalType, TranslateRange } from './types';\nimport { ModalTransitionProps, withModalManager } from './useModalManager';\nimport styles from './ModalRoot.module.css';\n\nconst warn = warnOnce('ModalRoot');\n\nfunction numberInRange(number: number, range: TranslateRange | undefined) {\n if (!range) {\n return false;\n }\n return number >= range[0] && number <= range[1];\n}\n\nfunction rangeTranslate(number: number) {\n return clamp(number, 0, 98);\n}\n\ninterface ModalRootState {\n touchDown?: boolean;\n dragging?: boolean;\n modalOpenedLog: string[];\n}\n\nclass ModalRootTouchComponent extends React.Component<\n ModalRootWithDOMProps & DOMProps & ModalTransitionProps,\n ModalRootState\n> {\n constructor(props: ModalRootWithDOMProps & ModalTransitionProps) {\n super(props);\n this.state = {\n touchDown: false,\n dragging: false,\n modalOpenedLog: [],\n };\n\n this.maskElementRef = React.createRef();\n\n this.modalRootContext = {\n updateModalHeight: this.updateModalHeight,\n registerModal: ({ id, ...data }) => Object.assign(this.props.getModalState(id) ?? {}, data),\n onClose: () => this.props.onExit(),\n isInsideModal: true,\n };\n\n this.frameIds = {};\n }\n\n private documentScrolling = false;\n private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n private readonly viewportRef = React.createRef<HTMLDivElement>();\n private maskAnimationFrame: number | undefined = undefined;\n private readonly modalRootContext: ModalRootContextInterface;\n private readonly frameIds: {\n [index: string]: number;\n };\n private restoreFocusTo: HTMLElement | undefined | null = undefined;\n\n get timeout(): number {\n return this.props.platform === Platform.IOS ? 400 : 320;\n }\n\n get document(): Document {\n return this.props.document as Document;\n }\n\n get window(): Window {\n return this.props.window as Window;\n }\n\n getModals() {\n return React.Children.toArray(this.props.children) as React.ReactElement[];\n }\n\n componentDidMount() {\n // Отслеживаем изменение размеров viewport\n this.window?.addEventListener('resize', this.updateModalHeight, false);\n }\n\n componentWillUnmount() {\n this.toggleDocumentScrolling(true);\n this.window.removeEventListener('resize', this.updateModalHeight, false);\n }\n\n componentDidUpdate(prevProps: ModalRootWithDOMProps & ModalTransitionProps) {\n // transition phase 2: animate exiting modal\n if (this.props.exitingModal && this.props.exitingModal !== prevProps.exitingModal) {\n this.closeModal(this.props.exitingModal);\n }\n\n // transition phase 3: animate entering modal\n if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {\n const { enteringModal } = this.props;\n const enteringState = this.props.getModalState(enteringModal);\n this.props.onEnter();\n this.waitTransitionFinish(enteringState, () => {\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = '';\n }\n this.props.onEntered(enteringModal);\n });\n\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = this.props.delayEnter\n ? `${this.timeout}ms`\n : '';\n this.animateTranslate(enteringState, enteringState.translateY);\n this.setMaskOpacity(enteringState, 1);\n }\n }\n\n // focus restoration\n if (this.props.activeModal && !prevProps.activeModal) {\n this.restoreFocusTo = this.document.activeElement as HTMLElement;\n }\n if (!this.props.activeModal && !this.props.exitingModal && this.restoreFocusTo) {\n this.restoreFocusTo.focus();\n this.restoreFocusTo = null;\n }\n\n this.toggleDocumentScrolling(!this.props.activeModal && !this.props.exitingModal);\n }\n\n /* Отключает скролл документа */\n toggleDocumentScrolling(enabled: boolean) {\n if (this.documentScrolling === enabled) {\n return;\n }\n this.documentScrolling = enabled;\n\n if (enabled) {\n // Здесь нужен последний аргумент с такими же параметрами, потому что\n // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.\n // https://github.com/VKCOM/VKUI/issues/444\n this.window.removeEventListener('touchmove', this.preventTouch, {\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions нет поля passive\n passive: false,\n });\n } else {\n this.window.addEventListener('touchmove', this.preventTouch, {\n passive: false,\n });\n }\n }\n\n preventTouch = (event: any) => {\n if (!event) {\n return false;\n }\n while (event.originalEvent) {\n event = event.originalEvent;\n }\n if (event.preventDefault) {\n event.preventDefault();\n }\n return false;\n };\n\n checkPageContentHeight() {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {\n const prevModalState = { ...modalState };\n initPageModal(modalState);\n const currentModalState = { ...modalState };\n\n let needAnimate = false;\n\n if (prevModalState.expandable === currentModalState.expandable) {\n if (prevModalState.translateYFrom !== currentModalState.translateYFrom) {\n needAnimate = true;\n }\n } else {\n needAnimate = true;\n }\n\n if (needAnimate) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n }\n }\n\n updateModalHeight = () => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState && modalState.type === ModalType.PAGE) {\n if (this.props.enteringModal) {\n this.waitTransitionFinish(modalState, () => {\n requestAnimationFrame(() => this.checkPageContentHeight());\n });\n } else {\n requestAnimationFrame(() => this.checkPageContentHeight());\n }\n }\n };\n\n closeModal(id: string) {\n // Сбрасываем состояния, которые могут помешать закрытию модального окна\n this.setState({ touchDown: false });\n\n const prevModalState = this.props.getModalState(id);\n\n if (!prevModalState) {\n id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');\n return;\n }\n if (!this.state.modalOpenedLog.length) {\n this.setState((prevState) => ({\n modalOpenedLog: [...prevState.modalOpenedLog, id],\n }));\n }\n const nextModalState = this.props.getModalState(this.props.activeModal);\n const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;\n\n const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;\n this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n const exitTranslate =\n prevIsPage &&\n nextIsPage &&\n (prevModalState.translateY ?? 0) <= (nextModalState?.translateYFrom ?? 0) &&\n !this.props.isBack\n ? (nextModalState?.translateYFrom ?? 0) + 10\n : 100;\n this.animateTranslate(prevModalState, exitTranslate);\n\n if (!nextModalState) {\n // NOTE: was only for clean exit\n this.setMaskOpacity(prevModalState, 0);\n this.setState({ modalOpenedLog: [] });\n prevModalState.translateY = undefined;\n } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {\n nextModalState.translateY = undefined;\n this.setState((prevState) => ({\n modalOpenedLog: [...prevState.modalOpenedLog, nextModalState.id!],\n }));\n }\n }\n\n onTouchMove = (e: TouchEvent) => {\n if (this.props.exitingModal) {\n return;\n }\n const modalState = this.props.getModalState(this.props.activeModal);\n if (!modalState) {\n return;\n }\n\n if (modalState.type === ModalType.PAGE) {\n return this.onPageTouchMove(e, modalState);\n }\n\n if (modalState.type === ModalType.CARD) {\n return this.onCardTouchMove(e, modalState);\n }\n };\n\n onPageTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { shiftY, originalEvent } = event;\n const target = originalEvent.target as HTMLElement;\n\n if (!event.isY) {\n if (this.viewportRef.current?.contains(target)) {\n originalEvent.preventDefault();\n }\n return;\n }\n\n if (!modalState.innerElement?.contains(target)) {\n return originalEvent.preventDefault();\n }\n\n originalEvent.stopPropagation();\n\n const { expandable, contentScrolled, collapsed, expanded } = modalState;\n\n if (!this.state.touchDown) {\n modalState.touchStartContentScrollTop = modalState.contentElement?.scrollTop ?? 0;\n this.setState({ touchDown: true });\n }\n\n if (contentScrolled) {\n return;\n }\n\n if (modalState.touchMovePositive === null) {\n modalState.touchMovePositive = shiftY > 0;\n }\n\n if (\n !modalState.expandable ||\n collapsed ||\n (expanded && modalState.touchMovePositive && modalState.touchStartContentScrollTop === 0) ||\n modalState.headerElement?.contains(target)\n ) {\n originalEvent.preventDefault();\n\n if ((!expandable && shiftY < 0) || !this.window) {\n return;\n }\n\n !this.state.dragging && this.setState({ dragging: true });\n\n const shiftYPercent = (shiftY / this.window.innerHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 0.8, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = rangeTranslate((modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onCardTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { originalEvent, shiftY } = event;\n const target = originalEvent.target as HTMLElement;\n if (modalState.innerElement?.contains(target)) {\n if (!this.state.touchDown) {\n this.setState({ touchDown: true, dragging: true });\n }\n\n const shiftYPercent = (shiftY / modalState.innerElement.offsetHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 1.2, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = Math.max(0, (modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onTouchEnd = (e: TouchEvent) => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE) {\n return this.onPageTouchEnd(e, modalState);\n }\n\n if (modalState?.type === ModalType.CARD) {\n return this.onCardTouchEnd(e, modalState);\n }\n };\n\n onPageTouchEnd(event: TouchEvent, modalState: ModalsStateEntry) {\n const { startY, shiftY } = event;\n\n modalState.contentScrolled = false;\n modalState.touchMovePositive = null;\n\n let setStateCallback;\n\n if (this.state.dragging && this.window) {\n const shiftYEndPercent = ((startY + shiftY) / this.window.innerHeight) * 100;\n\n let translateY = modalState.translateYCurrent ?? 0;\n const expectTranslateY =\n (translateY / event.duration) *\n 240 *\n 0.6 *\n ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = rangeTranslate(translateY + expectTranslateY);\n\n if (modalState.settlingHeight !== 100) {\n if (numberInRange(translateY, modalState.expandedRange)) {\n translateY = modalState.expandedRange?.[0] ?? 0;\n } else if (numberInRange(translateY, modalState.collapsedRange)) {\n translateY = modalState.translateYFrom ?? 0;\n } else if (numberInRange(translateY, modalState.hiddenRange)) {\n translateY = 100;\n } else {\n translateY = modalState.translateYFrom ?? 0;\n }\n } else {\n if (numberInRange(translateY, [0, 25])) {\n translateY = 0;\n } else {\n translateY = 100;\n }\n }\n\n if (translateY !== 100 && shiftYEndPercent >= 75) {\n translateY = 100;\n }\n\n modalState.translateY = translateY;\n modalState.translateYCurrent = translateY;\n modalState.collapsed = numberInRange(translateY, modalState.collapsedRange);\n modalState.expanded = translateY === 0;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onCardTouchEnd({ duration }: TouchEvent, modalState: ModalsStateEntry) {\n let setStateCallback;\n\n if (this.state.dragging) {\n let translateY = modalState.translateYCurrent ?? 0;\n\n const expectTranslateY =\n (translateY / duration) * 240 * 0.6 * ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = Math.max(0, translateY + expectTranslateY);\n\n if (translateY >= 30) {\n translateY = 100;\n } else {\n translateY = 0;\n }\n\n modalState.translateY = translateY;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onScroll = (e: React.SyntheticEvent) => {\n const activeModal = this.props.activeModal;\n\n const target = e.target as HTMLElement;\n\n if (!activeModal) {\n return;\n }\n const modalState = this.props.getModalState(activeModal);\n if (modalState?.type === ModalType.PAGE && modalState?.contentElement?.contains(target)) {\n modalState.contentScrolled = true;\n\n if (modalState.contentScrollStopTimeout) {\n clearTimeout(modalState.contentScrollStopTimeout);\n }\n\n modalState.contentScrollStopTimeout = setTimeout(() => {\n if (modalState.contentScrolled) {\n modalState.contentScrolled = false;\n }\n }, 250);\n }\n };\n\n waitTransitionFinish(modalState: ModalsStateEntry | undefined, eventHandler: () => void) {\n if (transitionEvent.supported) {\n const onceHandler = () => {\n modalState?.innerElement?.removeEventListener(transitionEvent.name as string, onceHandler);\n eventHandler();\n };\n\n modalState?.innerElement?.addEventListener(transitionEvent.name as string, onceHandler);\n } else {\n setTimeout(eventHandler, this.timeout);\n }\n }\n\n /**\n * Анимирует сдвиг модалки\n *\n * @param {ModalsStateEntry} modalState\n * @param {number} percent Процент сдвига: 0 – полностью открыта, 100 – полностью закрыта\n */\n animateTranslate(modalState: ModalsStateEntry, percent: number | undefined) {\n const frameId = `animateTranslateFrame${modalState.id}`;\n\n cancelAnimationFrame(this.frameIds[frameId]);\n\n this.frameIds[frameId] = requestAnimationFrame(() => {\n setTransformStyle(modalState.innerElement, `translate3d(0, ${percent}%, 0)`);\n });\n }\n\n /* Устанавливает прозрачность для полупрозрачной подложки */\n setMaskOpacity(modalState: ModalsStateEntry, forceOpacity: number | null = null) {\n if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n return;\n }\n if (this.maskAnimationFrame) {\n cancelAnimationFrame(this.maskAnimationFrame);\n }\n this.maskAnimationFrame = requestAnimationFrame(() => {\n if (this.maskElementRef.current) {\n const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n const opacity =\n forceOpacity === null\n ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0\n : forceOpacity;\n this.maskElementRef.current.style.opacity = clamp(opacity, 0, 100).toString();\n this.maskElementRef.current.style.transitionDelay =\n opacity && this.props.delayEnter ? `${this.timeout}ms` : '';\n }\n });\n }\n\n render() {\n const { activeModal, exitingModal, enteringModal } = this.props;\n const { touchDown, dragging } = this.state;\n\n if (!activeModal && !exitingModal) {\n return null;\n }\n\n return (\n <TouchRootContext.Provider value={true}>\n <ModalRootContext.Provider value={this.modalRootContext}>\n <Touch\n className={classNames(\n styles['ModalRoot'],\n this.props.configProvider?.hasCustomPanelHeaderAfter &&\n styles['ModalRoot--hasCustomPanelHeaderAfterSlot'],\n touchDown &&\n classNames(styles['ModalRoot--touched'], 'vkuiInternalModalRoot--touched'),\n !!(enteringModal || exitingModal) &&\n classNames(styles['ModalRoot--switching'], 'vkuiInternalModalRoot--switching'),\n )}\n onMove={this.onTouchMove}\n onEnd={this.onTouchEnd}\n onScroll={this.onScroll}\n >\n <div\n className={styles['ModalRoot__mask']}\n onClick={this.props.onExit}\n ref={this.maskElementRef}\n />\n <div className={styles['ModalRoot__viewport']} ref={this.viewportRef}>\n {this.getModals().map((Modal) => {\n const modalId = getNavId(Modal.props, warn);\n const _modalState = this.props.getModalState(modalId);\n if ((modalId !== activeModal && modalId !== exitingModal) || !_modalState) {\n return null;\n }\n const modalState = { ..._modalState };\n\n const isPage = modalState.type === ModalType.PAGE;\n const key = `modal-${modalId}`;\n\n return (\n <FocusTrap\n key={key}\n getRootRef={(e) => {\n const modalState = this.props.getModalState(modalId);\n if (modalState) {\n modalState.modalElement = e;\n }\n }}\n onClose={this.props.onExit}\n timeout={this.timeout}\n className={classNames(\n styles['ModalRoot__modal'],\n\n dragging && 'vkuiInternalModalRoot__modal--dragging',\n\n isPage && modalState.expandable && 'vkuiInternalModalRoot__modal--expandable',\n isPage && modalState.collapsed && 'vkuiInternalModalRoot__modal--collapsed',\n )}\n restoreFocus={false}\n >\n {Modal}\n </FocusTrap>\n );\n })}\n </div>\n </Touch>\n </ModalRootContext.Provider>\n </TouchRootContext.Provider>\n );\n }\n}\n\nexport const ModalRootTouch = withContext(\n withPlatform(\n withDOM<ModalRootWithDOMProps>(withModalManager(initModal)(ModalRootTouchComponent)),\n ),\n ConfigProviderContext,\n 'configProvider',\n);\n\n/**\n * Инициализирует модалку перед анимацией открытия\n */\nfunction initModal(modalState: ModalsStateEntry) {\n switch (modalState.type) {\n case ModalType.PAGE:\n modalState.settlingHeight = modalState.settlingHeight || MODAL_PAGE_DEFAULT_PERCENT_HEIGHT;\n return initPageModal(modalState);\n case ModalType.CARD:\n return initCardModal(modalState);\n default:\n process.env.NODE_ENV === 'development' &&\n warn(`initActiveModal: modalState.type=\"${modalState.type}\" не поддерживается`, 'error');\n }\n}\n\nfunction initPageModal(modalState: ModalsStateEntry) {\n const { contentElement, bottomInset } = modalState;\n const contentElementHeight = (contentElement?.firstElementChild as HTMLElement).scrollHeight;\n const bottomInsetHeight = bottomInset?.offsetHeight || 0;\n const contentHeight = contentElementHeight + bottomInsetHeight;\n let prevTranslateY = modalState.translateY;\n\n modalState.expandable =\n contentHeight > (contentElement?.clientHeight ?? 0) ||\n modalState.settlingHeight === 100 ||\n modalState.expanded;\n\n let collapsed = false;\n let expanded = false;\n let translateYFrom;\n let translateY;\n let expandedRange: TranslateRange;\n let collapsedRange: TranslateRange | undefined;\n let hiddenRange: TranslateRange;\n\n const hasCollapsedState = Boolean(modalState.expandable && modalState.settlingHeight !== 100);\n if (modalState.expandable) {\n translateYFrom = 100 - (modalState.settlingHeight ?? 0);\n\n const shiftHalf = translateYFrom / 2;\n const visiblePart = 100 - translateYFrom;\n\n expandedRange = [0, shiftHalf];\n collapsedRange = hasCollapsedState ? [shiftHalf, translateYFrom + visiblePart / 4] : undefined;\n hiddenRange = [translateYFrom + visiblePart / 4, 100];\n\n collapsed = hasCollapsedState && translateYFrom > 0;\n expanded = translateYFrom <= 0;\n translateY = translateYFrom;\n } else {\n const headerHeight = modalState.headerElement?.offsetHeight ?? 0;\n const height = contentHeight + headerHeight;\n\n translateYFrom =\n 100 - (height / (modalState.innerElement?.parentElement?.offsetHeight ?? 0)) * 100;\n translateY = translateYFrom;\n\n expandedRange = [translateY, translateY + 25];\n collapsedRange = undefined;\n hiddenRange = [translateY + 25, translateY + 100];\n }\n\n // Если модалка может открываться на весь экран, и новый сдвиг больше предыдущего, то откроем её на весь экран\n if (\n (modalState.expandable && translateY > (prevTranslateY ?? 100)) ||\n modalState.settlingHeight === 100\n ) {\n translateY = 0;\n }\n\n // Если модалка уже раскрыта обновляем состояния\n if (translateY === 0) {\n expanded = true;\n collapsed = false;\n }\n\n modalState.expandedRange = expandedRange;\n modalState.collapsedRange = collapsedRange;\n modalState.hiddenRange = hiddenRange;\n modalState.translateY = translateY;\n modalState.translateYFrom = translateYFrom;\n modalState.collapsed = collapsed;\n modalState.expanded = expanded;\n}\n\nfunction initCardModal(modalState: ModalsStateEntry) {\n modalState.translateY = 0;\n}\n"],"names":["React","classNames","clamp","withContext","withPlatform","withDOM","getNavId","Platform","setTransformStyle","transitionEvent","rubber","warnOnce","ConfigProviderContext","FocusTrap","Touch","TouchRootContext","ModalRootContext","MODAL_PAGE_DEFAULT_PERCENT_HEIGHT","ModalType","withModalManager","styles","warn","numberInRange","number","range","rangeTranslate","ModalRootTouchComponent","Component","constructor","props","state","touchDown","dragging","modalOpenedLog","maskElementRef","createRef","modalRootContext","updateModalHeight","registerModal","id","data","Object","assign","getModalState","onClose","onExit","isInsideModal","frameIds","documentScrolling","viewportRef","maskAnimationFrame","undefined","restoreFocusTo","timeout","platform","IOS","document","window","getModals","Children","toArray","children","componentDidMount","addEventListener","componentWillUnmount","toggleDocumentScrolling","removeEventListener","componentDidUpdate","prevProps","exitingModal","closeModal","enteringModal","enteringState","onEnter","waitTransitionFinish","innerElement","style","transitionDelay","onEntered","delayEnter","animateTranslate","translateY","setMaskOpacity","activeModal","activeElement","focus","enabled","preventTouch","passive","event","originalEvent","preventDefault","checkPageContentHeight","modalState","type","PAGE","modalElement","prevModalState","initPageModal","currentModalState","needAnimate","expandable","translateYFrom","requestAnimationFrame","setState","length","prevState","nextModalState","nextIsPage","prevIsPage","onExited","exitTranslate","isBack","includes","onTouchMove","e","onPageTouchMove","CARD","onCardTouchMove","shiftY","target","isY","current","contains","stopPropagation","contentScrolled","collapsed","expanded","touchStartContentScrollTop","contentElement","scrollTop","touchMovePositive","headerElement","shiftYPercent","innerHeight","shiftYCurrent","touchShiftYPercent","translateYCurrent","offsetHeight","Math","max","onTouchEnd","onPageTouchEnd","onCardTouchEnd","startY","setStateCallback","shiftYEndPercent","expectTranslateY","duration","settlingHeight","expandedRange","collapsedRange","hiddenRange","hidden","onScroll","contentScrollStopTimeout","clearTimeout","setTimeout","eventHandler","supported","onceHandler","name","percent","frameId","cancelAnimationFrame","forceOpacity","history","opacity","toString","render","Provider","value","className","configProvider","hasCustomPanelHeaderAfter","onMove","onEnd","div","onClick","ref","map","Modal","modalId","_modalState","isPage","key","getRootRef","restoreFocus","ModalRootTouch","initModal","initCardModal","process","env","NODE_ENV","bottomInset","contentElementHeight","firstElementChild","scrollHeight","bottomInsetHeight","contentHeight","prevTranslateY","clientHeight","hasCollapsedState","Boolean","shiftHalf","visiblePart","headerHeight","height","parentElement"],"mappings":"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"}
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
.PanelHeaderButton--primitive {
|
|
20
20
|
height: 48px;
|
|
21
21
|
line-height: 48px;
|
|
22
|
-
padding: 0
|
|
22
|
+
padding: 0 10px;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
25
|
/*
|
|
@@ -46,6 +46,12 @@
|
|
|
46
46
|
padding: 8px;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
+
/* stylelint-disable-next-line @project-tools/stylelint-atomic -- фикс для иконки назад */
|
|
50
|
+
|
|
51
|
+
.PanelHeaderBack--ios :global(.vkuiIcon--w-20) {
|
|
52
|
+
padding-left: 4px;
|
|
53
|
+
}
|
|
54
|
+
|
|
49
55
|
/*
|
|
50
56
|
* Android
|
|
51
57
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PullToRefresh.d.ts","sourceRoot":"","sources":["../../../../src/components/PullToRefresh/PullToRefresh.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,QAAQ,EAAU,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"PullToRefresh.d.ts","sourceRoot":"","sources":["../../../../src/components/PullToRefresh/PullToRefresh.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,QAAQ,EAAU,MAAM,eAAe,CAAC;AAKjD,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,sBAAsB,EAAa,MAAM,0BAA0B,CAAC;AAE7E,OAAO,EAAqB,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAqB/D,MAAM,WAAW,kBAAmB,SAAQ,QAAQ,EAAE,UAAU,EAAE,WAAW;IAC3E;;;;;;;;;;;;;;;;;;;;;;;;;;;OA2BG;IACH,SAAS,EAAE,WAAW,CAAC;IACvB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc;IACd,MAAM,CAAC,EAAE,sBAAsB,CAAC;CACjC;AAOD;;GAEG;AACH,eAAO,MAAM,aAAa,iEAMvB,kBAAkB,sBAiOpB,CAAC"}
|
|
@@ -8,6 +8,7 @@ import { useTimeout } from '../../hooks/useTimeout';
|
|
|
8
8
|
import { useDOM } from '../../lib/dom';
|
|
9
9
|
import { Platform } from '../../lib/platform';
|
|
10
10
|
import { runTapticImpactOccurred } from '../../lib/taptic';
|
|
11
|
+
import { coordY } from '../../lib/touch';
|
|
11
12
|
import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
|
|
12
13
|
import { useScroll } from '../AppRoot/ScrollContext';
|
|
13
14
|
import { FixedLayout } from '../FixedLayout/FixedLayout';
|
|
@@ -59,13 +60,6 @@ const TOUCH_MOVE_EVENT_PARAMS = {
|
|
|
59
60
|
const touchY = React.useRef(0);
|
|
60
61
|
const [contentShift, setContentShift] = React.useState(0);
|
|
61
62
|
const [spinnerProgress, setSpinnerProgress] = React.useState(0);
|
|
62
|
-
const onWindowTouchMove = (event)=>{
|
|
63
|
-
if (refreshing) {
|
|
64
|
-
event.preventDefault();
|
|
65
|
-
event.stopPropagation();
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
useGlobalEventListener(document, 'touchmove', onWindowTouchMove, TOUCH_MOVE_EVENT_PARAMS);
|
|
69
63
|
const resetRefreshingState = React.useCallback(()=>{
|
|
70
64
|
setWatching(false);
|
|
71
65
|
setCanRefresh(false);
|
|
@@ -148,12 +142,33 @@ const TOUCH_MOVE_EVENT_PARAMS = {
|
|
|
148
142
|
canRefresh,
|
|
149
143
|
runRefreshing
|
|
150
144
|
]);
|
|
145
|
+
const startYRef = React.useRef(0);
|
|
151
146
|
const onTouchStart = (e)=>{
|
|
152
147
|
if (refreshing) {
|
|
153
148
|
cancelEvent(e);
|
|
154
149
|
}
|
|
155
150
|
setTouchDown(true);
|
|
151
|
+
startYRef.current = e.startY;
|
|
152
|
+
};
|
|
153
|
+
const shouldPreventTouchMove = (event)=>{
|
|
154
|
+
if (watching || refreshing) {
|
|
155
|
+
return true;
|
|
156
|
+
}
|
|
157
|
+
/* Нам нужно запретить touchmove у документа как только стало понятно, что
|
|
158
|
+
* начинается pull.
|
|
159
|
+
* состояния watching и refreshing устанавливаются слишком поздно и браузер
|
|
160
|
+
* может успеть начать нативный pull to refresh. */ const shiftY = coordY(event) - startYRef.current;
|
|
161
|
+
const pageYOffset = scroll?.getScroll().y;
|
|
162
|
+
const isRefreshGestureStarted = pageYOffset === 0 && shiftY > 0 && touchDown;
|
|
163
|
+
return isRefreshGestureStarted;
|
|
164
|
+
};
|
|
165
|
+
const onWindowTouchMove = (event)=>{
|
|
166
|
+
if (shouldPreventTouchMove(event)) {
|
|
167
|
+
event.preventDefault();
|
|
168
|
+
event.stopPropagation();
|
|
169
|
+
}
|
|
156
170
|
};
|
|
171
|
+
useGlobalEventListener(document, 'touchmove', onWindowTouchMove, TOUCH_MOVE_EVENT_PARAMS);
|
|
157
172
|
const onTouchMove = (e)=>{
|
|
158
173
|
const { isY, shiftY } = e;
|
|
159
174
|
const { start, max } = initParams;
|