@fountain-ui/lab 2.0.0-beta.1 → 2.0.0-beta.12
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/build/commonjs/AnimatedY/AnimatedY.js +10 -14
- package/build/commonjs/AnimatedY/AnimatedY.js.map +1 -1
- package/build/commonjs/AnimatedY/AnimatedYProps.js.map +1 -1
- package/build/commonjs/AnimatedY/index.js.map +1 -1
- package/build/commonjs/BottomSheet/BottomSheetNative.js +1 -1
- package/build/commonjs/BottomSheet/BottomSheetNative.js.map +1 -1
- package/build/commonjs/BottomSheet/BottomSheetProps.js.map +1 -1
- package/build/commonjs/BottomSheet/BottomSheetWeb.js +2 -6
- package/build/commonjs/BottomSheet/BottomSheetWeb.js.map +1 -1
- package/build/commonjs/BottomSheet/TransparentBackdrop.js +1 -1
- package/build/commonjs/BottomSheet/TransparentBackdrop.js.map +1 -1
- package/build/commonjs/BottomSheet/index.js.map +1 -1
- package/build/commonjs/BottomSheet/index.native.js.map +1 -1
- package/build/commonjs/Carousel/Carousel.js +137 -0
- package/build/commonjs/Carousel/Carousel.js.map +1 -0
- package/build/commonjs/Carousel/CarouselProps.js.map +1 -1
- package/build/commonjs/Carousel/animation/animationUtils.js +9 -0
- package/build/commonjs/Carousel/animation/animationUtils.js.map +1 -0
- package/build/commonjs/Carousel/animation/createDefaultItemStyle.js +15 -0
- package/build/commonjs/Carousel/animation/createDefaultItemStyle.js.map +1 -0
- package/build/commonjs/Carousel/animation/createDefaultScrollAnimation.js +20 -0
- package/build/commonjs/Carousel/animation/createDefaultScrollAnimation.js.map +1 -0
- package/build/commonjs/Carousel/animation/index.js +40 -0
- package/build/commonjs/Carousel/animation/index.js.map +1 -0
- package/build/commonjs/Carousel/animation/normalItemStyleFactory.js +27 -0
- package/build/commonjs/Carousel/animation/normalItemStyleFactory.js.map +1 -0
- package/build/commonjs/Carousel/animation/parallaxItemStyleFactory.js +65 -0
- package/build/commonjs/Carousel/animation/parallaxItemStyleFactory.js.map +1 -0
- package/build/commonjs/Carousel/components/InternalContext.js +29 -0
- package/build/commonjs/Carousel/components/InternalContext.js.map +1 -0
- package/build/commonjs/Carousel/components/ItemView.js +64 -0
- package/build/commonjs/Carousel/components/ItemView.js.map +1 -0
- package/build/commonjs/Carousel/components/RootView.js +68 -0
- package/build/commonjs/Carousel/components/RootView.js.map +1 -0
- package/build/commonjs/Carousel/components/ScrollViewGesture.js +76 -0
- package/build/commonjs/Carousel/components/ScrollViewGesture.js.map +1 -0
- package/build/commonjs/Carousel/components/index.js +40 -0
- package/build/commonjs/Carousel/components/index.js.map +1 -0
- package/build/commonjs/Carousel/hooks/index.js +64 -0
- package/build/commonjs/Carousel/hooks/index.js.map +1 -0
- package/build/commonjs/Carousel/hooks/useAutoplayController.js +55 -0
- package/build/commonjs/Carousel/hooks/useAutoplayController.js.map +1 -0
- package/build/commonjs/Carousel/hooks/useDimensionChangeReaction.js +23 -0
- package/build/commonjs/Carousel/hooks/useDimensionChangeReaction.js.map +1 -0
- package/build/commonjs/Carousel/hooks/useIndexController.js +70 -0
- package/build/commonjs/Carousel/hooks/useIndexController.js.map +1 -0
- package/build/commonjs/Carousel/hooks/useItemInterpolation.js +63 -0
- package/build/commonjs/Carousel/hooks/useItemInterpolation.js.map +1 -0
- package/build/commonjs/Carousel/hooks/useItemVisibilityStore.js +95 -0
- package/build/commonjs/Carousel/hooks/useItemVisibilityStore.js.map +1 -0
- package/build/commonjs/Carousel/hooks/useLoopedData.js +33 -0
- package/build/commonjs/Carousel/hooks/useLoopedData.js.map +1 -0
- package/build/commonjs/Carousel/hooks/usePagingAnimation.js +124 -0
- package/build/commonjs/Carousel/hooks/usePagingAnimation.js.map +1 -0
- package/build/commonjs/Carousel/index.js +16 -2
- package/build/commonjs/Carousel/index.js.map +1 -1
- package/build/commonjs/Carousel/types.js +7 -0
- package/build/commonjs/Carousel/types.js.map +1 -0
- package/build/commonjs/ComicViewer/ComicViewer.js +16 -11
- package/build/commonjs/ComicViewer/ComicViewer.js.map +1 -1
- package/build/commonjs/ComicViewer/ComicViewerItemProps.js.map +1 -1
- package/build/commonjs/ComicViewer/ComicViewerProps.js.map +1 -1
- package/build/commonjs/ComicViewer/ViewerItem.js +4 -3
- package/build/commonjs/ComicViewer/ViewerItem.js.map +1 -1
- package/build/commonjs/ComicViewer/index.js.map +1 -1
- package/build/commonjs/DateTimePicker/DateTimePicker.js +2 -2
- package/build/commonjs/DateTimePicker/DateTimePicker.js.map +1 -1
- package/build/commonjs/DateTimePicker/DateTimePickerProps.js.map +1 -1
- package/build/commonjs/DateTimePicker/DateTimePickerProvider.js.map +1 -1
- package/build/commonjs/DateTimePicker/YearPicker.js +21 -17
- package/build/commonjs/DateTimePicker/YearPicker.js.map +1 -1
- package/build/commonjs/DateTimePicker/index.js +4 -4
- package/build/commonjs/DateTimePicker/index.js.map +1 -1
- package/build/commonjs/DateTimePicker/utils.js +2 -1
- package/build/commonjs/DateTimePicker/utils.js.map +1 -1
- package/build/commonjs/FlipCard/FlipCard.js +7 -13
- package/build/commonjs/FlipCard/FlipCard.js.map +1 -1
- package/build/commonjs/FlipCard/FlipCardProps.js.map +1 -1
- package/build/commonjs/FlipCard/index.js.map +1 -1
- package/build/commonjs/StatusBarProvider/Provider.js +1 -1
- package/build/commonjs/StatusBarProvider/Provider.js.map +1 -1
- package/build/commonjs/StatusBarProvider/StatusBarProvider.js.map +1 -1
- package/build/commonjs/StatusBarProvider/StatusBarProviderProps.js.map +1 -1
- package/build/commonjs/StatusBarProvider/index.js.map +1 -1
- package/build/commonjs/ViewPager/ChildrenMemoizedPage.js +86 -21
- package/build/commonjs/ViewPager/ChildrenMemoizedPage.js.map +1 -1
- package/build/commonjs/ViewPager/PageStateContext.js +22 -0
- package/build/commonjs/ViewPager/PageStateContext.js.map +1 -0
- package/build/commonjs/ViewPager/ViewPagerNative.js +61 -38
- package/build/commonjs/ViewPager/ViewPagerNative.js.map +1 -1
- package/build/commonjs/ViewPager/ViewPagerProps.js.map +1 -1
- package/build/commonjs/ViewPager/ViewPagerWeb.js +35 -26
- package/build/commonjs/ViewPager/ViewPagerWeb.js.map +1 -1
- package/build/commonjs/ViewPager/index.js +8 -0
- package/build/commonjs/ViewPager/index.js.map +1 -1
- package/build/commonjs/ViewPager/index.native.js +8 -0
- package/build/commonjs/ViewPager/index.native.js.map +1 -1
- package/build/commonjs/ViewPager/utils.js +5 -39
- package/build/commonjs/ViewPager/utils.js.map +1 -1
- package/build/commonjs/ViewabilityTrackerView/Viewability.js +2 -0
- package/build/commonjs/ViewabilityTrackerView/Viewability.js.map +1 -0
- package/build/commonjs/ViewabilityTrackerView/ViewabilityTrackerView.js +45 -0
- package/build/commonjs/ViewabilityTrackerView/ViewabilityTrackerView.js.map +1 -0
- package/build/commonjs/ViewabilityTrackerView/ViewabilityTrackerViewProps.js +2 -0
- package/build/commonjs/ViewabilityTrackerView/ViewabilityTrackerViewProps.js.map +1 -0
- package/build/commonjs/{Carousel/index.native.js → ViewabilityTrackerView/index.js} +3 -3
- package/build/commonjs/ViewabilityTrackerView/index.js.map +1 -0
- package/build/commonjs/ViewabilityTrackerView/measureViewability.js +42 -0
- package/build/commonjs/ViewabilityTrackerView/measureViewability.js.map +1 -0
- package/build/commonjs/ViewabilityTrackerView/useViewabilityTracker.js +88 -0
- package/build/commonjs/ViewabilityTrackerView/useViewabilityTracker.js.map +1 -0
- package/build/commonjs/hooks/index.js +16 -0
- package/build/commonjs/hooks/index.js.map +1 -1
- package/build/commonjs/hooks/useAppbarStyles.js.map +1 -1
- package/build/commonjs/hooks/useDeferredExecutor.js +45 -0
- package/build/commonjs/hooks/useDeferredExecutor.js.map +1 -0
- package/build/commonjs/hooks/useElevationStyle.js.map +1 -1
- package/build/commonjs/hooks/useHeight.js +5 -4
- package/build/commonjs/hooks/useHeight.js.map +1 -1
- package/build/commonjs/hooks/useIsMounted.js +22 -0
- package/build/commonjs/hooks/useIsMounted.js.map +1 -0
- package/build/commonjs/hooks/useUnstableCollapsibleAppBar.js +56 -57
- package/build/commonjs/hooks/useUnstableCollapsibleAppBar.js.map +1 -1
- package/build/commonjs/hooks/useUnstableToggleDisplayStyle.js +9 -11
- package/build/commonjs/hooks/useUnstableToggleDisplayStyle.js.map +1 -1
- package/build/commonjs/index.js +28 -7
- package/build/commonjs/index.js.map +1 -1
- package/build/module/AnimatedY/AnimatedY.js +11 -10
- package/build/module/AnimatedY/AnimatedY.js.map +1 -1
- package/build/module/AnimatedY/AnimatedYProps.js.map +1 -1
- package/build/module/AnimatedY/index.js.map +1 -1
- package/build/module/BottomSheet/BottomSheetNative.js +1 -1
- package/build/module/BottomSheet/BottomSheetNative.js.map +1 -1
- package/build/module/BottomSheet/BottomSheetProps.js.map +1 -1
- package/build/module/BottomSheet/BottomSheetWeb.js +2 -6
- package/build/module/BottomSheet/BottomSheetWeb.js.map +1 -1
- package/build/module/BottomSheet/TransparentBackdrop.js +1 -1
- package/build/module/BottomSheet/TransparentBackdrop.js.map +1 -1
- package/build/module/BottomSheet/index.js.map +1 -1
- package/build/module/BottomSheet/index.native.js.map +1 -1
- package/build/module/Carousel/Carousel.js +115 -0
- package/build/module/Carousel/Carousel.js.map +1 -0
- package/build/module/Carousel/CarouselProps.js.map +1 -1
- package/build/module/Carousel/animation/animationUtils.js +2 -0
- package/build/module/Carousel/animation/animationUtils.js.map +1 -0
- package/build/module/Carousel/animation/createDefaultItemStyle.js +3 -0
- package/build/module/Carousel/animation/createDefaultItemStyle.js.map +1 -0
- package/build/module/Carousel/animation/createDefaultScrollAnimation.js +11 -0
- package/build/module/Carousel/animation/createDefaultScrollAnimation.js.map +1 -0
- package/build/module/Carousel/animation/index.js +5 -0
- package/build/module/Carousel/animation/index.js.map +1 -0
- package/build/module/Carousel/animation/normalItemStyleFactory.js +18 -0
- package/build/module/Carousel/animation/normalItemStyleFactory.js.map +1 -0
- package/build/module/Carousel/animation/parallaxItemStyleFactory.js +55 -0
- package/build/module/Carousel/animation/parallaxItemStyleFactory.js.map +1 -0
- package/build/module/Carousel/components/InternalContext.js +19 -0
- package/build/module/Carousel/components/InternalContext.js.map +1 -0
- package/build/module/Carousel/components/ItemView.js +44 -0
- package/build/module/Carousel/components/ItemView.js.map +1 -0
- package/build/module/Carousel/components/RootView.js +47 -0
- package/build/module/Carousel/components/RootView.js.map +1 -0
- package/build/module/Carousel/components/ScrollViewGesture.js +62 -0
- package/build/module/Carousel/components/ScrollViewGesture.js.map +1 -0
- package/build/module/Carousel/components/index.js +5 -0
- package/build/module/Carousel/components/index.js.map +1 -0
- package/build/module/Carousel/hooks/index.js +8 -0
- package/build/module/Carousel/hooks/index.js.map +1 -0
- package/build/module/Carousel/hooks/useAutoplayController.js +45 -0
- package/build/module/Carousel/hooks/useAutoplayController.js.map +1 -0
- package/build/module/Carousel/hooks/useDimensionChangeReaction.js +14 -0
- package/build/module/Carousel/hooks/useDimensionChangeReaction.js.map +1 -0
- package/build/module/Carousel/hooks/useIndexController.js +54 -0
- package/build/module/Carousel/hooks/useIndexController.js.map +1 -0
- package/build/module/Carousel/hooks/useItemInterpolation.js +51 -0
- package/build/module/Carousel/hooks/useItemInterpolation.js.map +1 -0
- package/build/module/Carousel/hooks/useItemVisibilityStore.js +87 -0
- package/build/module/Carousel/hooks/useItemVisibilityStore.js.map +1 -0
- package/build/module/Carousel/hooks/useLoopedData.js +24 -0
- package/build/module/Carousel/hooks/useLoopedData.js.map +1 -0
- package/build/module/Carousel/hooks/usePagingAnimation.js +115 -0
- package/build/module/Carousel/hooks/usePagingAnimation.js.map +1 -0
- package/build/module/Carousel/index.js +2 -1
- package/build/module/Carousel/index.js.map +1 -1
- package/build/module/Carousel/types.js +3 -0
- package/build/module/Carousel/types.js.map +1 -0
- package/build/module/ComicViewer/ComicViewer.js +16 -11
- package/build/module/ComicViewer/ComicViewer.js.map +1 -1
- package/build/module/ComicViewer/ComicViewerItemProps.js.map +1 -1
- package/build/module/ComicViewer/ComicViewerProps.js.map +1 -1
- package/build/module/ComicViewer/ViewerItem.js +4 -3
- package/build/module/ComicViewer/ViewerItem.js.map +1 -1
- package/build/module/ComicViewer/index.js.map +1 -1
- package/build/module/DateTimePicker/DateTimePicker.js +2 -2
- package/build/module/DateTimePicker/DateTimePicker.js.map +1 -1
- package/build/module/DateTimePicker/DateTimePickerProps.js.map +1 -1
- package/build/module/DateTimePicker/DateTimePickerProvider.js.map +1 -1
- package/build/module/DateTimePicker/YearPicker.js +21 -17
- package/build/module/DateTimePicker/YearPicker.js.map +1 -1
- package/build/module/DateTimePicker/index.js.map +1 -1
- package/build/module/DateTimePicker/utils.js +2 -1
- package/build/module/DateTimePicker/utils.js.map +1 -1
- package/build/module/FlipCard/FlipCard.js +7 -7
- package/build/module/FlipCard/FlipCard.js.map +1 -1
- package/build/module/FlipCard/FlipCardProps.js.map +1 -1
- package/build/module/FlipCard/index.js.map +1 -1
- package/build/module/StatusBarProvider/Provider.js.map +1 -1
- package/build/module/StatusBarProvider/StatusBarProvider.js.map +1 -1
- package/build/module/StatusBarProvider/StatusBarProviderProps.js.map +1 -1
- package/build/module/StatusBarProvider/index.js.map +1 -1
- package/build/module/ViewPager/ChildrenMemoizedPage.js +80 -23
- package/build/module/ViewPager/ChildrenMemoizedPage.js.map +1 -1
- package/build/module/ViewPager/PageStateContext.js +10 -0
- package/build/module/ViewPager/PageStateContext.js.map +1 -0
- package/build/module/ViewPager/ViewPagerNative.js +57 -33
- package/build/module/ViewPager/ViewPagerNative.js.map +1 -1
- package/build/module/ViewPager/ViewPagerProps.js.map +1 -1
- package/build/module/ViewPager/ViewPagerWeb.js +29 -24
- package/build/module/ViewPager/ViewPagerWeb.js.map +1 -1
- package/build/module/ViewPager/index.js +1 -0
- package/build/module/ViewPager/index.js.map +1 -1
- package/build/module/ViewPager/index.native.js +1 -0
- package/build/module/ViewPager/index.native.js.map +1 -1
- package/build/module/ViewPager/utils.js +2 -31
- package/build/module/ViewPager/utils.js.map +1 -1
- package/build/module/ViewabilityTrackerView/Viewability.js +2 -0
- package/build/module/ViewabilityTrackerView/Viewability.js.map +1 -0
- package/build/module/ViewabilityTrackerView/ViewabilityTrackerView.js +28 -0
- package/build/module/ViewabilityTrackerView/ViewabilityTrackerView.js.map +1 -0
- package/build/module/ViewabilityTrackerView/ViewabilityTrackerViewProps.js +2 -0
- package/build/module/ViewabilityTrackerView/ViewabilityTrackerViewProps.js.map +1 -0
- package/build/module/ViewabilityTrackerView/index.js +2 -0
- package/build/module/ViewabilityTrackerView/index.js.map +1 -0
- package/build/module/ViewabilityTrackerView/measureViewability.js +34 -0
- package/build/module/ViewabilityTrackerView/measureViewability.js.map +1 -0
- package/build/module/ViewabilityTrackerView/useViewabilityTracker.js +73 -0
- package/build/module/ViewabilityTrackerView/useViewabilityTracker.js.map +1 -0
- package/build/module/hooks/index.js +2 -0
- package/build/module/hooks/index.js.map +1 -1
- package/build/module/hooks/useAppbarStyles.js.map +1 -1
- package/build/module/hooks/useDeferredExecutor.js +33 -0
- package/build/module/hooks/useDeferredExecutor.js.map +1 -0
- package/build/module/hooks/useElevationStyle.js.map +1 -1
- package/build/module/hooks/useHeight.js +4 -3
- package/build/module/hooks/useHeight.js.map +1 -1
- package/build/module/hooks/useIsMounted.js +13 -0
- package/build/module/hooks/useIsMounted.js.map +1 -0
- package/build/module/hooks/useUnstableCollapsibleAppBar.js +58 -43
- package/build/module/hooks/useUnstableCollapsibleAppBar.js.map +1 -1
- package/build/module/hooks/useUnstableToggleDisplayStyle.js +9 -7
- package/build/module/hooks/useUnstableToggleDisplayStyle.js.map +1 -1
- package/build/module/index.js +2 -0
- package/build/module/index.js.map +1 -1
- package/build/typescript/AnimatedY/AnimatedY.d.ts +0 -1
- package/build/typescript/BottomSheet/BottomSheetNative.d.ts +0 -1
- package/build/typescript/BottomSheet/BottomSheetWeb.d.ts +0 -1
- package/build/typescript/BottomSheet/TransparentBackdrop.d.ts +0 -1
- package/build/typescript/Carousel/Carousel.d.ts +5 -0
- package/build/typescript/Carousel/CarouselProps.d.ts +32 -48
- package/build/typescript/Carousel/animation/animationUtils.d.ts +1 -0
- package/build/typescript/Carousel/animation/createDefaultItemStyle.d.ts +2 -0
- package/build/typescript/Carousel/animation/createDefaultScrollAnimation.d.ts +2 -0
- package/build/typescript/Carousel/animation/index.d.ts +4 -0
- package/build/typescript/Carousel/animation/normalItemStyleFactory.d.ts +2 -0
- package/build/typescript/Carousel/animation/parallaxItemStyleFactory.d.ts +9 -0
- package/build/typescript/Carousel/components/InternalContext.d.ts +14 -0
- package/build/typescript/Carousel/components/ItemView.d.ts +7 -0
- package/build/typescript/Carousel/components/RootView.d.ts +16 -0
- package/build/typescript/Carousel/components/ScrollViewGesture.d.ts +12 -0
- package/build/typescript/Carousel/components/index.d.ts +4 -0
- package/build/typescript/Carousel/hooks/index.d.ts +7 -0
- package/build/typescript/Carousel/hooks/useAutoplayController.d.ts +7 -0
- package/build/typescript/Carousel/hooks/useDimensionChangeReaction.d.ts +7 -0
- package/build/typescript/Carousel/hooks/useIndexController.d.ts +10 -0
- package/build/typescript/Carousel/hooks/useItemInterpolation.d.ts +2 -0
- package/build/typescript/Carousel/hooks/useItemVisibilityStore.d.ts +7 -0
- package/build/typescript/Carousel/hooks/useLoopedData.d.ts +1 -0
- package/build/typescript/Carousel/hooks/usePagingAnimation.d.ts +18 -0
- package/build/typescript/Carousel/index.d.ts +3 -1
- package/build/typescript/Carousel/types.d.ts +57 -0
- package/build/typescript/ComicViewer/ComicViewer.d.ts +0 -1
- package/build/typescript/DateTimePicker/DateTimePicker.d.ts +0 -1
- package/build/typescript/DateTimePicker/YearPicker.d.ts +0 -1
- package/build/typescript/FlipCard/FlipCard.d.ts +0 -1
- package/build/typescript/StatusBarProvider/StatusBarProvider.d.ts +0 -1
- package/build/typescript/ViewPager/ChildrenMemoizedPage.d.ts +2 -1
- package/build/typescript/ViewPager/PageStateContext.d.ts +7 -0
- package/build/typescript/ViewPager/ViewPagerNative.d.ts +4 -2
- package/build/typescript/ViewPager/ViewPagerProps.d.ts +31 -19
- package/build/typescript/ViewPager/ViewPagerWeb.d.ts +4 -2
- package/build/typescript/ViewPager/index.d.ts +2 -1
- package/build/typescript/ViewPager/index.native.d.ts +1 -0
- package/build/typescript/ViewPager/utils.d.ts +3 -19
- package/build/typescript/ViewabilityTrackerView/Viewability.d.ts +3 -0
- package/build/typescript/ViewabilityTrackerView/ViewabilityTrackerView.d.ts +2 -0
- package/build/typescript/ViewabilityTrackerView/ViewabilityTrackerViewProps.d.ts +22 -0
- package/build/typescript/ViewabilityTrackerView/index.d.ts +2 -0
- package/build/typescript/ViewabilityTrackerView/measureViewability.d.ts +11 -0
- package/build/typescript/ViewabilityTrackerView/useViewabilityTracker.d.ts +11 -0
- package/build/typescript/hooks/index.d.ts +2 -0
- package/build/typescript/hooks/useDeferredExecutor.d.ts +11 -0
- package/build/typescript/hooks/useIsMounted.d.ts +4 -0
- package/build/typescript/hooks/useUnstableCollapsibleAppBar.d.ts +2 -3
- package/build/typescript/hooks/useUnstableToggleDisplayStyle.d.ts +2 -2
- package/build/typescript/index.d.ts +2 -0
- package/package.json +12 -27
- package/src/AnimatedY/AnimatedY.tsx +13 -10
- package/src/Carousel/Carousel.tsx +151 -0
- package/src/Carousel/CarouselProps.ts +34 -53
- package/src/Carousel/animation/animationUtils.ts +1 -0
- package/src/Carousel/animation/createDefaultItemStyle.ts +3 -0
- package/src/Carousel/animation/createDefaultScrollAnimation.ts +13 -0
- package/src/Carousel/animation/index.ts +4 -0
- package/src/Carousel/animation/normalItemStyleFactory.ts +19 -0
- package/src/Carousel/animation/parallaxItemStyleFactory.ts +79 -0
- package/src/Carousel/components/InternalContext.ts +33 -0
- package/src/Carousel/components/ItemView.tsx +56 -0
- package/src/Carousel/components/RootView.tsx +66 -0
- package/src/Carousel/components/ScrollViewGesture.tsx +80 -0
- package/src/Carousel/components/index.ts +4 -0
- package/src/Carousel/hooks/index.ts +7 -0
- package/src/Carousel/hooks/useAutoplayController.ts +54 -0
- package/src/Carousel/hooks/useDimensionChangeReaction.ts +25 -0
- package/src/Carousel/hooks/useIndexController.tsx +76 -0
- package/src/Carousel/hooks/useItemInterpolation.ts +107 -0
- package/src/Carousel/hooks/useItemVisibilityStore.ts +107 -0
- package/src/Carousel/hooks/useLoopedData.ts +26 -0
- package/src/Carousel/hooks/usePagingAnimation.ts +148 -0
- package/src/Carousel/index.ts +4 -2
- package/src/Carousel/types.ts +67 -0
- package/src/DateTimePicker/DateTimePicker.tsx +2 -2
- package/src/FlipCard/FlipCard.tsx +8 -8
- package/src/ViewPager/ChildrenMemoizedPage.tsx +97 -23
- package/src/ViewPager/PageStateContext.ts +15 -0
- package/src/ViewPager/ViewPagerNative.tsx +72 -36
- package/src/ViewPager/ViewPagerProps.ts +33 -19
- package/src/ViewPager/ViewPagerWeb.tsx +38 -29
- package/src/ViewPager/index.native.ts +1 -0
- package/src/ViewPager/index.ts +2 -1
- package/src/ViewPager/utils.tsx +4 -56
- package/src/ViewabilityTrackerView/Viewability.ts +3 -0
- package/src/ViewabilityTrackerView/ViewabilityTrackerView.tsx +33 -0
- package/src/ViewabilityTrackerView/ViewabilityTrackerViewProps.ts +25 -0
- package/src/ViewabilityTrackerView/index.ts +2 -0
- package/src/ViewabilityTrackerView/measureViewability.ts +56 -0
- package/src/ViewabilityTrackerView/useViewabilityTracker.ts +85 -0
- package/src/hooks/index.ts +2 -0
- package/src/hooks/useDeferredExecutor.ts +46 -0
- package/src/hooks/useHeight.ts +2 -2
- package/src/hooks/useIsMounted.ts +19 -0
- package/src/hooks/useUnstableCollapsibleAppBar.ts +59 -42
- package/src/hooks/useUnstableToggleDisplayStyle.ts +8 -6
- package/src/index.ts +3 -0
- package/build/commonjs/Carousel/CarouselNative.js +0 -72
- package/build/commonjs/Carousel/CarouselNative.js.map +0 -1
- package/build/commonjs/Carousel/CarouselWeb.js +0 -237
- package/build/commonjs/Carousel/CarouselWeb.js.map +0 -1
- package/build/commonjs/Carousel/index.native.js.map +0 -1
- package/build/commonjs/Carousel/utils.js +0 -19
- package/build/commonjs/Carousel/utils.js.map +0 -1
- package/build/commonjs/hooks/useWidth.js +0 -29
- package/build/commonjs/hooks/useWidth.js.map +0 -1
- package/build/module/Carousel/CarouselNative.js +0 -54
- package/build/module/Carousel/CarouselNative.js.map +0 -1
- package/build/module/Carousel/CarouselWeb.js +0 -215
- package/build/module/Carousel/CarouselWeb.js.map +0 -1
- package/build/module/Carousel/index.native.js +0 -2
- package/build/module/Carousel/index.native.js.map +0 -1
- package/build/module/Carousel/utils.js +0 -7
- package/build/module/Carousel/utils.js.map +0 -1
- package/build/module/hooks/useWidth.js +0 -15
- package/build/module/hooks/useWidth.js.map +0 -1
- package/build/typescript/Carousel/CarouselNative.d.ts +0 -3
- package/build/typescript/Carousel/CarouselWeb.d.ts +0 -4
- package/build/typescript/Carousel/index.native.d.ts +0 -1
- package/build/typescript/Carousel/utils.d.ts +0 -6
- package/build/typescript/hooks/useWidth.d.ts +0 -2
- package/src/Carousel/CarouselNative.tsx +0 -67
- package/src/Carousel/CarouselWeb.tsx +0 -222
- package/src/Carousel/index.native.ts +0 -1
- package/src/Carousel/utils.ts +0 -11
- package/src/hooks/useWidth.ts +0 -17
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
2
|
+
|
|
3
|
+
export interface UseIsMounted {
|
|
4
|
+
(): boolean;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
export default function useIsMounted(): UseIsMounted {
|
|
8
|
+
const mountedRef = useRef<boolean>(false);
|
|
9
|
+
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
mountedRef.current = true;
|
|
12
|
+
|
|
13
|
+
return () => {
|
|
14
|
+
mountedRef.current = false;
|
|
15
|
+
};
|
|
16
|
+
}, []);
|
|
17
|
+
|
|
18
|
+
return useCallback(() => mountedRef.current, []);
|
|
19
|
+
};
|
|
@@ -1,6 +1,13 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { useRef } from 'react';
|
|
2
2
|
import { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';
|
|
3
|
-
import
|
|
3
|
+
import type { SharedValue } from 'react-native-reanimated';
|
|
4
|
+
import {
|
|
5
|
+
useAnimatedScrollHandler,
|
|
6
|
+
useAnimatedStyle,
|
|
7
|
+
useDerivedValue,
|
|
8
|
+
useSharedValue,
|
|
9
|
+
withTiming,
|
|
10
|
+
} from 'react-native-reanimated';
|
|
4
11
|
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
5
12
|
import useAppbarStyles from './useAppbarStyles';
|
|
6
13
|
import useElevationStyle from './useElevationStyle';
|
|
@@ -22,13 +29,12 @@ export interface ContentInsets {
|
|
|
22
29
|
}
|
|
23
30
|
|
|
24
31
|
export interface Options {
|
|
25
|
-
translucent?: boolean;
|
|
26
32
|
shouldTranslateYReset?: boolean;
|
|
27
33
|
}
|
|
28
34
|
|
|
29
35
|
export interface CollapsibleAppBar {
|
|
30
36
|
appBarStyle: ViewStyleProp;
|
|
31
|
-
vectorY:
|
|
37
|
+
vectorY: SharedValue<number>;
|
|
32
38
|
onAppBarLayout: OnLayoutCallback;
|
|
33
39
|
onCollapsibleToolbarLayout: OnLayoutCallback;
|
|
34
40
|
onScroll: OnScroll;
|
|
@@ -37,7 +43,6 @@ export interface CollapsibleAppBar {
|
|
|
37
43
|
}
|
|
38
44
|
|
|
39
45
|
const defaultOptions: Required<Options> = {
|
|
40
|
-
translucent: false,
|
|
41
46
|
shouldTranslateYReset: false,
|
|
42
47
|
};
|
|
43
48
|
|
|
@@ -45,7 +50,6 @@ const ANIMATION_DURATION_MILLIS = 100;
|
|
|
45
50
|
|
|
46
51
|
const SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';
|
|
47
52
|
|
|
48
|
-
|
|
49
53
|
function useLargerValueOfLastTwoValues(value: number) {
|
|
50
54
|
const refLatestTwoValues = useRef([0, 0]);
|
|
51
55
|
|
|
@@ -55,12 +59,8 @@ function useLargerValueOfLastTwoValues(value: number) {
|
|
|
55
59
|
return Math.max(...refLatestTwoValues.current);
|
|
56
60
|
}
|
|
57
61
|
|
|
58
|
-
|
|
59
62
|
export default function useUnstableCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {
|
|
60
|
-
const {
|
|
61
|
-
translucent,
|
|
62
|
-
shouldTranslateYReset,
|
|
63
|
-
}: Required<Options> = {
|
|
63
|
+
const { shouldTranslateYReset }: Required<Options> = {
|
|
64
64
|
...defaultOptions,
|
|
65
65
|
...userOptions,
|
|
66
66
|
};
|
|
@@ -73,38 +73,55 @@ export default function useUnstableCollapsibleAppBar(userOptions: Options = defa
|
|
|
73
73
|
const appBarMaxHeight = useLargerValueOfLastTwoValues(appBarHeight);
|
|
74
74
|
const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();
|
|
75
75
|
|
|
76
|
-
const maxTranslateY =
|
|
76
|
+
const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);
|
|
77
77
|
|
|
78
|
-
const translateY =
|
|
79
|
-
const lastTranslateY =
|
|
80
|
-
const lastOffsetY =
|
|
81
|
-
const prevOffsetY =
|
|
82
|
-
const overlapped =
|
|
83
|
-
const vectorY =
|
|
78
|
+
const translateY = useSharedValue<number>(0);
|
|
79
|
+
const lastTranslateY = useSharedValue<number>(0);
|
|
80
|
+
const lastOffsetY = useSharedValue<number>(0);
|
|
81
|
+
const prevOffsetY = useSharedValue<number>(0);
|
|
82
|
+
const overlapped = useSharedValue<boolean>(false);
|
|
83
|
+
const vectorY = useSharedValue<number>(0);
|
|
84
84
|
|
|
85
85
|
const elevationStyle = useElevationStyle(4);
|
|
86
|
-
const animatedStyle =
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
86
|
+
const animatedStyle = useAnimatedStyle(() => {
|
|
87
|
+
const transform = [{ translateY: translateY.value }];
|
|
88
|
+
|
|
89
|
+
if (Platform.OS === 'web') {
|
|
90
|
+
return {
|
|
91
|
+
transform,
|
|
92
|
+
boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,
|
|
93
|
+
};
|
|
94
|
+
}
|
|
95
|
+
if (Platform.OS === 'android') {
|
|
96
|
+
return {
|
|
97
|
+
transform,
|
|
98
|
+
elevation: overlapped.value ? elevationStyle?.elevation : 0,
|
|
99
|
+
};
|
|
100
|
+
}
|
|
101
|
+
if (Platform.OS === 'ios') {
|
|
102
|
+
return {
|
|
103
|
+
transform,
|
|
104
|
+
shadowColor: elevationStyle?.shadowColor,
|
|
105
|
+
shadowOffset: elevationStyle?.shadowOffset,
|
|
106
|
+
shadowRadius: elevationStyle?.shadowRadius,
|
|
107
|
+
shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,
|
|
108
|
+
};
|
|
109
|
+
}
|
|
110
|
+
return {};
|
|
111
|
+
}, [
|
|
112
|
+
/**
|
|
113
|
+
* FIXME: Consider add `elevationStyle` to dependencies.
|
|
114
|
+
*/
|
|
115
|
+
]);
|
|
116
|
+
|
|
117
|
+
const indexRef = useRef<number>(0);
|
|
118
|
+
const offsetsRef = useRef<Array<number>>([]);
|
|
102
119
|
|
|
103
120
|
const onScrollViewChanged = (nextIndex: number) => {
|
|
104
121
|
const prevIndex = indexRef.current;
|
|
105
122
|
if (prevIndex === nextIndex) {
|
|
106
123
|
if (shouldTranslateYReset) {
|
|
107
|
-
translateY.value =
|
|
124
|
+
translateY.value = withTiming(0, {
|
|
108
125
|
duration: ANIMATION_DURATION_MILLIS,
|
|
109
126
|
});
|
|
110
127
|
|
|
@@ -128,7 +145,7 @@ export default function useUnstableCollapsibleAppBar(userOptions: Options = defa
|
|
|
128
145
|
|
|
129
146
|
// If next ScrollView's offset is too short, expand app bar.
|
|
130
147
|
if (translateY.value < 0 && savedOffsetY < appBarHeight) {
|
|
131
|
-
translateY.value =
|
|
148
|
+
translateY.value = withTiming(0, {
|
|
132
149
|
duration: ANIMATION_DURATION_MILLIS,
|
|
133
150
|
});
|
|
134
151
|
|
|
@@ -136,7 +153,7 @@ export default function useUnstableCollapsibleAppBar(userOptions: Options = defa
|
|
|
136
153
|
}
|
|
137
154
|
};
|
|
138
155
|
|
|
139
|
-
const scrollHandler =
|
|
156
|
+
const scrollHandler = useAnimatedScrollHandler({
|
|
140
157
|
onBeginDrag: () => {
|
|
141
158
|
lastTranslateY.value = translateY.value;
|
|
142
159
|
},
|
|
@@ -162,13 +179,13 @@ export default function useUnstableCollapsibleAppBar(userOptions: Options = defa
|
|
|
162
179
|
} else {
|
|
163
180
|
if (offsetY > -maxTy) {
|
|
164
181
|
if (ty === 0) {
|
|
165
|
-
translateY.value =
|
|
182
|
+
translateY.value = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {
|
|
166
183
|
duration: ANIMATION_DURATION_MILLIS,
|
|
167
184
|
});
|
|
168
185
|
}
|
|
169
186
|
} else {
|
|
170
187
|
if (ty === maxTy) {
|
|
171
|
-
translateY.value =
|
|
188
|
+
translateY.value = withTiming(0, {
|
|
172
189
|
duration: ANIMATION_DURATION_MILLIS,
|
|
173
190
|
});
|
|
174
191
|
}
|
|
@@ -201,17 +218,17 @@ export default function useUnstableCollapsibleAppBar(userOptions: Options = defa
|
|
|
201
218
|
|
|
202
219
|
overlapped.value = offsetY + nextTranslateY > 0;
|
|
203
220
|
|
|
204
|
-
translateY.value =
|
|
221
|
+
translateY.value = withTiming(nextTranslateY, {
|
|
205
222
|
duration: ANIMATION_DURATION_MILLIS,
|
|
206
223
|
});
|
|
207
224
|
},
|
|
208
|
-
});
|
|
225
|
+
}, []);
|
|
209
226
|
|
|
210
227
|
const hasCollapsible = collapsibleToolbarHeight > 0;
|
|
211
228
|
|
|
212
229
|
const appBarStyle = [
|
|
213
230
|
animatedStyle,
|
|
214
|
-
|
|
231
|
+
{ paddingTop: safeAreaInsets.top },
|
|
215
232
|
hasCollapsible ? styles.floating : undefined,
|
|
216
233
|
];
|
|
217
234
|
|
|
@@ -1,13 +1,14 @@
|
|
|
1
|
-
import
|
|
1
|
+
import type { SharedValue } from 'react-native-reanimated';
|
|
2
|
+
import { useAnimatedReaction, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
|
|
2
3
|
|
|
3
4
|
export default function useAnimatedDisplayStyle(
|
|
4
|
-
vectorY:
|
|
5
|
+
vectorY: SharedValue<number>,
|
|
5
6
|
threshold: number = 200,
|
|
6
7
|
defaultDisplay: 'flex' | 'none' = 'flex',
|
|
7
8
|
) {
|
|
8
|
-
const display =
|
|
9
|
+
const display = useSharedValue(defaultDisplay);
|
|
9
10
|
|
|
10
|
-
|
|
11
|
+
useAnimatedReaction(
|
|
11
12
|
() => vectorY.value,
|
|
12
13
|
(vy) => {
|
|
13
14
|
if (vy >= threshold) {
|
|
@@ -16,9 +17,10 @@ export default function useAnimatedDisplayStyle(
|
|
|
16
17
|
display.value = 'flex';
|
|
17
18
|
}
|
|
18
19
|
},
|
|
20
|
+
[threshold],
|
|
19
21
|
);
|
|
20
22
|
|
|
21
|
-
return
|
|
23
|
+
return useAnimatedStyle(() => ({
|
|
22
24
|
display: display.value,
|
|
23
|
-
}));
|
|
25
|
+
}), []);
|
|
24
26
|
};
|
package/src/index.ts
CHANGED
|
@@ -19,4 +19,7 @@ export * from './ComicViewer';
|
|
|
19
19
|
export { default as StatusBarProvider, useStatusBarContext } from './StatusBarProvider';
|
|
20
20
|
export * from './StatusBarProvider';
|
|
21
21
|
|
|
22
|
+
export { default as ViewabilityTrackerView } from './ViewabilityTrackerView';
|
|
23
|
+
export * from './ViewabilityTrackerView';
|
|
24
|
+
|
|
22
25
|
export * from './hooks';
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = Carousel;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
var _reactNativeSnapCarousel = _interopRequireDefault(require("react-native-snap-carousel"));
|
|
13
|
-
|
|
14
|
-
var _utils = require("./utils");
|
|
15
|
-
|
|
16
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
19
|
-
|
|
20
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
|
-
|
|
22
|
-
function Carousel(props) {
|
|
23
|
-
const {
|
|
24
|
-
autoplay = _utils.defaultAutoplay,
|
|
25
|
-
autoplayInterval = _utils.defaultAutoplayInterval,
|
|
26
|
-
centerSlidePadding,
|
|
27
|
-
data,
|
|
28
|
-
inactiveSlideOpacity = _utils.defaultInactiveSlideOpacity,
|
|
29
|
-
inactiveSlideScale = _utils.defaultInactiveSlideScale,
|
|
30
|
-
index,
|
|
31
|
-
infinite = _utils.defaultInfinite,
|
|
32
|
-
onChange,
|
|
33
|
-
renderItem
|
|
34
|
-
} = props;
|
|
35
|
-
const carouselRef = (0, _react.useRef)(null);
|
|
36
|
-
const [sliderWidth, setSliderWidth] = (0, _react.useState)(() => _reactNative.Dimensions.get('window').width);
|
|
37
|
-
const itemWidth = centerSlidePadding !== undefined ? sliderWidth - centerSlidePadding * 2 : sliderWidth;
|
|
38
|
-
(0, _react.useEffect)(() => {
|
|
39
|
-
const carousel = carouselRef.current;
|
|
40
|
-
|
|
41
|
-
if (carousel && index !== carousel.currentIndex) {
|
|
42
|
-
carousel.snapToItem(index, true);
|
|
43
|
-
}
|
|
44
|
-
}, [index]);
|
|
45
|
-
|
|
46
|
-
const handleSnapToItem = newIndex => {
|
|
47
|
-
if (onChange) {
|
|
48
|
-
onChange(newIndex);
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
53
|
-
onLayout: event => setSliderWidth(event.nativeEvent.layout.width)
|
|
54
|
-
}, /*#__PURE__*/_react.default.createElement(_reactNativeSnapCarousel.default, {
|
|
55
|
-
autoplay: autoplay,
|
|
56
|
-
autoplayInterval: autoplayInterval,
|
|
57
|
-
data: data,
|
|
58
|
-
horizontal: true,
|
|
59
|
-
inactiveSlideOpacity: inactiveSlideOpacity,
|
|
60
|
-
inactiveSlideScale: inactiveSlideScale,
|
|
61
|
-
itemWidth: itemWidth,
|
|
62
|
-
loop: infinite,
|
|
63
|
-
loopClonesPerSide: 2,
|
|
64
|
-
onSnapToItem: handleSnapToItem,
|
|
65
|
-
ref: carouselRef,
|
|
66
|
-
renderItem: renderItem,
|
|
67
|
-
sliderWidth: sliderWidth
|
|
68
|
-
}));
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
;
|
|
72
|
-
//# sourceMappingURL=CarouselNative.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["CarouselNative.tsx"],"names":["Carousel","props","autoplay","defaultAutoplay","autoplayInterval","defaultAutoplayInterval","centerSlidePadding","data","inactiveSlideOpacity","defaultInactiveSlideOpacity","inactiveSlideScale","defaultInactiveSlideScale","index","infinite","defaultInfinite","onChange","renderItem","carouselRef","sliderWidth","setSliderWidth","Dimensions","get","width","itemWidth","undefined","carousel","current","currentIndex","snapToItem","handleSnapToItem","newIndex","event","nativeEvent","layout"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;;;;;;;AAQe,SAASA,QAAT,CAAyBC,KAAzB,EAAsD;AACjE,QAAM;AACFC,IAAAA,QAAQ,GAAGC,sBADT;AAEFC,IAAAA,gBAAgB,GAAGC,8BAFjB;AAGFC,IAAAA,kBAHE;AAIFC,IAAAA,IAJE;AAKFC,IAAAA,oBAAoB,GAAGC,kCALrB;AAMFC,IAAAA,kBAAkB,GAAGC,gCANnB;AAOFC,IAAAA,KAPE;AAQFC,IAAAA,QAAQ,GAAGC,sBART;AASFC,IAAAA,QATE;AAUFC,IAAAA;AAVE,MAWFf,KAXJ;AAaA,QAAMgB,WAAW,GAAG,mBAAqC,IAArC,CAApB;AAEA,QAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,qBAAS,MAAMC,wBAAWC,GAAX,CAAe,QAAf,EAAyBC,KAAxC,CAAtC;AAEA,QAAMC,SAAS,GAAGjB,kBAAkB,KAAKkB,SAAvB,GACZN,WAAW,GAAIZ,kBAAkB,GAAG,CADxB,GAEZY,WAFN;AAIA,wBAAU,MAAM;AACZ,UAAMO,QAAQ,GAAGR,WAAW,CAACS,OAA7B;;AACA,QAAID,QAAQ,IAAIb,KAAK,KAAKa,QAAQ,CAACE,YAAnC,EAAiD;AAC7CF,MAAAA,QAAQ,CAACG,UAAT,CAAoBhB,KAApB,EAA2B,IAA3B;AACH;AACJ,GALD,EAKG,CAACA,KAAD,CALH;;AAOA,QAAMiB,gBAAgB,GAAIC,QAAD,IAAsB;AAC3C,QAAIf,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACe,QAAD,CAAR;AACH;AACJ,GAJD;;AAMA,sBACI,6BAAC,iBAAD;AAAM,IAAA,QAAQ,EAAGC,KAAD,IAAWZ,cAAc,CAACY,KAAK,CAACC,WAAN,CAAkBC,MAAlB,CAAyBX,KAA1B;AAAzC,kBACI,6BAAC,gCAAD;AACI,IAAA,QAAQ,EAAEpB,QADd;AAEI,IAAA,gBAAgB,EAAEE,gBAFtB;AAGI,IAAA,IAAI,EAAEG,IAHV;AAII,IAAA,UAAU,EAAE,IAJhB;AAKI,IAAA,oBAAoB,EAAEC,oBAL1B;AAMI,IAAA,kBAAkB,EAAEE,kBANxB;AAOI,IAAA,SAAS,EAAEa,SAPf;AAQI,IAAA,IAAI,EAAEV,QARV;AASI,IAAA,iBAAiB,EAAE,CATvB;AAUI,IAAA,YAAY,EAAEgB,gBAVlB;AAWI,IAAA,GAAG,EAAEZ,WAXT;AAYI,IAAA,UAAU,EAAED,UAZhB;AAaI,IAAA,WAAW,EAAEE;AAbjB,IADJ,CADJ;AAmBH;;AAAA","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Dimensions, View } from 'react-native';\nimport RNSnapCarousel from 'react-native-snap-carousel';\nimport type CarouselProps from './CarouselProps';\nimport {\n defaultAutoplay,\n defaultAutoplayInterval,\n defaultInactiveSlideOpacity,\n defaultInactiveSlideScale,\n defaultInfinite,\n} from './utils';\n\nexport default function Carousel<ItemT>(props: CarouselProps<ItemT>) {\n const {\n autoplay = defaultAutoplay,\n autoplayInterval = defaultAutoplayInterval,\n centerSlidePadding,\n data,\n inactiveSlideOpacity = defaultInactiveSlideOpacity,\n inactiveSlideScale = defaultInactiveSlideScale,\n index,\n infinite = defaultInfinite,\n onChange,\n renderItem,\n } = props;\n\n const carouselRef = useRef<RNSnapCarousel<ItemT> | null>(null);\n\n const [sliderWidth, setSliderWidth] = useState(() => Dimensions.get('window').width);\n\n const itemWidth = centerSlidePadding !== undefined\n ? sliderWidth - (centerSlidePadding * 2)\n : sliderWidth;\n\n useEffect(() => {\n const carousel = carouselRef.current;\n if (carousel && index !== carousel.currentIndex) {\n carousel.snapToItem(index, true);\n }\n }, [index]);\n\n const handleSnapToItem = (newIndex: number) => {\n if (onChange) {\n onChange(newIndex);\n }\n };\n\n return (\n <View onLayout={(event) => setSliderWidth(event.nativeEvent.layout.width)}>\n <RNSnapCarousel\n autoplay={autoplay}\n autoplayInterval={autoplayInterval}\n data={data}\n horizontal={true}\n inactiveSlideOpacity={inactiveSlideOpacity}\n inactiveSlideScale={inactiveSlideScale}\n itemWidth={itemWidth}\n loop={infinite}\n loopClonesPerSide={2}\n onSnapToItem={handleSnapToItem}\n ref={carouselRef}\n renderItem={renderItem}\n sliderWidth={sliderWidth}\n />\n </View>\n );\n};\n"]}
|
|
@@ -1,237 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
var _reactSlick = _interopRequireDefault(require("react-slick"));
|
|
13
|
-
|
|
14
|
-
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
15
|
-
|
|
16
|
-
var _icons = require("@fountain-ui/icons");
|
|
17
|
-
|
|
18
|
-
var _utils = require("@fountain-ui/utils");
|
|
19
|
-
|
|
20
|
-
var _utils2 = require("./utils");
|
|
21
|
-
|
|
22
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
23
|
-
|
|
24
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
25
|
-
|
|
26
|
-
const baseSettings = {
|
|
27
|
-
dots: false,
|
|
28
|
-
draggable: true,
|
|
29
|
-
lazyLoad: typeof window === 'undefined' ? undefined : 'ondemand',
|
|
30
|
-
pauseOnFocus: true,
|
|
31
|
-
pauseOnHover: true,
|
|
32
|
-
rows: 1,
|
|
33
|
-
swipe: true,
|
|
34
|
-
slidesPerRow: 1,
|
|
35
|
-
vertical: false
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
const noop = () => void 0;
|
|
39
|
-
|
|
40
|
-
const StyledContainer = _styled.default.div(props => ({
|
|
41
|
-
['& .slick-slider']: {
|
|
42
|
-
display: 'block',
|
|
43
|
-
position: 'relative',
|
|
44
|
-
userSelect: 'none'
|
|
45
|
-
},
|
|
46
|
-
['& .slick-list']: {
|
|
47
|
-
display: 'block',
|
|
48
|
-
position: 'relative',
|
|
49
|
-
overflow: 'hidden',
|
|
50
|
-
margin: 0,
|
|
51
|
-
padding: 0,
|
|
52
|
-
['&:focus']: {
|
|
53
|
-
outline: 'none'
|
|
54
|
-
},
|
|
55
|
-
['&.dragging']: {
|
|
56
|
-
cursor: 'pointer'
|
|
57
|
-
}
|
|
58
|
-
},
|
|
59
|
-
['& .slick-slider .slick-track, &.slick-slider .slick-list']: {
|
|
60
|
-
transform: 'translate3d(0, 0, 0)'
|
|
61
|
-
},
|
|
62
|
-
['& .slick-track']: {
|
|
63
|
-
display: 'block',
|
|
64
|
-
position: 'relative',
|
|
65
|
-
top: 0,
|
|
66
|
-
left: 0,
|
|
67
|
-
['&:before, &:after']: {
|
|
68
|
-
display: 'table',
|
|
69
|
-
content: '\'\''
|
|
70
|
-
},
|
|
71
|
-
['&:after']: {
|
|
72
|
-
clear: 'both'
|
|
73
|
-
},
|
|
74
|
-
...props.trackStyle
|
|
75
|
-
},
|
|
76
|
-
['& .slick-slide']: {
|
|
77
|
-
display: 'none',
|
|
78
|
-
float: 'left',
|
|
79
|
-
height: '100%',
|
|
80
|
-
minHeight: 1,
|
|
81
|
-
['& > div']: {
|
|
82
|
-
justifyContent: 'center',
|
|
83
|
-
display: 'flex',
|
|
84
|
-
transform: `scale(${props.inactiveSlideScale})`,
|
|
85
|
-
transition: 'transform .5s',
|
|
86
|
-
opacity: props.inactiveSlideOpacity
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
['& .slick-current > div']: {
|
|
90
|
-
transform: `scale(${props.activeSlideScale})`,
|
|
91
|
-
opacity: 1
|
|
92
|
-
},
|
|
93
|
-
['& .slick-initialized .slick-slide']: {
|
|
94
|
-
display: 'block'
|
|
95
|
-
},
|
|
96
|
-
...props.arrowsStyle
|
|
97
|
-
}));
|
|
98
|
-
|
|
99
|
-
const ArrowContainer = props => {
|
|
100
|
-
const {
|
|
101
|
-
children,
|
|
102
|
-
currentSlide,
|
|
103
|
-
slideCount,
|
|
104
|
-
visible,
|
|
105
|
-
...otherProps
|
|
106
|
-
} = props;
|
|
107
|
-
return visible ?
|
|
108
|
-
/*#__PURE__*/
|
|
109
|
-
// If root component is not a div, there's no arrow class.
|
|
110
|
-
_react.default.createElement("div", _extends({}, otherProps, {
|
|
111
|
-
style: {
|
|
112
|
-
cursor: 'pointer'
|
|
113
|
-
}
|
|
114
|
-
}), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
115
|
-
style: {
|
|
116
|
-
height: '100%',
|
|
117
|
-
justifyContent: 'center',
|
|
118
|
-
alignItems: 'center',
|
|
119
|
-
backgroundColor: 'white',
|
|
120
|
-
borderRadius: 16
|
|
121
|
-
}
|
|
122
|
-
}, children)) : null;
|
|
123
|
-
};
|
|
124
|
-
|
|
125
|
-
var _default = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
|
|
126
|
-
const {
|
|
127
|
-
activeSlideScale = _utils2.defaultActiveSlideScale,
|
|
128
|
-
autoplay = _utils2.defaultAutoplay,
|
|
129
|
-
autoplayInterval = _utils2.defaultAutoplayInterval,
|
|
130
|
-
centerMode = false,
|
|
131
|
-
centerSlidePadding = 0,
|
|
132
|
-
data,
|
|
133
|
-
inactiveSlideOpacity = _utils2.defaultInactiveSlideOpacity,
|
|
134
|
-
inactiveSlideScale = _utils2.defaultInactiveSlideScale,
|
|
135
|
-
index,
|
|
136
|
-
infinite = _utils2.defaultInfinite,
|
|
137
|
-
onChange,
|
|
138
|
-
renderItem,
|
|
139
|
-
slidesToScroll = 1,
|
|
140
|
-
slidesToShow = 1,
|
|
141
|
-
arrows = false,
|
|
142
|
-
arrowsStyle = {},
|
|
143
|
-
trackStyle = {}
|
|
144
|
-
} = props;
|
|
145
|
-
|
|
146
|
-
const slickRef = _react.default.useRef(null);
|
|
147
|
-
|
|
148
|
-
const [visibleArrow, setVisibleArrow] = _react.default.useState(false);
|
|
149
|
-
|
|
150
|
-
_react.default.useEffect(() => {
|
|
151
|
-
if (slickRef.current) {
|
|
152
|
-
slickRef.current.slickGoTo(index, false);
|
|
153
|
-
}
|
|
154
|
-
}, [index]);
|
|
155
|
-
|
|
156
|
-
const fixOnClickNotWorkingAfterMobileSwipe = () => {
|
|
157
|
-
// @ts-ignore
|
|
158
|
-
if (slickRef.current && slickRef.current.innerSlider) {
|
|
159
|
-
// @ts-ignore
|
|
160
|
-
slickRef.current.innerSlider.clickHandler = noop;
|
|
161
|
-
}
|
|
162
|
-
};
|
|
163
|
-
|
|
164
|
-
const handleAfterChange = newIndex => {
|
|
165
|
-
fixOnClickNotWorkingAfterMobileSwipe();
|
|
166
|
-
|
|
167
|
-
if (onChange) {
|
|
168
|
-
onChange(newIndex);
|
|
169
|
-
}
|
|
170
|
-
};
|
|
171
|
-
|
|
172
|
-
const handleBeforeChange = () => {
|
|
173
|
-
fixOnClickNotWorkingAfterMobileSwipe();
|
|
174
|
-
};
|
|
175
|
-
|
|
176
|
-
const onPointerOver = () => setVisibleArrow(true);
|
|
177
|
-
|
|
178
|
-
const onPointerLeave = () => setVisibleArrow(false);
|
|
179
|
-
|
|
180
|
-
_react.default.useEffect(() => {
|
|
181
|
-
if (ref) {
|
|
182
|
-
//@ts-ignore
|
|
183
|
-
ref.current = slickRef.current;
|
|
184
|
-
}
|
|
185
|
-
}, []);
|
|
186
|
-
|
|
187
|
-
return /*#__PURE__*/_react.default.createElement(StyledContainer, {
|
|
188
|
-
activeSlideScale: activeSlideScale,
|
|
189
|
-
inactiveSlideOpacity: inactiveSlideOpacity,
|
|
190
|
-
inactiveSlideScale: inactiveSlideScale,
|
|
191
|
-
arrowsStyle: arrowsStyle,
|
|
192
|
-
trackStyle: trackStyle,
|
|
193
|
-
onPointerOver: onPointerOver,
|
|
194
|
-
onPointerLeave: onPointerLeave
|
|
195
|
-
}, /*#__PURE__*/_react.default.createElement(_reactSlick.default, _extends({}, baseSettings, {
|
|
196
|
-
afterChange: handleAfterChange,
|
|
197
|
-
autoplay: autoplay,
|
|
198
|
-
autoplaySpeed: autoplayInterval,
|
|
199
|
-
beforeChange: handleBeforeChange,
|
|
200
|
-
centerMode: centerMode,
|
|
201
|
-
centerPadding: `${centerSlidePadding}px`,
|
|
202
|
-
infinite: infinite,
|
|
203
|
-
initialSlide: index,
|
|
204
|
-
ref: slickRef,
|
|
205
|
-
slidesToScroll: slidesToScroll,
|
|
206
|
-
slidesToShow: slidesToShow,
|
|
207
|
-
arrows: arrows,
|
|
208
|
-
prevArrow: /*#__PURE__*/_react.default.createElement(ArrowContainer, {
|
|
209
|
-
visible: visibleArrow,
|
|
210
|
-
children: /*#__PURE__*/_react.default.createElement(_icons.ChevronLeft, {
|
|
211
|
-
fill: '#767676'
|
|
212
|
-
})
|
|
213
|
-
}),
|
|
214
|
-
nextArrow: /*#__PURE__*/_react.default.createElement(ArrowContainer, {
|
|
215
|
-
visible: visibleArrow,
|
|
216
|
-
children: /*#__PURE__*/_react.default.createElement(_icons.ChevronRight, {
|
|
217
|
-
fill: '#767676'
|
|
218
|
-
})
|
|
219
|
-
})
|
|
220
|
-
}), (0, _utils.mapIndexed)((item, index) => {
|
|
221
|
-
const child = renderItem({
|
|
222
|
-
item,
|
|
223
|
-
index
|
|
224
|
-
});
|
|
225
|
-
|
|
226
|
-
if (child) {
|
|
227
|
-
return /*#__PURE__*/_react.default.cloneElement(child, {
|
|
228
|
-
key: index
|
|
229
|
-
});
|
|
230
|
-
}
|
|
231
|
-
|
|
232
|
-
return child;
|
|
233
|
-
}, data)));
|
|
234
|
-
});
|
|
235
|
-
|
|
236
|
-
exports.default = _default;
|
|
237
|
-
//# sourceMappingURL=CarouselWeb.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["CarouselWeb.tsx"],"names":["baseSettings","dots","draggable","lazyLoad","window","undefined","pauseOnFocus","pauseOnHover","rows","swipe","slidesPerRow","vertical","noop","StyledContainer","styled","div","props","display","position","userSelect","overflow","margin","padding","outline","cursor","transform","top","left","content","clear","trackStyle","float","height","minHeight","justifyContent","inactiveSlideScale","transition","opacity","inactiveSlideOpacity","activeSlideScale","arrowsStyle","ArrowContainer","children","currentSlide","slideCount","visible","otherProps","alignItems","backgroundColor","borderRadius","React","forwardRef","ref","defaultActiveSlideScale","autoplay","defaultAutoplay","autoplayInterval","defaultAutoplayInterval","centerMode","centerSlidePadding","data","defaultInactiveSlideOpacity","defaultInactiveSlideScale","index","infinite","defaultInfinite","onChange","renderItem","slidesToScroll","slidesToShow","arrows","slickRef","useRef","visibleArrow","setVisibleArrow","useState","useEffect","current","slickGoTo","fixOnClickNotWorkingAfterMobileSwipe","innerSlider","clickHandler","handleAfterChange","newIndex","handleBeforeChange","onPointerOver","onPointerLeave","item","child","cloneElement","key"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport Slick, { Settings } from 'react-slick';\nimport styled from '@emotion/styled';\nimport { ChevronLeft, ChevronRight } from '@fountain-ui/icons';\nimport { mapIndexed } from '@fountain-ui/utils';\nimport type CarouselProps from './CarouselProps';\nimport {\n defaultActiveSlideScale,\n defaultAutoplay,\n defaultAutoplayInterval,\n defaultInactiveSlideOpacity,\n defaultInactiveSlideScale,\n defaultInfinite,\n} from './utils';\n\nconst baseSettings: Settings = {\n dots: false,\n draggable: true,\n lazyLoad: typeof window === 'undefined' ? undefined : 'ondemand',\n pauseOnFocus: true,\n pauseOnHover: true,\n rows: 1,\n swipe: true,\n slidesPerRow: 1,\n vertical: false,\n};\n\nconst noop = () => void 0;\n\nconst StyledContainer: any = styled.div((props: any) => ({\n ['& .slick-slider']: {\n display: 'block',\n position: 'relative',\n userSelect: 'none',\n },\n ['& .slick-list']: {\n display: 'block',\n position: 'relative',\n overflow: 'hidden',\n margin: 0,\n padding: 0,\n ['&:focus']: {\n outline: 'none',\n },\n ['&.dragging']: {\n cursor: 'pointer',\n },\n },\n ['& .slick-slider .slick-track, &.slick-slider .slick-list']: {\n transform: 'translate3d(0, 0, 0)',\n },\n ['& .slick-track']: {\n display: 'block',\n position: 'relative',\n top: 0,\n left: 0,\n ['&:before, &:after']: {\n display: 'table',\n content: '\\'\\'',\n },\n ['&:after']: {\n clear: 'both',\n },\n ...props.trackStyle,\n },\n ['& .slick-slide']: {\n display: 'none',\n float: 'left',\n height: '100%',\n minHeight: 1,\n ['& > div']: {\n justifyContent: 'center',\n display: 'flex',\n transform: `scale(${props.inactiveSlideScale})`,\n transition: 'transform .5s',\n opacity: props.inactiveSlideOpacity,\n },\n },\n ['& .slick-current > div']: {\n transform: `scale(${props.activeSlideScale})`,\n opacity: 1,\n },\n ['& .slick-initialized .slick-slide']: {\n display: 'block',\n },\n ...props.arrowsStyle,\n}));\n\ninterface ArrowContainerProps {\n children: React.ReactElement;\n visible: boolean;\n currentSlide?: any;\n slideCount?: any;\n}\n\nconst ArrowContainer = (props: ArrowContainerProps) => {\n const {\n children,\n currentSlide,\n slideCount,\n visible,\n ...otherProps\n } = props;\n\n return visible ? (\n // If root component is not a div, there's no arrow class.\n <div {...otherProps} style={{ cursor: 'pointer' }}>\n <View\n style={{\n height: '100%',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: 'white',\n borderRadius: 16,\n }}\n >\n {children}\n </View>\n </div>\n ) : null;\n};\n\nexport default React.forwardRef((props: CarouselProps, ref) => {\n const {\n activeSlideScale = defaultActiveSlideScale,\n autoplay = defaultAutoplay,\n autoplayInterval = defaultAutoplayInterval,\n centerMode = false,\n centerSlidePadding = 0,\n data,\n inactiveSlideOpacity = defaultInactiveSlideOpacity,\n inactiveSlideScale = defaultInactiveSlideScale,\n index,\n infinite = defaultInfinite,\n onChange,\n renderItem,\n slidesToScroll = 1,\n slidesToShow = 1,\n arrows = false,\n arrowsStyle = {},\n trackStyle = {},\n } = props;\n\n const slickRef = React.useRef<Slick | null>(null);\n const [visibleArrow, setVisibleArrow] = React.useState(false);\n\n React.useEffect(() => {\n if (slickRef.current) {\n slickRef.current.slickGoTo(index, false);\n }\n }, [index]);\n\n const fixOnClickNotWorkingAfterMobileSwipe = () => {\n // @ts-ignore\n if (slickRef.current && slickRef.current.innerSlider) {\n // @ts-ignore\n slickRef.current.innerSlider.clickHandler = noop;\n }\n };\n\n const handleAfterChange = (newIndex: number) => {\n fixOnClickNotWorkingAfterMobileSwipe();\n\n if (onChange) {\n onChange(newIndex);\n }\n };\n\n const handleBeforeChange = () => {\n fixOnClickNotWorkingAfterMobileSwipe();\n };\n\n const onPointerOver = () => setVisibleArrow(true);\n const onPointerLeave = () => setVisibleArrow(false);\n\n React.useEffect(() => {\n if (ref) {\n //@ts-ignore\n ref.current = slickRef.current;\n }\n }, []);\n\n return (\n <StyledContainer\n activeSlideScale={activeSlideScale}\n inactiveSlideOpacity={inactiveSlideOpacity}\n inactiveSlideScale={inactiveSlideScale}\n arrowsStyle={arrowsStyle}\n trackStyle={trackStyle}\n onPointerOver={onPointerOver}\n onPointerLeave={onPointerLeave}\n >\n <Slick\n {...baseSettings}\n afterChange={handleAfterChange}\n autoplay={autoplay}\n autoplaySpeed={autoplayInterval}\n beforeChange={handleBeforeChange}\n centerMode={centerMode}\n centerPadding={`${centerSlidePadding}px`}\n infinite={infinite}\n initialSlide={index}\n ref={slickRef}\n slidesToScroll={slidesToScroll}\n slidesToShow={slidesToShow}\n arrows={arrows}\n prevArrow={<ArrowContainer visible={visibleArrow} children={<ChevronLeft fill={'#767676'}/>}/>}\n nextArrow={<ArrowContainer visible={visibleArrow} children={<ChevronRight fill={'#767676'}/>}/>}\n >\n {mapIndexed((item, index) => {\n const child = renderItem({ item, index });\n\n if (child) {\n return React.cloneElement(child, { key: index });\n }\n return child;\n }, data)}\n </Slick>\n </StyledContainer>\n );\n});\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["index.native.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA","sourcesContent":["export { default } from './CarouselNative';"]}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.defaultInfinite = exports.defaultActiveSlideScale = exports.defaultInactiveSlideScale = exports.defaultInactiveSlideOpacity = exports.defaultAutoplayInterval = exports.defaultAutoplay = void 0;
|
|
7
|
-
const defaultAutoplay = false;
|
|
8
|
-
exports.defaultAutoplay = defaultAutoplay;
|
|
9
|
-
const defaultAutoplayInterval = 3000;
|
|
10
|
-
exports.defaultAutoplayInterval = defaultAutoplayInterval;
|
|
11
|
-
const defaultInactiveSlideOpacity = 1;
|
|
12
|
-
exports.defaultInactiveSlideOpacity = defaultInactiveSlideOpacity;
|
|
13
|
-
const defaultInactiveSlideScale = 0.9;
|
|
14
|
-
exports.defaultInactiveSlideScale = defaultInactiveSlideScale;
|
|
15
|
-
const defaultActiveSlideScale = 1;
|
|
16
|
-
exports.defaultActiveSlideScale = defaultActiveSlideScale;
|
|
17
|
-
const defaultInfinite = false;
|
|
18
|
-
exports.defaultInfinite = defaultInfinite;
|
|
19
|
-
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["utils.ts"],"names":["defaultAutoplay","defaultAutoplayInterval","defaultInactiveSlideOpacity","defaultInactiveSlideScale","defaultActiveSlideScale","defaultInfinite"],"mappings":";;;;;;AAAO,MAAMA,eAAe,GAAG,KAAxB;;AAEA,MAAMC,uBAAuB,GAAG,IAAhC;;AAEA,MAAMC,2BAA2B,GAAG,CAApC;;AAEA,MAAMC,yBAAyB,GAAG,GAAlC;;AAEA,MAAMC,uBAAuB,GAAG,CAAhC;;AAEA,MAAMC,eAAe,GAAG,KAAxB","sourcesContent":["export const defaultAutoplay = false;\n\nexport const defaultAutoplayInterval = 3000;\n\nexport const defaultInactiveSlideOpacity = 1;\n\nexport const defaultInactiveSlideScale = 0.9;\n\nexport const defaultActiveSlideScale = 1;\n\nexport const defaultInfinite = false;\n"]}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = useWidth;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
function useWidth() {
|
|
15
|
-
const window = (0, _reactNative.useWindowDimensions)();
|
|
16
|
-
|
|
17
|
-
const [width, setWidth] = _react.default.useState(window.width);
|
|
18
|
-
|
|
19
|
-
const onLayout = _react.default.useCallback(e => {
|
|
20
|
-
const newWidth = e.nativeEvent.layout.width;
|
|
21
|
-
|
|
22
|
-
if (newWidth > 0 && Math.round(newWidth) !== Math.round(width)) {
|
|
23
|
-
setWidth(newWidth);
|
|
24
|
-
}
|
|
25
|
-
}, []);
|
|
26
|
-
|
|
27
|
-
return [width, onLayout];
|
|
28
|
-
}
|
|
29
|
-
//# sourceMappingURL=useWidth.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useWidth.ts"],"names":["useWidth","window","width","setWidth","React","useState","onLayout","useCallback","e","newWidth","nativeEvent","layout","Math","round"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEe,SAASA,QAAT,GAAqD;AAChE,QAAMC,MAAM,GAAG,uCAAf;;AACA,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoBC,eAAMC,QAAN,CAAeJ,MAAM,CAACC,KAAtB,CAA1B;;AAEA,QAAMI,QAAQ,GAAGF,eAAMG,WAAN,CAAmBC,CAAD,IAA0B;AACzD,UAAMC,QAAQ,GAAGD,CAAC,CAACE,WAAF,CAAcC,MAAd,CAAqBT,KAAtC;;AAEA,QAAIO,QAAQ,GAAG,CAAX,IAAgBG,IAAI,CAACC,KAAL,CAAWJ,QAAX,MAAyBG,IAAI,CAACC,KAAL,CAAWX,KAAX,CAA7C,EAAgE;AAC5DC,MAAAA,QAAQ,CAACM,QAAD,CAAR;AACH;AACJ,GANgB,EAMd,EANc,CAAjB;;AAQA,SAAO,CAACP,KAAD,EAAQI,QAAR,CAAP;AACH","sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, useWindowDimensions, ViewProps } from 'react-native';\n\nexport default function useWidth(): [number, ViewProps['onLayout']] {\n const window = useWindowDimensions();\n const [width, setWidth] = React.useState(window.width);\n\n const onLayout = React.useCallback((e: LayoutChangeEvent) => {\n const newWidth = e.nativeEvent.layout.width;\n\n if (newWidth > 0 && Math.round(newWidth) !== Math.round(width)) {\n setWidth(newWidth);\n }\n }, []);\n\n return [width, onLayout];\n}"]}
|