/
scrollbar.ts
140 lines (116 loc) · 3.42 KB
/
scrollbar.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
import {
TrackController,
} from './track';
import { Data2d } from './data-2d';
// Scrollbar.options
export type ScrollbarOptions = {
/**
* Momentum reduction damping factor, a float value between `(0, 1)`. The lower the value is, the more smooth the scrolling will be (also the more paint frames).
* @default 0.1
*/
damping: number,
/**
* Minimal size for scrollbar thumbs.
* @default 20
*/
thumbMinSize: number,
/**
* Render every frame in integer pixel values, set to `true` to **improve** scrolling performance.
* @default true
*/
renderByPixels: boolean,
/**
* Keep scrollbar tracks visible.
* @default false
*/
alwaysShowTracks: boolean,
/**
* Set to `true` to allow outer scrollbars continue scrolling when current scrollbar reaches edge.
* @default true
*/
continuousScrolling: boolean,
/**
* Delegate wheel events and touch events to the given element. By default, the container element is used. This option will be useful for dealing with fixed elements.
* @default null
*/
delegateTo: EventTarget | null,
/**
* @deprecated `wheelEventTarget` is deprecated and will be removed in the future, use `delegateTo` instead.
*/
wheelEventTarget: EventTarget | null,
/**
* Options for plugins, see {@link https://github.com/idiotWu/smooth-scrollbar/blob/develop/docs/plugin.md Plugin System}.
*/
plugins: any,
};
// Scrollbar.size
export type Metrics = {
width: number,
height: number,
};
export type ScrollbarSize = {
container: Metrics,
content: Metrics,
};
// Scrollbar.bounding
export type ScrollbarBounding = {
top: number,
right: number,
bottom: number,
left: number,
};
// Scrolling Listener
export type ScrollStatus = {
offset: Data2d,
limit: Data2d,
};
export interface ScrollListener {
(this: Scrollbar, status: ScrollStatus): void;
}
// `scrollTo` options
export type ScrollToOptions = {
callback: (this: Scrollbar) => void,
easing: (percent: number) => number,
};
// `setPosition` options
export type SetPositionOptions = {
withoutCallbacks: boolean,
};
// `scrollIntoView` options
export type ScrollIntoViewOptions = {
alignToTop: boolean,
onlyScrollIfNeeded: boolean,
offsetTop: number,
offsetLeft: number,
offsetBottom: number,
};
export interface AddTransformableMomentumCallback {
(this: Scrollbar, willScroll: boolean): void;
}
// Scrollbar Class
export interface Scrollbar {
readonly parent: Scrollbar | null;
readonly containerEl: HTMLElement;
readonly contentEl: HTMLElement;
readonly track: TrackController;
readonly options: ScrollbarOptions;
bounding: ScrollbarBounding;
size: ScrollbarSize;
offset: Data2d;
limit: Data2d;
scrollTop: number;
scrollLeft: number;
destroy(): void;
update(): void;
getSize(): ScrollbarSize;
isVisible(elem: HTMLElement): boolean;
addListener(fn: ScrollListener): void;
removeListener(fn: ScrollListener): void;
addTransformableMomentum(x: number, y: number, fromEvent: Event, callback?: AddTransformableMomentumCallback): void;
addMomentum(x: number, y: number): void;
setMomentum(x: number, y: number): void;
scrollTo(x?: number, y?: number, duration?: number, options?: Partial<ScrollToOptions>): void;
setPosition(x?: number, y?: number, options?: Partial<SetPositionOptions>): void;
scrollIntoView(elem: HTMLElement, options?: Partial<ScrollIntoViewOptions>): void;
updatePluginOptions(pluginName: string, options?: any): void;
}