@fountain-ui/core 3.0.0-alpha.40 → 3.0.0-alpha.41

package/build/commonjs/hooks/useCollapsibleAppBar.js

@@ -82,6 +82,15 @@ function useCollapsibleAppBar() {
       translateY.value = (0, _reactNativeReanimated.withTiming)(0, ANIMATION_CONFIG);
     }
   }, [appBarHeight]);
+  const recoverAppBar = (0, _react.useCallback)(() => {
+    const currentIndex = indexRef.current;
+    offsetsRef.current[currentIndex] = 0;
+    lastOffsetY.value = 0;
+    translateY.value = (0, _reactNativeReanimated.withTiming)(0, ANIMATION_CONFIG);
+    lastTranslateY.value = 0;
+    overlapped.value = false;
+    setIsScrolled(false);
+  }, []);
   const scrollHandler = (0, _reactNativeReanimated.useAnimatedScrollHandler)({
     onBeginDrag: () => {
       if (keyboardDismissMode === 'on-drag') {
@@ -150,6 +159,7 @@ function useCollapsibleAppBar() {
     onCollapsibleToolbarLayout,
     onScroll: scrollHandler,
     onScrollViewChanged,
+    recoverAppBar,
     scrollContentInsets: {
       top: hasCollapsible ? appBarHeight : 0
     },

package/build/commonjs/hooks/useCollapsibleAppBar.js.map

@@ -1 +1 @@
-{"version":3,"names":["defaultOptions","keyboardDismissMode","supportsReverseScroll","minVisibleHeight","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","Platform","OS","dismissKeyboard","Keyboard","dismiss","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","safeMinVisibleHeight","Math","min","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","useState","animatedStyle","useAnimatedStyle","transform","value","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n    runOnJS,\n    useAnimatedScrollHandler,\n    useAnimatedStyle,\n    useDerivedValue,\n    useSharedValue,\n    withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    supportsReverseScroll?: boolean;\n    minVisibleHeight?: number;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n    isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    supportsReverseScroll: true,\n    minVisibleHeight: 0,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, supportsReverseScroll, minVisibleHeight }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = useDerivedValue(() => {\n        const safeMinVisibleHeight = Math.min(minVisibleHeight, collapsibleToolbarHeight);\n        return -(collapsibleToolbarHeight - safeMinVisibleHeight);\n    }, [collapsibleToolbarHeight, minVisibleHeight]);\n\n    const translateY = useSharedValue<number>(0);\n    const lastTranslateY = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const overlapped = useSharedValue<boolean>(false);\n\n    const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n        };\n    }, [translateY]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = withTiming(0, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(dismissKeyboard)();\n            }\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            if (!isScrolled && offsetY > 0) {\n                runOnJS(setIsScrolled)(true);\n            } else if (isScrolled && offsetY <= 0) {\n                runOnJS(setIsScrolled)(false);\n            }\n\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = safeOffsetY <= minOffsetY\n                    ? 0\n                    : supportsReverseScroll\n                        ? dy === 0\n                            ? lastTranslateY.value\n                            : dy > 0\n                                ? maxTy\n                                : 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\n\n                overlapped.value = offsetY > 0;\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        { paddingTop: safeAreaInsets.top },\n        hasCollapsible ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n        isScrolled,\n    };\n};\n"],"mappings":"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"}
+{"version":3,"names":["defaultOptions","keyboardDismissMode","supportsReverseScroll","minVisibleHeight","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","Platform","OS","dismissKeyboard","Keyboard","dismiss","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","safeMinVisibleHeight","Math","min","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","useState","animatedStyle","useAnimatedStyle","transform","value","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","recoverAppBar","currentIndex","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n    runOnJS,\n    useAnimatedScrollHandler,\n    useAnimatedStyle,\n    useDerivedValue,\n    useSharedValue,\n    withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    supportsReverseScroll?: boolean;\n    minVisibleHeight?: number;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    recoverAppBar: () => void;\n    scrollContentInsets: ContentInsets;\n    isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    supportsReverseScroll: true,\n    minVisibleHeight: 0,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, supportsReverseScroll, minVisibleHeight }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = useDerivedValue(() => {\n        const safeMinVisibleHeight = Math.min(minVisibleHeight, collapsibleToolbarHeight);\n        return -(collapsibleToolbarHeight - safeMinVisibleHeight);\n    }, [collapsibleToolbarHeight, minVisibleHeight]);\n\n    const translateY = useSharedValue<number>(0);\n    const lastTranslateY = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const overlapped = useSharedValue<boolean>(false);\n\n    const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n        };\n    }, [translateY]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = withTiming(0, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\n\n    const recoverAppBar = useCallback(() => {\n        const currentIndex = indexRef.current;\n\n        offsetsRef.current[currentIndex] = 0;\n\n        lastOffsetY.value = 0;\n\n        translateY.value = withTiming(0, ANIMATION_CONFIG);\n        lastTranslateY.value = 0;\n\n        overlapped.value = false;\n\n        setIsScrolled(false);\n    }, []);\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(dismissKeyboard)();\n            }\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            if (!isScrolled && offsetY > 0) {\n                runOnJS(setIsScrolled)(true);\n            } else if (isScrolled && offsetY <= 0) {\n                runOnJS(setIsScrolled)(false);\n            }\n\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = safeOffsetY <= minOffsetY\n                    ? 0\n                    : supportsReverseScroll\n                        ? dy === 0\n                            ? lastTranslateY.value\n                            : dy > 0\n                                ? maxTy\n                                : 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\n\n                overlapped.value = offsetY > 0;\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        { paddingTop: safeAreaInsets.top },\n        hasCollapsible ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        recoverAppBar,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n        isScrolled,\n    };\n};\n"],"mappings":"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"}

package/build/module/hooks/useCollapsibleAppBar.js

@@ -67,6 +67,15 @@ export default function useCollapsibleAppBar() {
       translateY.value = withTiming(0, ANIMATION_CONFIG);
     }
   }, [appBarHeight]);
+  const recoverAppBar = useCallback(() => {
+    const currentIndex = indexRef.current;
+    offsetsRef.current[currentIndex] = 0;
+    lastOffsetY.value = 0;
+    translateY.value = withTiming(0, ANIMATION_CONFIG);
+    lastTranslateY.value = 0;
+    overlapped.value = false;
+    setIsScrolled(false);
+  }, []);
   const scrollHandler = useAnimatedScrollHandler({
     onBeginDrag: () => {
       if (keyboardDismissMode === 'on-drag') {
@@ -135,6 +144,7 @@ export default function useCollapsibleAppBar() {
     onCollapsibleToolbarLayout,
     onScroll: scrollHandler,
     onScrollViewChanged,
+    recoverAppBar,
     scrollContentInsets: {
       top: hasCollapsible ? appBarHeight : 0
     },

package/build/module/hooks/useCollapsibleAppBar.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useRef","useState","Keyboard","Platform","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useHeight","useAppbarStyles","defaultOptions","keyboardDismissMode","supportsReverseScroll","minVisibleHeight","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","OS","dismissKeyboard","dismiss","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","safeMinVisibleHeight","Math","min","translateY","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","animatedStyle","transform","value","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n    runOnJS,\n    useAnimatedScrollHandler,\n    useAnimatedStyle,\n    useDerivedValue,\n    useSharedValue,\n    withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    supportsReverseScroll?: boolean;\n    minVisibleHeight?: number;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n    isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    supportsReverseScroll: true,\n    minVisibleHeight: 0,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, supportsReverseScroll, minVisibleHeight }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = useDerivedValue(() => {\n        const safeMinVisibleHeight = Math.min(minVisibleHeight, collapsibleToolbarHeight);\n        return -(collapsibleToolbarHeight - safeMinVisibleHeight);\n    }, [collapsibleToolbarHeight, minVisibleHeight]);\n\n    const translateY = useSharedValue<number>(0);\n    const lastTranslateY = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const overlapped = useSharedValue<boolean>(false);\n\n    const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n        };\n    }, [translateY]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = withTiming(0, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(dismissKeyboard)();\n            }\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            if (!isScrolled && offsetY > 0) {\n                runOnJS(setIsScrolled)(true);\n            } else if (isScrolled && offsetY <= 0) {\n                runOnJS(setIsScrolled)(false);\n            }\n\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = safeOffsetY <= minOffsetY\n                    ? 0\n                    : supportsReverseScroll\n                        ? dy === 0\n                            ? lastTranslateY.value\n                            : dy > 0\n                                ? maxTy\n                                : 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\n\n                overlapped.value = offsetY > 0;\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        { paddingTop: safeAreaInsets.top },\n        hasCollapsible ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n        isScrolled,\n    };\n};\n"],"mappings":"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"}
+{"version":3,"names":["useCallback","useRef","useState","Keyboard","Platform","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useHeight","useAppbarStyles","defaultOptions","keyboardDismissMode","supportsReverseScroll","minVisibleHeight","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","OS","dismissKeyboard","dismiss","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","safeMinVisibleHeight","Math","min","translateY","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","animatedStyle","transform","value","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","recoverAppBar","currentIndex","scrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n    runOnJS,\n    useAnimatedScrollHandler,\n    useAnimatedStyle,\n    useDerivedValue,\n    useSharedValue,\n    withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    supportsReverseScroll?: boolean;\n    minVisibleHeight?: number;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    recoverAppBar: () => void;\n    scrollContentInsets: ContentInsets;\n    isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    supportsReverseScroll: true,\n    minVisibleHeight: 0,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, supportsReverseScroll, minVisibleHeight }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = useDerivedValue(() => {\n        const safeMinVisibleHeight = Math.min(minVisibleHeight, collapsibleToolbarHeight);\n        return -(collapsibleToolbarHeight - safeMinVisibleHeight);\n    }, [collapsibleToolbarHeight, minVisibleHeight]);\n\n    const translateY = useSharedValue<number>(0);\n    const lastTranslateY = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const overlapped = useSharedValue<boolean>(false);\n\n    const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n        };\n    }, [translateY]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = withTiming(0, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\n\n    const recoverAppBar = useCallback(() => {\n        const currentIndex = indexRef.current;\n\n        offsetsRef.current[currentIndex] = 0;\n\n        lastOffsetY.value = 0;\n\n        translateY.value = withTiming(0, ANIMATION_CONFIG);\n        lastTranslateY.value = 0;\n\n        overlapped.value = false;\n\n        setIsScrolled(false);\n    }, []);\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(dismissKeyboard)();\n            }\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            if (!isScrolled && offsetY > 0) {\n                runOnJS(setIsScrolled)(true);\n            } else if (isScrolled && offsetY <= 0) {\n                runOnJS(setIsScrolled)(false);\n            }\n\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = safeOffsetY <= minOffsetY\n                    ? 0\n                    : supportsReverseScroll\n                        ? dy === 0\n                            ? lastTranslateY.value\n                            : dy > 0\n                                ? maxTy\n                                : 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\n\n                overlapped.value = offsetY > 0;\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        { paddingTop: safeAreaInsets.top },\n        hasCollapsible ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        recoverAppBar,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n        isScrolled,\n    };\n};\n"],"mappings":"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"}

package/build/typescript/hooks/useCollapsibleAppBar.d.ts

@@ -22,6 +22,7 @@ export interface CollapsibleAppBar {
     onCollapsibleToolbarLayout: OnLayoutCallback;
     onScroll: OnScroll;
     onScrollViewChanged: (index: number) => void;
+    recoverAppBar: () => void;
     scrollContentInsets: ContentInsets;
     isScrolled: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fountain-ui/core",
-  "version": "3.0.0-alpha.40",
+  "version": "3.0.0-alpha.41",
   "author": "Fountain-UI Team",
   "description": "React components that implement Tappytoon's Fountain Design.",
   "license": "MIT",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "ffc27e77f54ab3838adf230df7395c9d68055513"
+  "gitHead": "9e2a6b64b8a06914bf89b689a3376da01a8d9ee3"
 }

package/src/hooks/useCollapsibleAppBar.ts

@@ -40,6 +40,7 @@ export interface CollapsibleAppBar {
     onCollapsibleToolbarLayout: OnLayoutCallback;
     onScroll: OnScroll;
     onScrollViewChanged: (index: number) => void;
+    recoverAppBar: () => void;
     scrollContentInsets: ContentInsets;
     isScrolled: boolean;
 }
@@ -114,6 +115,21 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
         }
     }, [appBarHeight]);
 
+    const recoverAppBar = useCallback(() => {
+        const currentIndex = indexRef.current;
+
+        offsetsRef.current[currentIndex] = 0;
+
+        lastOffsetY.value = 0;
+
+        translateY.value = withTiming(0, ANIMATION_CONFIG);
+        lastTranslateY.value = 0;
+
+        overlapped.value = false;
+
+        setIsScrolled(false);
+    }, []);
+
     const scrollHandler = useAnimatedScrollHandler({
         onBeginDrag: () => {
             if (keyboardDismissMode === 'on-drag') {
@@ -207,6 +223,7 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
         onCollapsibleToolbarLayout,
         onScroll: scrollHandler,
         onScrollViewChanged,
+        recoverAppBar,
         scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },
         isScrolled,
     };