import {useDerivedValue} from "react-native-reanimated"

import type {SheetPositionValue} from "../utils"
import {useBottomSheetKeyboardDismiss, useLayoutSharedValue} from "../hooks"
import {InvisibleView} from "./invisible-view"

interface BottomSheetKeyboardDismissMarkerProps {
    extraOffset?: number
}

/**
 * A marker component that we can use to identify a point within the bottom-sheet
 * for which the keyboard should be dismissed should the point fall behind the keyboard.
 * Note: this does inject an invisible View into the tree, which may impact layout.
 */
export function BottomSheetKeyboardDismissMarker({
    extraOffset = 0,
}: BottomSheetKeyboardDismissMarkerProps) {
    const {onLayout, y} = useLayoutSharedValue(undefined, 0)

    const yWithExtra = useDerivedValue<SheetPositionValue>(
        () => y.get() + extraOffset,
        [y, extraOffset]
    )

    useBottomSheetKeyboardDismiss(yWithExtra)

    return <InvisibleView onLayout={onLayout} />
}