Skip to content

Commit 2d044a0

Browse files
CXBoyySMAKSS
authored andcommitted
fix: remove ternary operators for code readability
1 parent bbaf4f1 commit 2d044a0

File tree

1 file changed

+41
-38
lines changed

1 file changed

+41
-38
lines changed

src/index.ts

Lines changed: 41 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ type ScrollProps = {
7272
/**
7373
* The target represents the scrollable element to check for scroll detection.
7474
*/
75-
target?: HTMLDivElement;
75+
target?: HTMLDivElement | Window;
7676
/**
7777
* The thr represents the threshold value for scroll detection.
7878
*/
@@ -151,14 +151,15 @@ function useDetectScroll(props: ScrollProps = {}): ScrollInfo {
151151

152152
/** Function to update scroll direction */
153153
const updateScrollDir = useCallback(() => {
154-
const scroll =
155-
target instanceof Window
156-
? axis === Axis.Y
157-
? window.scrollY
158-
: window.scrollX
159-
: axis === Axis.Y
160-
? target.scrollTop
161-
: target.scrollLeft;
154+
let scroll: number;
155+
if (target instanceof Window) {
156+
scroll = axis === Axis.Y ? target.scrollY : target.scrollX;
157+
} else {
158+
scroll =
159+
axis === Axis.Y
160+
? (target as HTMLDivElement).scrollTop
161+
: (target as HTMLDivElement).scrollLeft;
162+
}
162163

163164
if (Math.abs(scroll - lastScroll.current) >= threshold) {
164165
setScrollDir(scroll > lastScroll.current ? scrollDown : scrollUp);
@@ -170,44 +171,50 @@ function useDetectScroll(props: ScrollProps = {}): ScrollInfo {
170171
useEffect(() => {
171172
/** Function to update scroll position */
172173
const updateScrollPosition = () => {
173-
const top = target instanceof Window ? target.scrollY : target.scrollTop;
174+
const top =
175+
target instanceof Window
176+
? target.scrollY
177+
: (target as HTMLDivElement).scrollTop;
174178
const left =
175-
target instanceof Window ? target.scrollX : target.scrollLeft;
176-
const bottom =
177179
target instanceof Window
178-
? document.documentElement.scrollHeight - window.innerHeight - top
179-
: document.documentElement.scrollHeight - target.scrollHeight - top;
180+
? target.scrollX
181+
: (target as HTMLDivElement).scrollLeft;
182+
const bottom =
183+
document.documentElement.scrollHeight -
184+
(target instanceof Window
185+
? target.innerHeight
186+
: (target as HTMLDivElement).scrollHeight) -
187+
top;
180188
const right =
181-
target instanceof Window
182-
? document.documentElement.scrollWidth - window.innerWidth - left
183-
: document.documentElement.scrollHeight - target.scrollWidth - left;
189+
document.documentElement.scrollWidth -
190+
(target instanceof Window
191+
? target.innerWidth
192+
: (target as HTMLDivElement).scrollWidth) -
193+
left;
184194

185195
setScrollPosition({ top, bottom, left, right });
186196
};
187197

188198
/** Call the update function when the component mounts */
189199
updateScrollPosition();
190200

191-
target instanceof Window
192-
? window.addEventListener('scroll', updateScrollPosition)
193-
: target.addEventListener('scroll', updateScrollPosition);
201+
const targetElement = target as EventTarget;
202+
targetElement.addEventListener('scroll', updateScrollPosition);
194203

195204
return () => {
196-
target instanceof Window
197-
? window.removeEventListener('scroll', updateScrollPosition)
198-
: target.removeEventListener('scroll', updateScrollPosition);
205+
targetElement.removeEventListener('scroll', updateScrollPosition);
199206
};
200207
}, [target]);
201208

202209
useEffect(() => {
203-
lastScroll.current =
204-
target instanceof Window
205-
? axis === Axis.Y
206-
? window.scrollY
207-
: window.scrollX
208-
: axis === Axis.Y
209-
? target.scrollTop
210-
: target.scrollLeft;
210+
if (target instanceof Window) {
211+
lastScroll.current = axis === Axis.Y ? target.scrollY : target.scrollX;
212+
} else {
213+
lastScroll.current =
214+
axis === Axis.Y
215+
? (target as HTMLDivElement).scrollTop
216+
: (target as HTMLDivElement).scrollLeft;
217+
}
211218

212219
/** Function to handle onScroll event */
213220
const onScroll = () => {
@@ -217,14 +224,10 @@ function useDetectScroll(props: ScrollProps = {}): ScrollInfo {
217224
}
218225
};
219226

220-
target instanceof Window
221-
? window.addEventListener('scroll', onScroll)
222-
: target.addEventListener('scroll', onScroll);
227+
const targetElement = target as EventTarget;
228+
targetElement.addEventListener('scroll', onScroll);
223229

224-
return () =>
225-
target instanceof Window
226-
? window.removeEventListener('scroll', onScroll)
227-
: target.removeEventListener('scroll', onScroll);
230+
return () => targetElement.removeEventListener('scroll', onScroll);
228231
}, [target, axis, updateScrollDir]);
229232

230233
return { scrollDir, scrollPosition };

0 commit comments

Comments
 (0)