/// <reference types="react" />
import type { LayoutRectangle, NativeScrollEvent, NativeSyntheticEvent, StyleProp, ViewStyle } from 'react-native';
import { SharedValue } from 'react-native-reanimated';
/**
 * The props supplied to the large header component of this scroll container.
 */
export interface ScrollLargeHeaderProps {
    /**
     * The scroll position of the scroll view.
     *
     * @type {SharedValue<number>}
     */
    scrollY: SharedValue<number>;
    /**
     * Animated value between 0 and 1 that indicates whether the small header's content should be
     * visible. This is used to animate the header's content in and out.
     *
     * @type {SharedValue<number>}
     */
    showNavBar: SharedValue<number>;
}
/**
 * The props supplied to the large header subtitle component of this scroll container.
 */
export interface ScrollLargeHeaderSubtitleProps {
    /**
     * The scroll position of the scroll view.
     *
     * @type {SharedValue<number>}
     */
    scrollY: SharedValue<number>;
    /**
     * Animated value between 0 and 1 that indicates whether the small header's content should be
     * visible. This is used to animate the header's content in and out.
     *
     * @type {SharedValue<number>}
     */
    showNavBar: SharedValue<number>;
}
export interface ScrollHeaderProps {
    /**
     * Animated value between 0 and 1 that indicates whether the small header's content should be
     * visible.
     *
     * @type {SharedValue<number>}
     */
    showNavBar: SharedValue<number>;
    /**
     * The scroll position of the scroll view.
     *
     * @type {SharedValue<number>}
     */
    scrollY: SharedValue<number>;
}
/**
 * The props for the scroll container. This is a container that has a large header component that
 * is rendered under the navigation bar. The navigation bar is rendered on top of the scroll view.
 */
export type SharedScrollContainerProps = {
    /**
     * Whether or not the large header should be shown. This is used to animate the large header in
     * and out.
     */
    largeHeaderShown?: SharedValue<number>;
    /**
     * The large header component. This is the component that is rendered under the navigation bar.
     *
     * @param {ScrollLargeHeaderProps} props The props given to the large header component.
     * @returns {React.ReactNode}
     */
    LargeHeaderComponent?: (props: ScrollLargeHeaderProps) => React.ReactNode;
    /**
     * The subtitle component for the large header component. This is the component that is rendered below the large header component.
     *
     * @param {ScrollLargeHeaderSubtitleProps} props The props given to the large header subtitle component.
     * @returns {React.ReactNode}
     */
    LargeHeaderSubtitleComponent?: (props: ScrollLargeHeaderSubtitleProps) => React.ReactNode;
    /**
     * The small header component. This is the component that is rendered on top of the scroll view.
     *
     * @param {ScrollHeaderProps} props The props given to the small header component.
     * @returns {React.ReactNode}
     */
    HeaderComponent: (props: ScrollHeaderProps) => React.ReactNode;
    /**
     * This is executed when the onLayout event is fired on the large header container component.
     */
    onLargeHeaderLayout?: (rect: LayoutRectangle) => void;
    /**
     * The large header's container style.
     *
     * @default undefined
     */
    largeHeaderContainerStyle?: StyleProp<ViewStyle>;
    /**
     * The style of the root container of the scoll container.
     *
     * @default undefined
     */
    containerStyle?: StyleProp<ViewStyle>;
    /**
     * Whether the scroll container should ignore the left safe area. This is useful for landscape
     * mode on iOS where devices have a notch/status bar on the left side.
     *
     * @default false
     */
    ignoreLeftSafeArea?: boolean;
    /**
     * Whether the scroll container should ignore the right safe area. This is useful for landscape
     * mode on iOS where devices have a notch/status bar on the right side.
     *
     * @default false
     */
    ignoreRightSafeArea?: boolean;
    /**
     * Disables the auto fix scroll mechanism. This is useful if you want to disable the auto scroll
     * when the large header is partially visible.
     *
     * @default false
     */
    disableAutoFixScroll?: boolean;
    /**
     * Fires if a user initiates a scroll gesture.
     */
    onScrollBeginDrag?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
    /**
     * Fires when a user has finished scrolling.
     */
    onScrollEndDrag?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
    /**
     * Fires when scroll view has begun moving.
     */
    onMomentumScrollBegin?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
    /**
     * Fires when scroll view has finished moving.
     */
    onMomentumScrollEnd?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
    /**
     * A custom worklet that allows custom tracking scroll container's
     * state (i.e., its scroll contentInset, contentOffset, etc.). Please
     * ensure that this function is a [worklet](https://docs.swmansion.com/react-native-reanimated/docs/2.x/fundamentals/worklets/).
     *
     * @example
     * ```
     * const scrollHandlerWorklet = (evt: NativeScrollEvent) => {
     *   'worklet';
     *   console.log('offset: ', evt.contentOffset);
     * };
     * ```
     */
    onScrollWorklet?: (evt: NativeScrollEvent) => void;
    /**
     * This property controls whether or not the header component is absolutely positioned.
     * This is useful if you want to render a header component that allows for transparency.
     */
    absoluteHeader?: boolean;
    /**
     * This property is used when `absoluteHeader` is true. This is the initial height of the
     * absolute header. Since the header's height is computed on its layout event, this is used
     * to set the initial height of the header so that it doesn't jump when it is initially rendered.
     */
    initialAbsoluteHeaderHeight?: number;
    /**
     * A number between 0 and 1 representing at what point the header should fade in,
     * based on the percentage of the LargeHeader's height. For example, if this is set to 0.5,
     * the header will fade in when the scroll position is at 50% of the LargeHeader's height.
     *
     * @default 1
     */
    headerFadeInThreshold?: number;
    /**
     * Whether or not the LargeHeaderComponent should fade in and out.
     *
     * @default {false}
     * */
    disableLargeHeaderFadeAnim?: boolean;
};
//# sourceMappingURL=types.d.ts.map