[Home](./index.md) > [@empathyco/x-components](./x-components.md) > [BaseScroll](./x-components.basescroll.md) ## BaseScroll variable Base scroll component that depending on the user interactivity emits different events for knowing when the user scrolls, the direction of scroll and if user reaches the start or end. **Signature:** ```typescript _default: import("vue").DefineComponent; default: () => string[]; }; }>, { throttledStoreScrollData: import("vue").ComputedRef>; baseScrollEl: import("vue").Ref; }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("scroll" | "scroll:at-start" | "scroll:almost-at-end" | "scroll:at-end" | "scroll:direction-change")[], "scroll" | "scroll:at-start" | "scroll:almost-at-end" | "scroll:at-end" | "scroll:direction-change", import("vue").PublicProps, Readonly; default: () => string[]; }; }>> & Readonly<{ onScroll?: ((...args: any[]) => any) | undefined; "onScroll:at-start"?: ((...args: any[]) => any) | undefined; "onScroll:almost-at-end"?: ((...args: any[]) => any) | undefined; "onScroll:at-end"?: ((...args: any[]) => any) | undefined; "onScroll:direction-change"?: ((...args: any[]) => any) | undefined; }>, { distanceToBottom: number; firstElementThresholdPx: number; throttleMs: number; resetOnChange: boolean; resetOn: keyof import("../../wiring/events.types").XEventsTypes | (keyof import("../../wiring/events.types").XEventsTypes)[]; }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> ```