@vkontakte/vkui 4.15.0 → 4.16.2
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/.cache/.eslintcache +1 -1
- package/.cache/.stylelintcache +1 -1
- package/.cache/.tsbuildinfo +391 -282
- package/.cache/ts/src/components/AppRoot/AppRoot.d.ts +1 -0
- package/.cache/ts/src/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/.cache/ts/src/components/CustomSelect/CustomSelect.d.ts +2 -2
- package/.cache/ts/src/components/FixedLayout/FixedLayout.d.ts +4 -9
- package/.cache/ts/src/components/ModalPage/ModalPage.d.ts +1 -2
- package/.cache/ts/src/components/Root/Root.d.ts +5 -27
- package/.cache/ts/src/components/SimpleCheckbox/SimpleCheckbox.d.ts +9 -0
- package/.cache/ts/src/components/Tappable/Tappable.d.ts +12 -9
- package/.cache/ts/src/components/Touch/Touch.d.ts +1 -2
- package/.cache/ts/src/components/UsersStack/masks.d.ts +1 -1
- package/.cache/ts/src/hooks/useEventListener.d.ts +2 -2
- package/.cache/ts/src/hooks/useKeyboard.d.ts +11 -0
- package/.cache/ts/src/index.d.ts +1 -1
- package/.cache/ts/src/lib/select.d.ts +7 -0
- package/.cache/ts/src/lib/touch.d.ts +1 -1
- package/.cache/ts/src/lib/utils.d.ts +2 -3
- package/.cache/ts/src/types.d.ts +2 -6
- package/.cache/ts/src/unstable/index.d.ts +2 -0
- package/babel.cjs.config.js +7 -1
- package/babel.config.js +7 -1
- package/dist/cjs/components/AppRoot/AppRoot.d.ts +1 -0
- package/dist/cjs/components/AppRoot/AppRoot.js +29 -1
- package/dist/cjs/components/AppRoot/AppRoot.js.map +1 -1
- package/dist/cjs/components/Banner/Banner.js +1 -1
- package/dist/cjs/components/Banner/Banner.js.map +1 -1
- package/dist/cjs/components/Cell/Cell.js +3 -3
- package/dist/cjs/components/Cell/Cell.js.map +1 -1
- package/dist/cjs/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/dist/cjs/components/ChipsSelect/ChipsSelect.js +5 -6
- package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
- package/dist/cjs/components/ChipsSelect/useChipsSelect.js +2 -2
- package/dist/cjs/components/ChipsSelect/useChipsSelect.js.map +1 -1
- package/dist/cjs/components/CustomSelect/CustomSelect.d.ts +2 -2
- package/dist/cjs/components/CustomSelect/CustomSelect.js +3 -3
- package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cjs/components/FixedLayout/FixedLayout.d.ts +4 -9
- package/dist/cjs/components/FixedLayout/FixedLayout.js +91 -179
- package/dist/cjs/components/FixedLayout/FixedLayout.js.map +1 -1
- package/dist/cjs/components/Gallery/Gallery.js +2 -2
- package/dist/cjs/components/Gallery/Gallery.js.map +1 -1
- package/dist/cjs/components/Header/Header.js +1 -1
- package/dist/cjs/components/Header/Header.js.map +1 -1
- package/dist/cjs/components/ModalCardBase/ModalCardBase.js +6 -1
- package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/cjs/components/ModalPage/ModalPage.d.ts +1 -2
- package/dist/cjs/components/ModalPage/ModalPage.js.map +1 -1
- package/dist/cjs/components/ModalRoot/ModalRoot.js +2 -2
- package/dist/cjs/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/cjs/components/Panel/Panel.js +2 -2
- package/dist/cjs/components/Panel/Panel.js.map +1 -1
- package/dist/cjs/components/PanelHeaderContent/PanelHeaderContent.js +0 -1
- package/dist/cjs/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
- package/dist/cjs/components/PullToRefresh/PullToRefresh.js +2 -2
- package/dist/cjs/components/PullToRefresh/PullToRefresh.js.map +1 -1
- package/dist/cjs/components/RangeSlider/UniversalSlider.js +2 -2
- package/dist/cjs/components/RangeSlider/UniversalSlider.js.map +1 -1
- package/dist/cjs/components/Root/Root.d.ts +5 -27
- package/dist/cjs/components/Root/Root.js +158 -214
- package/dist/cjs/components/Root/Root.js.map +1 -1
- package/dist/cjs/components/Search/Search.js +3 -3
- package/dist/cjs/components/Search/Search.js.map +1 -1
- package/dist/cjs/components/SimpleCell/SimpleCell.js.map +1 -1
- package/dist/cjs/components/SimpleCheckbox/SimpleCheckbox.d.ts +9 -0
- package/dist/cjs/components/SimpleCheckbox/SimpleCheckbox.js +126 -0
- package/dist/cjs/components/SimpleCheckbox/SimpleCheckbox.js.map +1 -0
- package/dist/cjs/components/Snackbar/Snackbar.js +2 -2
- package/dist/cjs/components/Snackbar/Snackbar.js.map +1 -1
- package/dist/cjs/components/Tappable/Tappable.d.ts +12 -9
- package/dist/cjs/components/Tappable/Tappable.js +47 -36
- package/dist/cjs/components/Tappable/Tappable.js.map +1 -1
- package/dist/cjs/components/Touch/Touch.d.ts +1 -2
- package/dist/cjs/components/Touch/Touch.js +172 -283
- package/dist/cjs/components/Touch/Touch.js.map +1 -1
- package/dist/cjs/components/UsersStack/UsersStack.js +9 -18
- package/dist/cjs/components/UsersStack/UsersStack.js.map +1 -1
- package/dist/cjs/components/UsersStack/masks.d.ts +1 -1
- package/dist/cjs/components/UsersStack/masks.js +5 -8
- package/dist/cjs/components/UsersStack/masks.js.map +1 -1
- package/dist/cjs/components/View/View.js +2 -2
- package/dist/cjs/components/View/View.js.map +1 -1
- package/dist/cjs/components/View/ViewInfinite.js +2 -2
- package/dist/cjs/components/View/ViewInfinite.js.map +1 -1
- package/dist/cjs/hooks/useEventListener.d.ts +2 -2
- package/dist/cjs/hooks/useEventListener.js +9 -4
- package/dist/cjs/hooks/useEventListener.js.map +1 -1
- package/dist/cjs/hooks/useGlobalEventListener.js +2 -4
- package/dist/cjs/hooks/useGlobalEventListener.js.map +1 -1
- package/dist/cjs/hooks/useInsets.js +3 -10
- package/dist/cjs/hooks/useInsets.js.map +1 -1
- package/dist/cjs/hooks/useKeyboard.d.ts +11 -0
- package/dist/cjs/hooks/useKeyboard.js +78 -0
- package/dist/cjs/hooks/useKeyboard.js.map +1 -0
- package/dist/cjs/hooks/useKeyboardInputTracker.js +4 -2
- package/dist/cjs/hooks/useKeyboardInputTracker.js.map +1 -1
- package/dist/cjs/index.d.ts +1 -1
- package/dist/cjs/index.js +2 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/lib/select.d.ts +7 -0
- package/dist/cjs/lib/select.js +73 -0
- package/dist/cjs/lib/select.js.map +1 -0
- package/dist/cjs/lib/touch.d.ts +1 -1
- package/dist/cjs/lib/touch.js +6 -2
- package/dist/cjs/lib/touch.js.map +1 -1
- package/dist/cjs/lib/utils.d.ts +2 -3
- package/dist/cjs/lib/utils.js.map +1 -1
- package/dist/cjs/types.d.ts +2 -6
- package/dist/cjs/unstable/index.d.ts +2 -0
- package/dist/cjs/unstable/index.js +8 -0
- package/dist/cjs/unstable/index.js.map +1 -1
- package/dist/components/AppRoot/AppRoot.d.ts +1 -0
- package/dist/components/AppRoot/AppRoot.js +29 -5
- package/dist/components/AppRoot/AppRoot.js.map +1 -1
- package/dist/components/Banner/Banner.js +1 -1
- package/dist/components/Banner/Banner.js.map +1 -1
- package/dist/components/Cell/Cell.js +1 -1
- package/dist/components/Cell/Cell.js.map +1 -1
- package/dist/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/dist/components/ChipsSelect/ChipsSelect.js +4 -6
- package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
- package/dist/components/ChipsSelect/useChipsSelect.js +2 -2
- package/dist/components/ChipsSelect/useChipsSelect.js.map +1 -1
- package/dist/components/CustomSelect/CustomSelect.d.ts +2 -2
- package/dist/components/CustomSelect/CustomSelect.js +2 -3
- package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/components/FixedLayout/FixedLayout.d.ts +4 -9
- package/dist/components/FixedLayout/FixedLayout.js +84 -175
- package/dist/components/FixedLayout/FixedLayout.js.map +1 -1
- package/dist/components/Gallery/Gallery.js +1 -1
- package/dist/components/Gallery/Gallery.js.map +1 -1
- package/dist/components/Header/Header.js +1 -1
- package/dist/components/Header/Header.js.map +1 -1
- package/dist/components/ModalCardBase/ModalCardBase.js +5 -1
- package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/components/ModalPage/ModalPage.d.ts +1 -2
- package/dist/components/ModalPage/ModalPage.js.map +1 -1
- package/dist/components/ModalRoot/ModalRoot.js +1 -1
- package/dist/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/components/Panel/Panel.js +1 -1
- package/dist/components/Panel/Panel.js.map +1 -1
- package/dist/components/PanelHeaderContent/PanelHeaderContent.js +0 -1
- package/dist/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
- package/dist/components/PullToRefresh/PullToRefresh.js +1 -1
- package/dist/components/PullToRefresh/PullToRefresh.js.map +1 -1
- package/dist/components/RangeSlider/UniversalSlider.js +1 -1
- package/dist/components/RangeSlider/UniversalSlider.js.map +1 -1
- package/dist/components/Root/Root.d.ts +5 -27
- package/dist/components/Root/Root.js +152 -207
- package/dist/components/Root/Root.js.map +1 -1
- package/dist/components/Search/Search.js +1 -1
- package/dist/components/Search/Search.js.map +1 -1
- package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
- package/dist/components/SimpleCheckbox/SimpleCheckbox.d.ts +9 -0
- package/dist/components/SimpleCheckbox/SimpleCheckbox.js +97 -0
- package/dist/components/SimpleCheckbox/SimpleCheckbox.js.map +1 -0
- package/dist/components/Snackbar/Snackbar.js +1 -1
- package/dist/components/Snackbar/Snackbar.js.map +1 -1
- package/dist/components/Tappable/Tappable.d.ts +12 -9
- package/dist/components/Tappable/Tappable.js +45 -37
- package/dist/components/Tappable/Tappable.js.map +1 -1
- package/dist/components/Touch/Touch.d.ts +1 -2
- package/dist/components/Touch/Touch.js +163 -286
- package/dist/components/Touch/Touch.js.map +1 -1
- package/dist/components/UsersStack/UsersStack.js +7 -16
- package/dist/components/UsersStack/UsersStack.js.map +1 -1
- package/dist/components/UsersStack/masks.d.ts +1 -1
- package/dist/components/UsersStack/masks.js +6 -9
- package/dist/components/UsersStack/masks.js.map +1 -1
- package/dist/components/View/View.js +1 -1
- package/dist/components/View/View.js.map +1 -1
- package/dist/components/View/ViewInfinite.js +1 -1
- package/dist/components/View/ViewInfinite.js.map +1 -1
- package/dist/components.css +1 -1
- package/dist/components.css.map +1 -1
- package/dist/cssm/components/ActionSheetItem/ActionSheetItem.css +1 -1
- package/dist/cssm/components/AppRoot/AppRoot.css +1 -0
- package/dist/cssm/components/AppRoot/AppRoot.js +30 -2
- package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
- package/dist/cssm/components/Banner/Banner.css +1 -1
- package/dist/cssm/components/Banner/Banner.js +1 -1
- package/dist/cssm/components/Banner/Banner.js.map +1 -1
- package/dist/cssm/components/Cell/Cell.js +1 -1
- package/dist/cssm/components/Cell/Cell.js.map +1 -1
- package/dist/cssm/components/ChipsSelect/ChipsSelect.js +4 -6
- package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
- package/dist/cssm/components/ChipsSelect/useChipsSelect.js +2 -2
- package/dist/cssm/components/ChipsSelect/useChipsSelect.js.map +1 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.js +2 -3
- package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cssm/components/FixedLayout/FixedLayout.js +84 -175
- package/dist/cssm/components/FixedLayout/FixedLayout.js.map +1 -1
- package/dist/cssm/components/Gallery/Gallery.js +1 -1
- package/dist/cssm/components/Gallery/Gallery.js.map +1 -1
- package/dist/cssm/components/Header/Header.js +1 -1
- package/dist/cssm/components/Header/Header.js.map +1 -1
- package/dist/cssm/components/ModalCardBase/ModalCardBase.css +1 -1
- package/dist/cssm/components/ModalCardBase/ModalCardBase.js +5 -1
- package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/cssm/components/ModalPage/ModalPage.js.map +1 -1
- package/dist/cssm/components/ModalRoot/ModalRoot.css +1 -1
- package/dist/cssm/components/ModalRoot/ModalRoot.js +1 -1
- package/dist/cssm/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/cssm/components/Panel/Panel.js +1 -1
- package/dist/cssm/components/Panel/Panel.js.map +1 -1
- package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.css +1 -1
- package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js +0 -1
- package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
- package/dist/cssm/components/PullToRefresh/PullToRefresh.js +1 -1
- package/dist/cssm/components/PullToRefresh/PullToRefresh.js.map +1 -1
- package/dist/cssm/components/RangeSlider/UniversalSlider.js +1 -1
- package/dist/cssm/components/RangeSlider/UniversalSlider.js.map +1 -1
- package/dist/cssm/components/Root/Root.js +152 -207
- package/dist/cssm/components/Root/Root.js.map +1 -1
- package/dist/cssm/components/Search/Search.js +1 -1
- package/dist/cssm/components/Search/Search.js.map +1 -1
- package/dist/cssm/components/SimpleCell/SimpleCell.js.map +1 -1
- package/dist/cssm/components/SimpleCheckbox/SimpleCheckbox.css +1 -0
- package/dist/cssm/components/SimpleCheckbox/SimpleCheckbox.js +98 -0
- package/dist/cssm/components/SimpleCheckbox/SimpleCheckbox.js.map +1 -0
- package/dist/cssm/components/Snackbar/Snackbar.js +1 -1
- package/dist/cssm/components/Snackbar/Snackbar.js.map +1 -1
- package/dist/cssm/components/Tappable/Tappable.js +45 -37
- package/dist/cssm/components/Tappable/Tappable.js.map +1 -1
- package/dist/cssm/components/Touch/Touch.js +163 -286
- package/dist/cssm/components/Touch/Touch.js.map +1 -1
- package/dist/cssm/components/UsersStack/UsersStack.css +1 -1
- package/dist/cssm/components/UsersStack/UsersStack.js +7 -16
- package/dist/cssm/components/UsersStack/UsersStack.js.map +1 -1
- package/dist/cssm/components/UsersStack/masks.js +6 -9
- package/dist/cssm/components/UsersStack/masks.js.map +1 -1
- package/dist/cssm/components/View/View.js +1 -1
- package/dist/cssm/components/View/View.js.map +1 -1
- package/dist/cssm/components/View/ViewInfinite.js +1 -1
- package/dist/cssm/components/View/ViewInfinite.js.map +1 -1
- package/dist/cssm/hooks/useEventListener.js +8 -4
- package/dist/cssm/hooks/useEventListener.js.map +1 -1
- package/dist/cssm/hooks/useGlobalEventListener.js +2 -2
- package/dist/cssm/hooks/useGlobalEventListener.js.map +1 -1
- package/dist/cssm/hooks/useInsets.js +2 -10
- package/dist/cssm/hooks/useInsets.js.map +1 -1
- package/dist/cssm/hooks/useKeyboard.js +62 -0
- package/dist/cssm/hooks/useKeyboard.js.map +1 -0
- package/dist/cssm/hooks/useKeyboardInputTracker.js +4 -2
- package/dist/cssm/hooks/useKeyboardInputTracker.js.map +1 -1
- package/dist/cssm/index.js +1 -1
- package/dist/cssm/index.js.map +1 -1
- package/dist/cssm/lib/select.js +62 -0
- package/dist/cssm/lib/select.js.map +1 -0
- package/dist/cssm/lib/touch.js +5 -2
- package/dist/cssm/lib/touch.js.map +1 -1
- package/dist/cssm/lib/utils.js.map +1 -1
- package/dist/cssm/styles/animations.css +1 -1
- package/dist/cssm/styles/common.css +1 -1
- package/dist/cssm/styles/components.css +1 -1
- package/dist/cssm/styles/constants.css +1 -1
- package/dist/cssm/styles/unstable.css +1 -1
- package/dist/cssm/unstable/index.js +1 -0
- package/dist/cssm/unstable/index.js.map +1 -1
- package/dist/hooks/useEventListener.d.ts +2 -2
- package/dist/hooks/useEventListener.js +8 -4
- package/dist/hooks/useEventListener.js.map +1 -1
- package/dist/hooks/useGlobalEventListener.js +2 -2
- package/dist/hooks/useGlobalEventListener.js.map +1 -1
- package/dist/hooks/useInsets.js +2 -10
- package/dist/hooks/useInsets.js.map +1 -1
- package/dist/hooks/useKeyboard.d.ts +11 -0
- package/dist/hooks/useKeyboard.js +62 -0
- package/dist/hooks/useKeyboard.js.map +1 -0
- package/dist/hooks/useKeyboardInputTracker.js +4 -2
- package/dist/hooks/useKeyboardInputTracker.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/lib/select.d.ts +7 -0
- package/dist/lib/select.js +62 -0
- package/dist/lib/select.js.map +1 -0
- package/dist/lib/touch.d.ts +1 -1
- package/dist/lib/touch.js +5 -2
- package/dist/lib/touch.js.map +1 -1
- package/dist/lib/utils.d.ts +2 -3
- package/dist/lib/utils.js.map +1 -1
- package/dist/types.d.ts +2 -6
- package/dist/unstable/index.d.ts +2 -0
- package/dist/unstable/index.js +1 -0
- package/dist/unstable/index.js.map +1 -1
- package/dist/unstable.css +1 -1
- package/dist/unstable.css.map +1 -1
- package/dist/vkui.css +1 -1
- package/dist/vkui.css.map +1 -1
- package/package.json +4 -2
- package/postcss.config.js +1 -1
- package/src/components/ActionSheetItem/ActionSheetItem.css +4 -8
- package/src/components/AppRoot/AppRoot.css +20 -0
- package/src/components/AppRoot/AppRoot.tsx +30 -0
- package/src/components/Banner/Banner.css +4 -0
- package/src/components/Banner/Banner.tsx +1 -1
- package/src/components/Cell/Cell.tsx +1 -1
- package/src/components/ChipsSelect/ChipsSelect.tsx +4 -7
- package/src/components/ChipsSelect/Readme.md +0 -2
- package/src/components/ChipsSelect/useChipsSelect.ts +1 -1
- package/src/components/CustomSelect/CustomSelect.tsx +3 -2
- package/src/components/FixedLayout/FixedLayout.tsx +61 -147
- package/src/components/Gallery/Gallery.tsx +1 -1
- package/src/components/Header/Header.tsx +1 -1
- package/src/components/ModalCardBase/ModalCardBase.css +4 -0
- package/src/components/ModalCardBase/ModalCardBase.tsx +5 -1
- package/src/components/ModalPage/ModalPage.tsx +1 -2
- package/src/components/ModalRoot/ModalRoot.css +10 -0
- package/src/components/ModalRoot/ModalRoot.tsx +1 -1
- package/src/components/Panel/Panel.tsx +1 -1
- package/src/components/PanelHeaderContent/PanelHeaderContent.css +2 -1
- package/src/components/PanelHeaderContent/PanelHeaderContent.tsx +2 -2
- package/src/components/PullToRefresh/PullToRefresh.tsx +1 -1
- package/src/components/RangeSlider/UniversalSlider.tsx +1 -1
- package/src/components/Root/Readme.md +27 -37
- package/src/components/Root/Root.tsx +112 -191
- package/src/components/Search/Search.tsx +1 -1
- package/src/components/Separator/Readme.md +3 -1
- package/src/components/SimpleCell/SimpleCell.tsx +1 -1
- package/src/components/SimpleCheckbox/Readme.md +17 -0
- package/src/components/SimpleCheckbox/SimpleCheckbox.css +115 -0
- package/src/components/SimpleCheckbox/SimpleCheckbox.tsx +105 -0
- package/src/components/Snackbar/Snackbar.tsx +1 -1
- package/src/components/Tappable/Tappable.tsx +28 -37
- package/src/components/Touch/Touch.tsx +100 -238
- package/src/components/UsersStack/UsersStack.css +5 -9
- package/src/components/UsersStack/UsersStack.tsx +4 -11
- package/src/components/UsersStack/masks.tsx +6 -9
- package/src/components/View/Readme.md +34 -42
- package/src/components/View/View.tsx +1 -1
- package/src/components/View/ViewInfinite.tsx +1 -1
- package/src/hooks/useEventListener.ts +11 -8
- package/src/hooks/useGlobalEventListener.ts +2 -2
- package/src/hooks/useInsets.ts +2 -8
- package/src/hooks/useKeyboard.ts +67 -0
- package/src/hooks/useKeyboardInputTracker.ts +4 -2
- package/src/index.ts +1 -1
- package/src/lib/select.ts +53 -0
- package/src/lib/touch.ts +2 -2
- package/src/lib/utils.ts +3 -4
- package/src/styles/animations.css +0 -14
- package/src/styles/common.css +0 -21
- package/src/styles/components.css +2 -0
- package/src/styles/constants.css +3 -0
- package/src/styles/unstable.css +1 -0
- package/src/types.ts +2 -8
- package/src/unstable/index.ts +3 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/RangeSlider/UniversalSlider.tsx"],"names":["React","Touch","getClassName","classNames","rescale","withAdaptivity","useExternRef","usePlatform","UniversalSliderDumb","min","max","step","value","defaultValue","onChange","getRootRef","sizeY","disabled","restProps","platform","start","end","isRange","gesture","useRef","dragging","startX","containerWidth","current","container","thumbStart","thumbEnd","offsetToValue","absolute","updateRange","nextValue","snapDirection","pos","target","Math","abs","onStart","e","boundingRect","getBoundingClientRect","width","absolutePosition","left","originalEvent","stopPropagation","onMove","shiftX","preventDefault","onEnd","toPercent","v","draggerStyle","join","UniversalSlider"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/RangeSlider/UniversalSlider.tsx"],"names":["React","Touch","getClassName","classNames","rescale","withAdaptivity","useExternRef","usePlatform","UniversalSliderDumb","min","max","step","value","defaultValue","onChange","getRootRef","sizeY","disabled","restProps","platform","start","end","isRange","gesture","useRef","dragging","startX","containerWidth","current","container","thumbStart","thumbEnd","offsetToValue","absolute","updateRange","nextValue","snapDirection","pos","target","Math","abs","onStart","e","boundingRect","getBoundingClientRect","width","absolutePosition","left","originalEvent","stopPropagation","onMove","shiftX","preventDefault","onEnd","toPercent","v","draggerStyle","join","UniversalSlider"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Touch, TouchEvent, TouchEventHandler } from '../Touch/Touch';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { HasRootRef } from '../../types';\nimport { rescale } from '../../helpers/math';\nimport { withAdaptivity, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport '../Slider/Slider.css';\n\nexport type UniversalValue = [number | null, number];\n\nexport interface UniversalSliderProps<Value> extends\n HasRootRef<HTMLDivElement>,\n Omit<React.HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'>,\n AdaptivityProps {\n min?: number;\n max?: number;\n step?: number;\n value?: Value;\n defaultValue?: Value;\n disabled?: boolean;\n onChange?(value: Value, e: TouchEvent): void;\n}\n\nconst UniversalSliderDumb: React.FC<UniversalSliderProps<UniversalValue>> = ({\n min, max, step,\n value, defaultValue, onChange,\n getRootRef,\n sizeY,\n disabled,\n ...restProps\n}) => {\n const platform = usePlatform();\n const [start, end] = value;\n const isRange = start != null;\n const gesture = React.useRef({\n dragging: false as false | 'start' | 'end',\n startX: 0,\n containerWidth: 0,\n }).current;\n const container = useExternRef(getRootRef);\n const thumbStart = React.useRef<HTMLDivElement>();\n const thumbEnd = React.useRef<HTMLDivElement>();\n\n const offsetToValue = (absolute: number) => {\n return rescale(absolute, [0, gesture.containerWidth], [min, max], { step });\n };\n\n const updateRange = (nextValue: number): UniversalValue => {\n if (start == null) {\n return [null, nextValue];\n }\n\n const { dragging } = gesture;\n if (dragging === 'start') {\n if (nextValue > end) {\n // \"перехватиться\", если перетянули за конец\n gesture.dragging = 'end';\n return [end, nextValue];\n }\n return [nextValue, end];\n }\n if (dragging === 'end') {\n if (nextValue < start) {\n // \"перехватиться\", если перетянули за начало\n gesture.dragging = 'start';\n return [nextValue, start];\n }\n return [start, nextValue];\n }\n\n return value;\n };\n\n const snapDirection = (pos: number, target: EventTarget) => {\n if (target === thumbStart.current) {\n return 'start';\n }\n if (target === thumbEnd.current) {\n return 'end';\n }\n return Math.abs(start - pos) <= Math.abs(end - pos) ? 'start' : 'end';\n };\n\n const onStart: TouchEventHandler = (e: TouchEvent) => {\n const boundingRect = container.current.getBoundingClientRect();\n gesture.containerWidth = boundingRect.width;\n\n const absolutePosition = e.startX - boundingRect.left;\n const pos = offsetToValue(absolutePosition);\n gesture.dragging = snapDirection(pos, e.originalEvent.target);\n gesture.startX = absolutePosition;\n\n onChange(updateRange(pos), e);\n e.originalEvent.stopPropagation();\n };\n\n const onMove: TouchEventHandler = (e: TouchEvent) => {\n onChange(updateRange(offsetToValue(gesture.startX + (e.shiftX || 0))), e);\n\n e.originalEvent.stopPropagation();\n e.originalEvent.preventDefault();\n };\n\n const onEnd: TouchEventHandler = (e) => {\n gesture.dragging = false;\n e.originalEvent.stopPropagation();\n };\n\n const toPercent = (v: number) => (v - min) / (max - min) * 100;\n const draggerStyle = isRange ? {\n width: `${toPercent(end) - toPercent(start)}%`,\n left: `${toPercent(start)}%`,\n } : {\n width: `${toPercent(end)}%`,\n };\n\n return (\n <Touch\n data-value={isRange ? value.join(',') : value}\n {...restProps}\n {...(disabled ? {} : { onStart, onMove, onEnd })}\n vkuiClass={classNames(\n getClassName('Slider', platform),\n `Slider--sizeY-${sizeY}`,\n disabled && 'Slider--disabled',\n )}\n >\n <div ref={container} vkuiClass=\"Slider__in\">\n <div vkuiClass=\"Slider__dragger\" style={draggerStyle}>\n {isRange && <span vkuiClass={classNames('Slider__thumb', 'Slider__thumb--start')} ref={thumbStart} />}\n <span vkuiClass={classNames('Slider__thumb', 'Slider__thumb--end')} ref={thumbEnd} />\n </div>\n </div>\n </Touch>\n );\n};\n\nexport const UniversalSlider = withAdaptivity(UniversalSliderDumb, {\n sizeY: true,\n});\n"],"file":"UniversalSlider.js"}
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { HasPlatform } from '../../types';
|
|
3
|
-
import { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';
|
|
4
|
-
import { SplitColContextProps } from '../SplitCol/SplitCol';
|
|
5
|
-
import { ScrollContextInterface } from '../AppRoot/ScrollContext';
|
|
6
2
|
import { NavIdProps } from '../../lib/getNavId';
|
|
7
3
|
import './Root.css';
|
|
8
|
-
export interface RootProps extends React.HTMLAttributes<HTMLDivElement>,
|
|
4
|
+
export interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {
|
|
9
5
|
activeView: string;
|
|
10
6
|
onTransition?(params: {
|
|
11
7
|
isBack: boolean;
|
|
@@ -24,30 +20,12 @@ export interface RootProps extends React.HTMLAttributes<HTMLDivElement>, HasPlat
|
|
|
24
20
|
* Свойство для отрисовки `ModalRoot`.
|
|
25
21
|
*/
|
|
26
22
|
modal?: React.ReactNode;
|
|
27
|
-
/**
|
|
28
|
-
* @ignore
|
|
29
|
-
*/
|
|
30
|
-
splitCol?: SplitColContextProps;
|
|
31
|
-
/**
|
|
32
|
-
* @ignore
|
|
33
|
-
*/
|
|
34
|
-
configProvider?: ConfigProviderContextInterface;
|
|
35
|
-
/**
|
|
36
|
-
* @ignore
|
|
37
|
-
*/
|
|
38
|
-
scroll?: ScrollContextInterface;
|
|
39
23
|
}
|
|
40
|
-
export declare type AnimationEndCallback = (e?: AnimationEvent) => void;
|
|
41
24
|
export interface RootState {
|
|
42
25
|
activeView: string;
|
|
43
|
-
prevView: string;
|
|
44
|
-
nextView: string;
|
|
45
|
-
visibleViews: [string] | [string, string];
|
|
46
|
-
isBack: boolean;
|
|
47
|
-
scrolls: {
|
|
48
|
-
[index: string]: number;
|
|
49
|
-
};
|
|
50
26
|
transition: boolean;
|
|
27
|
+
isBack?: boolean;
|
|
28
|
+
prevView?: string;
|
|
51
29
|
}
|
|
52
|
-
declare const
|
|
53
|
-
export default
|
|
30
|
+
declare const Root: React.FC<RootProps>;
|
|
31
|
+
export default Root;
|
|
@@ -1,232 +1,177 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
|
|
4
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
5
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
6
|
-
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
|
7
|
-
import _inherits from "@babel/runtime/helpers/inherits";
|
|
8
|
-
import _createSuper from "@babel/runtime/helpers/createSuper";
|
|
9
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
10
|
-
var _excluded = ["popout", "modal", "platform", "splitCol", "configProvider", "activeView", "onTransition", "window", "document", "scroll", "nav"];
|
|
4
|
+
var _excluded = ["popout", "modal", "children", "activeView", "onTransition", "nav"];
|
|
11
5
|
import { createScopedElement } from "../../lib/jsxRuntime";
|
|
12
6
|
import * as React from 'react';
|
|
13
7
|
import { classNames } from "../../lib/classNames";
|
|
14
8
|
import { getClassName } from "../../helpers/getClassName";
|
|
15
|
-
import {
|
|
16
|
-
import { ANDROID, VKCOM } from "../../lib/platform";
|
|
17
|
-
import { withPlatform } from "../../hoc/withPlatform";
|
|
18
|
-
import { withContext } from "../../hoc/withContext";
|
|
9
|
+
import { IOS } from "../../lib/platform";
|
|
19
10
|
import { ConfigProviderContext } from "../ConfigProvider/ConfigProviderContext";
|
|
20
11
|
import { SplitColContext } from "../SplitCol/SplitCol";
|
|
21
12
|
import { AppRootPortal } from "../AppRoot/AppRootPortal";
|
|
22
|
-
import { canUseDOM, withDOM } from "../../lib/dom";
|
|
23
13
|
import { ScrollContext } from "../AppRoot/ScrollContext";
|
|
24
14
|
import { getNavId } from "../../lib/getNavId";
|
|
25
15
|
import { warnOnce } from "../../lib/warnOnce";
|
|
16
|
+
import { useDOM } from "../../lib/dom";
|
|
17
|
+
import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
|
|
18
|
+
import { useTimeout } from "../../hooks/useTimeout";
|
|
19
|
+
import { usePlatform } from "../../hooks/usePlatform";
|
|
26
20
|
var warn = warnOnce('Root');
|
|
27
21
|
|
|
28
|
-
var Root =
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
22
|
+
var Root = function Root(_ref) {
|
|
23
|
+
var _ref$popout = _ref.popout,
|
|
24
|
+
popout = _ref$popout === void 0 ? null : _ref$popout,
|
|
25
|
+
modal = _ref.modal,
|
|
26
|
+
children = _ref.children,
|
|
27
|
+
_activeView = _ref.activeView,
|
|
28
|
+
onTransition = _ref.onTransition,
|
|
29
|
+
nav = _ref.nav,
|
|
30
|
+
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
31
|
+
|
|
32
|
+
var scroll = React.useContext(ScrollContext);
|
|
33
|
+
var platform = usePlatform();
|
|
34
|
+
|
|
35
|
+
var _useDOM = useDOM(),
|
|
36
|
+
document = _useDOM.document;
|
|
37
|
+
|
|
38
|
+
var scrolls = React.useRef({}).current;
|
|
39
|
+
var viewNodes = React.useRef({}).current;
|
|
40
|
+
|
|
41
|
+
var _React$useContext = React.useContext(ConfigProviderContext),
|
|
42
|
+
_React$useContext$tra = _React$useContext.transitionMotionEnabled,
|
|
43
|
+
transitionMotionEnabled = _React$useContext$tra === void 0 ? true : _React$useContext$tra;
|
|
44
|
+
|
|
45
|
+
var _React$useContext2 = React.useContext(SplitColContext),
|
|
46
|
+
animate = _React$useContext2.animate;
|
|
47
|
+
|
|
48
|
+
var disableAnimation = !transitionMotionEnabled || !animate;
|
|
49
|
+
var views = React.Children.toArray(children);
|
|
50
|
+
|
|
51
|
+
var _React$useState = React.useState({
|
|
52
|
+
activeView: _activeView,
|
|
53
|
+
transition: false
|
|
54
|
+
}),
|
|
55
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
56
|
+
_React$useState2$ = _React$useState2[0],
|
|
57
|
+
prevView = _React$useState2$.prevView,
|
|
58
|
+
activeView = _React$useState2$.activeView,
|
|
59
|
+
transition = _React$useState2$.transition,
|
|
60
|
+
isBack = _React$useState2$.isBack,
|
|
61
|
+
_setState = _React$useState2[1];
|
|
62
|
+
|
|
63
|
+
var transitionTo = function transitionTo(panel) {
|
|
64
|
+
if (panel !== activeView) {
|
|
65
|
+
var viewIds = views.map(function (view) {
|
|
66
|
+
return getNavId(view.props, warn);
|
|
67
|
+
});
|
|
49
68
|
|
|
50
|
-
|
|
51
|
-
activeView: nextView,
|
|
52
|
-
prevView: null,
|
|
53
|
-
nextView: null,
|
|
54
|
-
visibleViews: [nextView],
|
|
55
|
-
transition: false,
|
|
56
|
-
isBack: undefined
|
|
57
|
-
}, function () {
|
|
58
|
-
_this.props.scroll.scrollTo(0, isBack ? _this.state.scrolls[_this.state.activeView] : 0);
|
|
69
|
+
var _isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);
|
|
59
70
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
71
|
+
_setState({
|
|
72
|
+
activeView: panel,
|
|
73
|
+
prevView: activeView,
|
|
74
|
+
transition: true,
|
|
75
|
+
isBack: _isBack
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
};
|
|
68
79
|
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
isBack: undefined,
|
|
75
|
-
scrolls: {},
|
|
80
|
+
var finishTransition = function finishTransition() {
|
|
81
|
+
return _setState({
|
|
82
|
+
activeView: activeView,
|
|
83
|
+
prevView: prevView,
|
|
84
|
+
isBack: isBack,
|
|
76
85
|
transition: false
|
|
77
|
-
};
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
return getNavId(view.props, warn);
|
|
100
|
-
}).find(function (id) {
|
|
101
|
-
return id === prevProps.activeView || id === _this2.props.activeView;
|
|
102
|
-
});
|
|
103
|
-
var isBack = firstLayerId === this.props.activeView;
|
|
104
|
-
this.blurActiveElement();
|
|
105
|
-
var nextView = this.props.activeView;
|
|
106
|
-
var prevView = prevProps.activeView;
|
|
107
|
-
this.setState({
|
|
108
|
-
scrolls: _objectSpread(_objectSpread({}, this.state.scrolls), {}, _defineProperty({}, prevProps.activeView, pageYOffset)),
|
|
109
|
-
transition: true,
|
|
110
|
-
activeView: null,
|
|
111
|
-
nextView: nextView,
|
|
112
|
-
prevView: prevView,
|
|
113
|
-
visibleViews: [nextView, prevView],
|
|
114
|
-
isBack: isBack
|
|
115
|
-
});
|
|
116
|
-
} // Начался переход
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
if (!prevState.transition && this.state.transition) {
|
|
120
|
-
var prevViewElement = this.viewNodes[this.state.prevView];
|
|
121
|
-
var nextViewElement = this.viewNodes[this.state.nextView];
|
|
122
|
-
|
|
123
|
-
var setPanelScroll = function setPanelScroll(e, scroll) {
|
|
124
|
-
// eslint-disable-next-line no-restricted-properties
|
|
125
|
-
var pan = e.querySelector('[data-vkui-active-panel=true]');
|
|
126
|
-
pan && (pan.scrollTop = scroll);
|
|
127
|
-
};
|
|
128
|
-
|
|
129
|
-
setPanelScroll(prevViewElement, this.state.scrolls[this.state.prevView]);
|
|
130
|
-
|
|
131
|
-
if (this.state.isBack) {
|
|
132
|
-
setPanelScroll(nextViewElement, this.state.scrolls[this.state.nextView]);
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
this.waitAnimationFinish(this.state.isBack ? prevViewElement : nextViewElement, this.onAnimationEnd);
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
|
-
}, {
|
|
139
|
-
key: "shouldDisableTransitionMotion",
|
|
140
|
-
value: function shouldDisableTransitionMotion() {
|
|
141
|
-
return this.props.configProvider.transitionMotionEnabled === false || !this.props.splitCol.animate;
|
|
142
|
-
}
|
|
143
|
-
}, {
|
|
144
|
-
key: "waitAnimationFinish",
|
|
145
|
-
value: function waitAnimationFinish(elem, eventHandler) {
|
|
146
|
-
if (this.shouldDisableTransitionMotion()) {
|
|
147
|
-
eventHandler();
|
|
148
|
-
return;
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
if (animationEvent.supported) {
|
|
152
|
-
elem.removeEventListener(animationEvent.name, eventHandler);
|
|
153
|
-
elem.addEventListener(animationEvent.name, eventHandler);
|
|
154
|
-
} else {
|
|
155
|
-
clearTimeout(this.animationFinishTimeout);
|
|
156
|
-
this.animationFinishTimeout = setTimeout(eventHandler.bind(this), this.props.platform === ANDROID || this.props.platform === VKCOM ? 300 : 600);
|
|
157
|
-
}
|
|
158
|
-
}
|
|
159
|
-
}, {
|
|
160
|
-
key: "blurActiveElement",
|
|
161
|
-
value: function blurActiveElement() {
|
|
162
|
-
if (canUseDOM && this.document.activeElement) {
|
|
163
|
-
this.document.activeElement.blur();
|
|
164
|
-
}
|
|
86
|
+
});
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
useIsomorphicLayoutEffect(function () {
|
|
90
|
+
var _document$activeEleme;
|
|
91
|
+
|
|
92
|
+
(_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.blur();
|
|
93
|
+
}, [!!popout, activeView]); // Нужен переход
|
|
94
|
+
|
|
95
|
+
useIsomorphicLayoutEffect(function () {
|
|
96
|
+
return transitionTo(_activeView);
|
|
97
|
+
}, [_activeView]); // scroll restoration
|
|
98
|
+
|
|
99
|
+
useIsomorphicLayoutEffect(function () {
|
|
100
|
+
if (transition) {
|
|
101
|
+
// save scroll
|
|
102
|
+
scrolls[prevView] = scroll.getScroll().y;
|
|
103
|
+
setPanelScroll(viewNodes[prevView], scrolls[prevView]);
|
|
104
|
+
isBack && setPanelScroll(viewNodes[activeView], scrolls[activeView]);
|
|
105
|
+
} else if (prevView) {
|
|
106
|
+
// Закончился переход
|
|
107
|
+
scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);
|
|
165
108
|
}
|
|
166
|
-
},
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
platform = _this$props.platform,
|
|
175
|
-
splitCol = _this$props.splitCol,
|
|
176
|
-
configProvider = _this$props.configProvider,
|
|
177
|
-
_1 = _this$props.activeView,
|
|
178
|
-
onTransition = _this$props.onTransition,
|
|
179
|
-
window = _this$props.window,
|
|
180
|
-
document = _this$props.document,
|
|
181
|
-
scroll = _this$props.scroll,
|
|
182
|
-
nav = _this$props.nav,
|
|
183
|
-
restProps = _objectWithoutProperties(_this$props, _excluded);
|
|
184
|
-
|
|
185
|
-
var _this$state = this.state,
|
|
186
|
-
transition = _this$state.transition,
|
|
187
|
-
isBack = _this$state.isBack,
|
|
188
|
-
prevView = _this$state.prevView,
|
|
189
|
-
activeView = _this$state.activeView,
|
|
190
|
-
nextView = _this$state.nextView;
|
|
191
|
-
var Views = React.Children.toArray(this.props.children).filter(function (view) {
|
|
192
|
-
return _this3.state.visibleViews.includes(getNavId(view.props, warn));
|
|
109
|
+
}, [transition]); // onTransition
|
|
110
|
+
|
|
111
|
+
useIsomorphicLayoutEffect(function () {
|
|
112
|
+
if (!transition && prevView) {
|
|
113
|
+
onTransition && onTransition({
|
|
114
|
+
isBack: isBack,
|
|
115
|
+
from: prevView,
|
|
116
|
+
to: activeView
|
|
193
117
|
});
|
|
194
|
-
var baseClassName = getClassName('Root', platform);
|
|
195
|
-
var disableAnimation = this.shouldDisableTransitionMotion();
|
|
196
|
-
return createScopedElement("div", _extends({}, restProps, {
|
|
197
|
-
vkuiClass: classNames(baseClassName, {
|
|
198
|
-
'Root--transition': !disableAnimation && transition,
|
|
199
|
-
'Root--no-motion': disableAnimation
|
|
200
|
-
})
|
|
201
|
-
}), Views.map(function (view) {
|
|
202
|
-
var viewId = getNavId(view.props, warn);
|
|
203
|
-
return createScopedElement("div", {
|
|
204
|
-
key: viewId,
|
|
205
|
-
ref: function ref(e) {
|
|
206
|
-
return _this3.viewNodes[viewId] = e;
|
|
207
|
-
},
|
|
208
|
-
vkuiClass: classNames('Root__view', {
|
|
209
|
-
'Root__view--hide-back': viewId === prevView && isBack,
|
|
210
|
-
'Root__view--hide-forward': viewId === prevView && !isBack,
|
|
211
|
-
'Root__view--show-back': viewId === nextView && isBack,
|
|
212
|
-
'Root__view--show-forward': viewId === nextView && !isBack,
|
|
213
|
-
'Root__view--active': viewId === activeView
|
|
214
|
-
})
|
|
215
|
-
}, view);
|
|
216
|
-
}), createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
|
|
217
|
-
vkuiClass: "Root__popout"
|
|
218
|
-
}, popout), !!modal && createScopedElement("div", {
|
|
219
|
-
vkuiClass: "Root__modal"
|
|
220
|
-
}, modal)));
|
|
221
118
|
}
|
|
222
|
-
}]);
|
|
119
|
+
}, [transition]);
|
|
120
|
+
var fallbackTransition = useTimeout(finishTransition, platform === IOS ? 600 : 300);
|
|
121
|
+
React.useEffect(function () {
|
|
122
|
+
if (!transition) {
|
|
123
|
+
fallbackTransition.clear();
|
|
124
|
+
return;
|
|
125
|
+
}
|
|
223
126
|
|
|
224
|
-
|
|
225
|
-
}
|
|
127
|
+
disableAnimation ? finishTransition() : fallbackTransition.set();
|
|
128
|
+
}, [transition]);
|
|
226
129
|
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
130
|
+
var onAnimationEnd = function onAnimationEnd(e) {
|
|
131
|
+
if (['vkui-root-android-animation-hide-back', 'vkui-root-android-animation-show-forward', 'vkui-root-ios-animation-hide-back', 'vkui-root-ios-animation-show-forward'].includes(e.animationName)) {
|
|
132
|
+
finishTransition();
|
|
133
|
+
}
|
|
134
|
+
};
|
|
135
|
+
|
|
136
|
+
return createScopedElement("div", _extends({}, restProps, {
|
|
137
|
+
vkuiClass: classNames(getClassName('Root', platform), {
|
|
138
|
+
'Root--transition': !disableAnimation && transition,
|
|
139
|
+
'Root--no-motion': disableAnimation
|
|
140
|
+
})
|
|
141
|
+
}), views.map(function (view) {
|
|
142
|
+
var viewId = getNavId(view.props, warn);
|
|
143
|
+
|
|
144
|
+
if (viewId !== activeView && !(transition && viewId === prevView)) {
|
|
145
|
+
return null;
|
|
146
|
+
}
|
|
230
147
|
|
|
231
|
-
|
|
148
|
+
var isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);
|
|
149
|
+
return createScopedElement("div", {
|
|
150
|
+
key: viewId,
|
|
151
|
+
ref: function ref(e) {
|
|
152
|
+
return viewNodes[viewId] = e;
|
|
153
|
+
},
|
|
154
|
+
onAnimationEnd: isTransitionTarget ? onAnimationEnd : null,
|
|
155
|
+
vkuiClass: classNames('Root__view', {
|
|
156
|
+
'Root__view--hide-back': transition && viewId === prevView && isBack,
|
|
157
|
+
'Root__view--hide-forward': transition && viewId === prevView && !isBack,
|
|
158
|
+
'Root__view--show-back': transition && viewId === activeView && isBack,
|
|
159
|
+
'Root__view--show-forward': transition && viewId === activeView && !isBack,
|
|
160
|
+
'Root__view--active': !transition && viewId === activeView
|
|
161
|
+
})
|
|
162
|
+
}, view);
|
|
163
|
+
}), createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
|
|
164
|
+
vkuiClass: "Root__popout"
|
|
165
|
+
}, popout), !!modal && createScopedElement("div", {
|
|
166
|
+
vkuiClass: "Root__modal"
|
|
167
|
+
}, modal)));
|
|
168
|
+
};
|
|
169
|
+
|
|
170
|
+
export default Root;
|
|
171
|
+
|
|
172
|
+
function setPanelScroll(e, scroll) {
|
|
173
|
+
// eslint-disable-next-line no-restricted-properties
|
|
174
|
+
var pan = e.querySelector('[data-vkui-active-panel=true]');
|
|
175
|
+
pan && (pan.scrollTop = scroll);
|
|
176
|
+
}
|
|
232
177
|
//# sourceMappingURL=Root.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","animationEvent","ANDROID","VKCOM","withPlatform","withContext","ConfigProviderContext","SplitColContext","AppRootPortal","canUseDOM","withDOM","ScrollContext","getNavId","warnOnce","warn","Root","props","e","includes","animationName","isBack","state","prevView","nextView","setState","activeView","visibleViews","transition","undefined","scroll","scrollTo","scrolls","onTransition","from","to","document","prevProps","prevState","popout","blurActiveElement","pageYOffset","getScroll","y","firstLayerId","concat","children","map","view","find","id","prevViewElement","viewNodes","nextViewElement","setPanelScroll","pan","querySelector","scrollTop","waitAnimationFinish","onAnimationEnd","configProvider","transitionMotionEnabled","splitCol","animate","elem","eventHandler","shouldDisableTransitionMotion","supported","removeEventListener","name","addEventListener","clearTimeout","animationFinishTimeout","setTimeout","bind","platform","activeElement","blur","modal","_1","window","nav","restProps","Views","Children","toArray","filter","baseClassName","disableAnimation","viewId","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { animationEvent } from '../../lib/supportEvents';\nimport { ANDROID, VKCOM } from '../../lib/platform';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { withContext } from '../../hoc/withContext';\nimport { HasPlatform } from '../../types';\nimport { ConfigProviderContext, ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { SplitColContextProps, SplitColContext } from '../SplitCol/SplitCol';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { canUseDOM, DOMProps, withDOM } from '../../lib/dom';\nimport { ScrollContext, ScrollContextInterface } from '../AppRoot/ScrollContext';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport './Root.css';\n\nconst warn = warnOnce('Root');\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, HasPlatform, NavIdProps {\n activeView: string;\n onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n /**\n * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n *\n * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n */\n popout?: React.ReactNode;\n /**\n * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n *\n * Свойство для отрисовки `ModalRoot`.\n */\n modal?: React.ReactNode;\n /**\n * @ignore\n */\n splitCol?: SplitColContextProps;\n /**\n * @ignore\n */\n configProvider?: ConfigProviderContextInterface;\n /**\n * @ignore\n */\n scroll?: ScrollContextInterface;\n}\n\nexport type AnimationEndCallback = (e?: AnimationEvent) => void;\n\nexport interface RootState {\n activeView: string;\n prevView: string;\n nextView: string;\n visibleViews: [string] | [string, string];\n isBack: boolean;\n scrolls: {\n [index: string]: number;\n };\n transition: boolean;\n}\n\nclass Root extends React.Component<RootProps & DOMProps, RootState> {\n constructor(props: RootProps) {\n super(props);\n\n this.state = {\n activeView: props.activeView,\n prevView: null,\n nextView: null,\n visibleViews: [props.activeView],\n isBack: undefined,\n scrolls: {},\n transition: false,\n };\n }\n\n static defaultProps: Partial<RootProps> = {\n popout: null,\n };\n\n private animationFinishTimeout: ReturnType<typeof setTimeout>;\n private viewNodes: { [id: string]: HTMLElement } = {};\n\n get document() {\n return this.props.document;\n }\n\n componentDidUpdate(prevProps: RootProps, prevState: RootState) {\n if (this.props.popout && !prevProps.popout) {\n this.blurActiveElement();\n }\n\n // Нужен переход\n if (this.props.activeView !== prevProps.activeView) {\n let pageYOffset = this.props.scroll.getScroll().y;\n const firstLayerId = [].concat(prevProps.children)\n .map((view) => getNavId(view.props, warn))\n .find((id) => id === prevProps.activeView || id === this.props.activeView);\n const isBack = firstLayerId === this.props.activeView;\n\n this.blurActiveElement();\n\n const nextView = this.props.activeView;\n const prevView = prevProps.activeView;\n\n this.setState({\n scrolls: {\n ...this.state.scrolls,\n [prevProps.activeView]: pageYOffset,\n },\n transition: true,\n activeView: null,\n nextView,\n prevView,\n visibleViews: [nextView, prevView],\n isBack,\n });\n }\n\n // Начался переход\n if (!prevState.transition && this.state.transition) {\n const prevViewElement = this.viewNodes[this.state.prevView];\n const nextViewElement = this.viewNodes[this.state.nextView];\n const setPanelScroll = (e: HTMLElement, scroll: number) => {\n // eslint-disable-next-line no-restricted-properties\n const pan: HTMLElement | null = e.querySelector('[data-vkui-active-panel=true]');\n pan && (pan.scrollTop = scroll);\n };\n\n setPanelScroll(prevViewElement, this.state.scrolls[this.state.prevView]);\n\n if (this.state.isBack) {\n setPanelScroll(nextViewElement, this.state.scrolls[this.state.nextView]);\n }\n this.waitAnimationFinish(this.state.isBack ? prevViewElement : nextViewElement, this.onAnimationEnd);\n }\n }\n\n shouldDisableTransitionMotion(): boolean {\n return this.props.configProvider.transitionMotionEnabled === false ||\n !this.props.splitCol.animate;\n }\n\n waitAnimationFinish(elem: HTMLElement, eventHandler: AnimationEndCallback) {\n if (this.shouldDisableTransitionMotion()) {\n eventHandler();\n return;\n }\n\n if (animationEvent.supported) {\n elem.removeEventListener(animationEvent.name, eventHandler);\n elem.addEventListener(animationEvent.name, eventHandler);\n } else {\n clearTimeout(this.animationFinishTimeout);\n this.animationFinishTimeout = setTimeout(eventHandler.bind(this), this.props.platform === ANDROID || this.props.platform === VKCOM ? 300 : 600);\n }\n }\n\n onAnimationEnd: AnimationEndCallback = (e?: AnimationEvent) => {\n if (!e || [\n 'vkui-root-android-animation-hide-back',\n 'vkui-root-android-animation-show-forward',\n 'vkui-root-ios-animation-hide-back',\n 'vkui-root-ios-animation-show-forward',\n ].includes(e.animationName)) {\n const isBack = this.state.isBack;\n const prevView = this.state.prevView;\n const nextView = this.state.nextView;\n this.setState({\n activeView: nextView,\n prevView: null,\n nextView: null,\n visibleViews: [nextView],\n transition: false,\n isBack: undefined,\n }, () => {\n this.props.scroll.scrollTo(0, isBack ? this.state.scrolls[this.state.activeView] : 0);\n this.props.onTransition && this.props.onTransition({ isBack, from: prevView, to: nextView });\n });\n }\n };\n\n blurActiveElement() {\n if (canUseDOM && this.document.activeElement) {\n (this.document.activeElement as HTMLElement).blur();\n }\n }\n\n render() {\n const {\n popout, modal, platform,\n splitCol, configProvider, activeView: _1, onTransition,\n window, document, scroll, nav,\n ...restProps\n } = this.props;\n const { transition, isBack, prevView, activeView, nextView } = this.state;\n\n const Views = React.Children.toArray(this.props.children).filter((view: React.ReactElement) => {\n return this.state.visibleViews.includes(getNavId(view.props, warn));\n });\n\n const baseClassName = getClassName('Root', platform);\n const disableAnimation = this.shouldDisableTransitionMotion();\n\n return (\n <div {...restProps} vkuiClass={classNames(baseClassName, {\n 'Root--transition': !disableAnimation && transition,\n 'Root--no-motion': disableAnimation,\n })}>\n {Views.map((view: React.ReactElement) => {\n const viewId = getNavId(view.props, warn);\n return (\n <div key={viewId} ref={(e) => this.viewNodes[viewId] = e} vkuiClass={classNames('Root__view', {\n 'Root__view--hide-back': viewId === prevView && isBack,\n 'Root__view--hide-forward': viewId === prevView && !isBack,\n 'Root__view--show-back': viewId === nextView && isBack,\n 'Root__view--show-forward': viewId === nextView && !isBack,\n 'Root__view--active': viewId === activeView,\n })}>\n {view}\n </div>\n );\n })}\n <AppRootPortal>\n {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n </AppRootPortal>\n </div>\n );\n }\n}\n\nexport default withContext(withContext(withContext(\n withPlatform(withDOM<RootProps>(Root)),\n SplitColContext,\n 'splitCol',\n), ConfigProviderContext, 'configProvider'), ScrollContext, 'scroll');\n"],"file":"Root.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","finishTransition","activeElement","blur","getScroll","y","setPanelScroll","scrollTo","from","to","fallbackTransition","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","pan","querySelector","scrollTop"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { IOS } from '../../lib/platform';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { SplitColContext } from '../SplitCol/SplitCol';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Root.css';\n\nconst warn = warnOnce('Root');\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n activeView: string;\n onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n /**\n * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n *\n * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n */\n popout?: React.ReactNode;\n /**\n * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n *\n * Свойство для отрисовки `ModalRoot`.\n */\n modal?: React.ReactNode;\n}\n\nexport interface RootState {\n activeView: string;\n transition: boolean;\n isBack?: boolean;\n prevView?: string;\n}\n\nconst Root: React.FC<RootProps> = ({\n popout = null, modal, children,\n activeView: _activeView, onTransition,\n nav,\n ...restProps\n}) => {\n const scroll = React.useContext(ScrollContext);\n const platform = usePlatform();\n const { document } = useDOM();\n const scrolls = React.useRef<Record<string, number>>({}).current;\n const viewNodes = React.useRef<Record<string, HTMLElement>>({}).current;\n\n const { transitionMotionEnabled = true } = React.useContext(ConfigProviderContext);\n const { animate } = React.useContext(SplitColContext);\n const disableAnimation = !transitionMotionEnabled || !animate;\n\n const views = React.Children.toArray(children) as React.ReactElement[];\n\n const [{ prevView, activeView, transition, isBack }, _setState] = React.useState<RootState>({\n activeView: _activeView,\n transition: false,\n });\n const transitionTo = (panel: string) => {\n if (panel !== activeView) {\n const viewIds = views.map((view) => getNavId(view.props, warn));\n const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n _setState({ activeView: panel, prevView: activeView, transition: true, isBack });\n }\n };\n const finishTransition = () => _setState({ activeView, prevView, isBack, transition: false });\n\n useIsomorphicLayoutEffect(() => {\n (document.activeElement as HTMLElement)?.blur();\n }, [!!popout, activeView]);\n\n // Нужен переход\n useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n // scroll restoration\n useIsomorphicLayoutEffect(() => {\n if (transition) {\n // save scroll\n scrolls[prevView] = scroll.getScroll().y;\n setPanelScroll(viewNodes[prevView], scrolls[prevView]);\n isBack && setPanelScroll(viewNodes[activeView], scrolls[activeView]);\n } else if (prevView) {\n // Закончился переход\n scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n }\n }, [transition]);\n // onTransition\n useIsomorphicLayoutEffect(() => {\n if (!transition && prevView) {\n onTransition && onTransition({ isBack, from: prevView, to: activeView });\n }\n }, [transition]);\n\n const fallbackTransition = useTimeout(finishTransition, platform === IOS ? 600 : 300);\n React.useEffect(() => {\n if (!transition) {\n fallbackTransition.clear();\n return;\n }\n disableAnimation ? finishTransition() : fallbackTransition.set();\n }, [transition]);\n\n const onAnimationEnd = (e: React.AnimationEvent) => {\n if ([\n 'vkui-root-android-animation-hide-back',\n 'vkui-root-android-animation-show-forward',\n 'vkui-root-ios-animation-hide-back',\n 'vkui-root-ios-animation-show-forward',\n ].includes(e.animationName)) {\n finishTransition();\n }\n };\n\n return (\n <div {...restProps} vkuiClass={classNames(getClassName('Root', platform), {\n 'Root--transition': !disableAnimation && transition,\n 'Root--no-motion': disableAnimation,\n })}>\n {views.map((view) => {\n const viewId = getNavId(view.props, warn);\n if (viewId !== activeView && !(transition && viewId === prevView)) {\n return null;\n }\n const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);\n return (\n <div\n key={viewId}\n ref={(e) => viewNodes[viewId] = e}\n onAnimationEnd={isTransitionTarget ? onAnimationEnd : null}\n vkuiClass={classNames('Root__view', {\n 'Root__view--hide-back': transition && viewId === prevView && isBack,\n 'Root__view--hide-forward': transition && viewId === prevView && !isBack,\n 'Root__view--show-back': transition && viewId === activeView && isBack,\n 'Root__view--show-forward': transition && viewId === activeView && !isBack,\n 'Root__view--active': !transition && viewId === activeView,\n })}\n >{view}</div>\n );\n })}\n <AppRootPortal>\n {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n </AppRootPortal>\n </div>\n );\n};\n\nexport default Root;\n\nfunction setPanelScroll(e: HTMLElement, scroll: number) {\n // eslint-disable-next-line no-restricted-properties\n const pan: HTMLElement | null = e.querySelector('[data-vkui-active-panel=true]');\n pan && (pan.scrollTop = scroll);\n}\n"],"file":"Root.js"}
|
|
@@ -9,7 +9,7 @@ import { withPlatform } from "../../hoc/withPlatform";
|
|
|
9
9
|
import { getClassName } from "../../helpers/getClassName";
|
|
10
10
|
import { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from '@vkontakte/icons';
|
|
11
11
|
import { IOS, VKCOM } from "../../lib/platform";
|
|
12
|
-
import Touch from "../Touch/Touch";
|
|
12
|
+
import { Touch } from "../Touch/Touch";
|
|
13
13
|
import { noop } from "../../lib/utils";
|
|
14
14
|
import Text from "../Typography/Text/Text";
|
|
15
15
|
import Title from "../Typography/Title/Title";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"names":["React","classNames","withPlatform","getClassName","Icon16SearchOutline","Icon16Clear","Icon24Cancel","IOS","VKCOM","Touch","noop","Text","Title","Separator","useExternRef","useEnsuredControl","Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","style","inputProps","inputRef","useState","isFocused","setFocused","value","onChange","onFocus","e","onBlur","onCancel","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","useCallback","originalEvent","onIconCancelClickStart","preventDefault","focus","defaultProps","autoComplete"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,YAAT;AACA,SAASC,mBAAT,EAA8BC,WAA9B,EAA2CC,YAA3C,QAA+D,kBAA/D;AACA,SAASC,GAAT,EAAcC,KAAd;AAEA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"names":["React","classNames","withPlatform","getClassName","Icon16SearchOutline","Icon16Clear","Icon24Cancel","IOS","VKCOM","Touch","noop","Text","Title","Separator","useExternRef","useEnsuredControl","Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","style","inputProps","inputRef","useState","isFocused","setFocused","value","onChange","onFocus","e","onBlur","onCancel","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","useCallback","originalEvent","onIconCancelClickStart","preventDefault","focus","defaultProps","autoComplete"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from '@vkontakte/icons';\nimport { IOS, VKCOM } from '../../lib/platform';\nimport { HasPlatform, HasRef } from '../../types';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { VKUITouchEvent } from '../../lib/touch';\nimport { noop } from '../../lib/utils';\nimport Text from '../Typography/Text/Text';\nimport Title from '../Typography/Title/Title';\nimport Separator from '../Separator/Separator';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport './Search.css';\n\nexport type InputRef = (element: HTMLInputElement) => void;\n\nexport interface SearchProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement>, HasPlatform {\n /**\n * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n */\n after?: React.ReactNode;\n before?: React.ReactNode;\n icon?: React.ReactNode;\n onIconClick?: (e: VKUITouchEvent) => void;\n defaultValue?: string;\n}\n\nconst Search: React.FC<SearchProps> = ({\n before,\n className,\n defaultValue,\n placeholder,\n after,\n getRef,\n platform,\n icon,\n onIconClick = noop,\n style,\n ...inputProps\n}) => {\n const inputRef = useExternRef(getRef);\n const [isFocused, setFocused] = React.useState(false);\n const [value, onChange] = useEnsuredControl(inputProps, { defaultValue });\n\n const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true);\n inputProps.onFocus && inputProps.onFocus(e);\n };\n\n const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false);\n inputProps.onBlur && inputProps.onBlur(e);\n };\n\n const onCancel = () => {\n // eslint-disable-next-line @typescript-eslint/unbound-method\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value').set;\n nativeInputValueSetter.call(inputRef.current, '');\n\n const ev2 = new Event('input', { bubbles: true });\n inputRef.current.dispatchEvent(ev2);\n };\n\n const onIconClickStart = React.useCallback((e: TouchEvent) => onIconClick(e.originalEvent), [onIconClick]);\n\n const onIconCancelClickStart = React.useCallback((e: TouchEvent) => {\n e.originalEvent.preventDefault();\n inputRef.current.focus();\n onCancel();\n }, [onCancel]);\n\n return (\n <div\n vkuiClass={classNames(getClassName('Search', platform), {\n 'Search--focused': isFocused,\n 'Search--has-value': !!value,\n 'Search--has-after': !!after,\n 'Search--has-icon': !!icon,\n })}\n className={className}\n style={style}\n >\n <div vkuiClass=\"Search__in\">\n <div vkuiClass=\"Search__width\" />\n <label vkuiClass=\"Search__control\">\n <input\n type=\"search\"\n {...inputProps}\n ref={inputRef}\n vkuiClass=\"Search__input\"\n onFocus={onFocus}\n onBlur={onBlur}\n onChange={onChange}\n value={value}\n />\n {platform === IOS && after && <div vkuiClass=\"Search__after-width\">{after}</div>}\n <div vkuiClass=\"Search__placeholder\">\n <div vkuiClass=\"Search__placeholder-in\">\n {before}\n {platform === VKCOM\n ? <Text vkuiClass=\"Search__placeholder-text\" weight=\"regular\">{placeholder}</Text>\n : <Title vkuiClass=\"Search__placeholder-text\" level=\"3\" weight=\"regular\">{placeholder}</Title>\n }\n </div>\n {isFocused && platform === IOS && after && <div vkuiClass=\"Search__after-width\">{after}</div>}\n </div>\n </label>\n <div vkuiClass=\"Search__after\" onClick={onCancel}>\n <div vkuiClass=\"Search__icons\">\n {icon &&\n <Touch onStart={onIconClickStart} vkuiClass=\"Search__icon\">\n {icon}\n </Touch>\n }\n {!!value &&\n <Touch onStart={onIconCancelClickStart} vkuiClass=\"Search__icon\">\n {platform === VKCOM\n ? <Icon24Cancel />\n : <Icon16Clear />\n }\n </Touch>\n }\n </div>\n {platform === IOS && after &&\n <div vkuiClass=\"Search__after-in\">{after}</div>\n }\n </div>\n </div>\n {platform === VKCOM && <Separator vkuiClass=\"Search__separator\" wide />}\n </div>\n );\n};\n\nSearch.defaultProps = {\n autoComplete: 'off',\n defaultValue: '',\n placeholder: 'Поиск',\n after: 'Отмена',\n before: <Icon16SearchOutline />,\n};\n\nexport default withPlatform(Search);\n"],"file":"Search.js"}
|