@progress/kendo-react-dropdowns
Version:
React DropDowns offer an interface for users to select different items from a list and more. KendoReact Dropdowns package
77 lines (76 loc) • 4.33 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { memoizeOne as f, RowHeightService as d } from "@progress/kendo-react-common";
import * as p from "react";
const S = 17895697, r = typeof window != "undefined" && /Firefox/.test(window.navigator.userAgent);
class u {
constructor() {
this.table = null, this.total = 0, this.enabled = !1, this.skip = 0, this.pageSize = 0, this.PageChange = null, this.scrollElement = null, this.listTransform = "", this.itemHeight = 0, this.containerHeight = 0, this.reactVersion = Number.parseFloat(p.version), this.scrollSyncing = !1, this.lastLoaded = 0, this.firstLoaded = 0, this.lastScrollTop = 0, this.listTranslate = 0, this.list = null, this.container = null, this.calcScrollElementHeight = () => {
var h;
this.scrollSyncing = !0;
let t = !1;
this.itemHeight = this.list ? this.list.children[0].offsetHeight : this.itemHeight;
const i = this.itemHeight * this.total - (((h = this.list) == null ? void 0 : h.offsetHeight) || 0);
this.containerHeight = r ? Math.min(S, i) : i;
const s = this.containerHeight;
return this.scrollElement && (t = this.scrollElement.style.height !== s + "px", t && (this.scrollElement.style.height = s + "px")), this.scrollSyncing = !1, t;
}, this.scrollerRef = (t) => {
this.container = t, t && (t.setAttribute("unselectable", "on"), window.setTimeout(this.calcScrollElementHeight.bind(this), 0));
}, this.getRowHeightService = f((t, i) => new d(i, t)), this.firstLoaded = this.pageSize, this.lastLoaded = this.skip + this.pageSize, this.scrollHandler = this.scrollHandler.bind(this);
}
get translate() {
return this.listTranslate;
}
translateTo(t, i) {
this.listTranslate = t, this.enabled && this.list && (r || this.reactVersion <= 17 || i ? this.list.style.transform = "translateY(" + t + "px)" : this.listTransform = "translateY(" + t + "px)");
}
changePage(t, i) {
const s = Math.min(Math.max(0, t), this.total - this.pageSize);
s !== this.skip && this.PageChange && this.PageChange({ skip: s, take: this.pageSize }, i);
}
reset() {
this.container && (this.calcScrollElementHeight(), this.container.scrollTop = 0, this.translateTo(0, !0));
}
scrollToEnd() {
if (this.container && this.list) {
this.calcScrollElementHeight();
const { scrollHeight: t, offsetHeight: i } = this.container;
this.container.scrollTop = t, this.translateTo(t - i, !0);
}
}
scrollHandler(t) {
if (!this.enabled || !this.container || !this.list)
return;
if (this.scrollSyncing) {
this.scrollSyncing = !1;
return;
}
this.rowHeightService = this.getRowHeightService(this.itemHeight, this.total);
const i = this.container.scrollTop, s = this.lastScrollTop >= i, h = !s, n = Math.abs(i - this.lastScrollTop);
this.lastScrollTop = i;
let e = this.rowHeightService.index(i), a = this.rowHeightService.offset(e);
const { offsetHeight: c } = this.container, g = this.rowHeightService.index(i + c);
if (h && g >= this.lastLoaded && this.lastLoaded < this.total) {
const l = e + this.pageSize - this.total;
l > 0 && (e = e - l, a = this.rowHeightService.offset(e)), this.firstLoaded = e, this.translateTo(a);
const o = this.firstLoaded + this.pageSize;
this.lastLoaded = Math.min(o, this.total), this.changePage(this.firstLoaded, t);
} else if (s && e - 1 <= this.firstLoaded) {
const l = n === this.itemHeight;
if (this.skip === 0 && l)
this.lastScrollTop = 0, this.firstLoaded = 0, this.lastLoaded = this.pageSize, this.container.scrollTop = 0, this.translateTo(0, !0);
else {
const o = Math.floor(this.pageSize * 0.3);
this.firstLoaded = Math.max(e - o, 0), this.translateTo(this.rowHeightService.offset(this.firstLoaded)), this.lastLoaded = Math.min(this.firstLoaded + this.pageSize, this.total), this.changePage(this.firstLoaded, t);
}
}
}
}
export {
u as VirtualScroll
};