@progress/kendo-react-grid 16.2.0-develop.5 → 16.2.0-develop.7

package/interfaces/GridScrollableSettings.d.ts

@@ -23,11 +23,20 @@ export interface GridScrollableSettings {
      * Controls the scrollbar rendering style.
      *
      * - `default`—Uses the native browser scrollbar (default).
-     * - `proxied`—Renders a custom overlay scrollbar on top of the content area.
-     *   The overlay appears on hover or scroll and hides when idle,
+     * - `proxied`—Renders a native scrollbar-based overlay on top of the content area,
      *   eliminating the white-space flash during virtual scrolling jumps.
      *
      * @default 'default'
      */
     scrollbar?: 'default' | 'proxied';
+    /**
+     * Multiplies the scrolling distance reported by mouse-wheel and trackpad input.
+     * Applies to the `scrollable` and `virtual` modes with both scrollbar styles.
+     *
+     * Must be a positive, finite number. Values that are zero, negative, `NaN`, or `Infinity`
+     * fall back to the default.
+     *
+     * @default 1
+     */
+    wheelMultiplier?: number;
 }

package/interfaces/VirtualScrollInterface.d.ts

@@ -6,7 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import { Page } from '../paging/Page';
-import { SyntheticEvent } from 'react';
+import { RefObject, SyntheticEvent } from 'react';
 import { RowHeightService } from '@progress/kendo-react-common';
 /**
  * @hidden
@@ -24,6 +24,7 @@ export interface VirtualScrollInterface {
     tableTransform: string;
     rowHeightService?: RowHeightService;
     scrollbarOverlaySpacerElement: HTMLDivElement | null;
+    overlaySyncingRef: RefObject<boolean> | null;
     reset: () => void;
     scrollHandler(e: SyntheticEvent<HTMLDivElement>): void;
     scrollToPosition(scrollTop: number, e: SyntheticEvent<HTMLDivElement>, deferTranslate?: boolean): void;

package/package-metadata.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-grid",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1789464309,version:"16.2.0-develop.5",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-grid",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1789552554,version:"16.2.0-develop.7",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = Object.freeze({
     productName: 'KendoReact',
     productCode: 'KENDOUIREACT',
     productCodes: ['KENDOUIREACT'],
-    publishDate: 1789464309,
-    version: '16.2.0-develop.5',
+    publishDate: 1789552554,
+    version: '16.2.0-develop.7',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-grid",
-  "version": "16.2.0-develop.5",
+  "version": "16.2.0-develop.7",
   "description": "React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -30,21 +30,21 @@
     "@progress/kendo-drawing": "^1.25.5",
     "@progress/kendo-file-saver": "^1.1.1",
     "@progress/kendo-licensing": "^1.7.2",
-    "@progress/kendo-react-animation": "16.2.0-develop.5",
-    "@progress/kendo-react-buttons": "16.2.0-develop.5",
-    "@progress/kendo-react-common": "16.2.0-develop.5",
-    "@progress/kendo-react-data-tools": "16.2.0-develop.5",
-    "@progress/kendo-react-dateinputs": "16.2.0-develop.5",
-    "@progress/kendo-react-indicators": "16.2.0-develop.5",
-    "@progress/kendo-react-form": "16.2.0-develop.5",
-    "@progress/kendo-react-labels": "16.2.0-develop.5",
-    "@progress/kendo-react-dialogs": "16.2.0-develop.5",
-    "@progress/kendo-react-dropdowns": "16.2.0-develop.5",
-    "@progress/kendo-react-inputs": "16.2.0-develop.5",
-    "@progress/kendo-react-intl": "16.2.0-develop.5",
-    "@progress/kendo-react-popup": "16.2.0-develop.5",
-    "@progress/kendo-react-layout": "16.2.0-develop.5",
-    "@progress/kendo-react-conversational-ui": "16.2.0-develop.5",
+    "@progress/kendo-react-animation": "16.2.0-develop.7",
+    "@progress/kendo-react-buttons": "16.2.0-develop.7",
+    "@progress/kendo-react-common": "16.2.0-develop.7",
+    "@progress/kendo-react-data-tools": "16.2.0-develop.7",
+    "@progress/kendo-react-dateinputs": "16.2.0-develop.7",
+    "@progress/kendo-react-indicators": "16.2.0-develop.7",
+    "@progress/kendo-react-form": "16.2.0-develop.7",
+    "@progress/kendo-react-labels": "16.2.0-develop.7",
+    "@progress/kendo-react-dialogs": "16.2.0-develop.7",
+    "@progress/kendo-react-dropdowns": "16.2.0-develop.7",
+    "@progress/kendo-react-inputs": "16.2.0-develop.7",
+    "@progress/kendo-react-intl": "16.2.0-develop.7",
+    "@progress/kendo-react-popup": "16.2.0-develop.7",
+    "@progress/kendo-react-layout": "16.2.0-develop.7",
+    "@progress/kendo-react-conversational-ui": "16.2.0-develop.7",
     "@progress/kendo-svg-icons": "^4.9.0 || ^5.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
@@ -155,7 +155,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1789464309,
+      "publishDate": 1789552554,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },

package/utils/proxiedScrollOverlay.d.ts

@@ -0,0 +1,48 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { GridScrollableSettings } from '../interfaces/GridScrollableSettings';
+import { ScrollMode } from '../ScrollMode';
+/**
+ * @hidden
+ */
+export interface ScrollableOverlaySettings {
+    overlayScrollbar: boolean;
+    wheelMultiplier: number;
+}
+/**
+ * @hidden
+ */
+export declare function getScrollableOverlaySettings(scrollable: ScrollMode | GridScrollableSettings | undefined): ScrollableOverlaySettings;
+/**
+ * @hidden
+ * Reports whether the proxied scrollbar overlay is currently scrolled to its bottom edge.
+ * Must be called BEFORE the overlay's spacer height is updated for a new page — its
+ * `scrollHeight` reflects the size from the PREVIOUS render, which is what "was it at the
+ * bottom" needs to check against. Only reports true when the page being applied is genuinely
+ * the last page — the overlay's own scrollTop can still read "at bottom" from a stale prior
+ * position (e.g. right after scrolling back up), which would otherwise incorrectly snap the
+ * content back down.
+ */
+export declare function isOverlayAtBottom(scrollbarOverlaySpacerElement: HTMLDivElement | null, isLastPageLoad: boolean): boolean;
+/**
+ * @hidden
+ */
+export interface OverlayBottomPin {
+    scrollbarOverlay: HTMLDivElement;
+    overlayScrollTop: number;
+    contentScrollTop: number;
+}
+/**
+ * @hidden
+ * Computes the scrollTop values needed to keep the proxied scrollbar overlay pinned to the
+ * bottom, or `null` when there's no overlay/container to pin. Must be called AFTER the
+ * overlay's spacer height has been updated for the new page, so `scrollHeight` reflects the
+ * new size — pair with `isOverlayAtBottom()` (called before the resize) to decide whether to
+ * apply the result.
+ */
+export declare function getOverlayBottomPin(scrollbarOverlaySpacerElement: HTMLDivElement | null, container: HTMLDivElement | null): OverlayBottomPin | null;

package/utils/proxiedScrollOverlay.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function e(i){const o=typeof i=="object"?i:void 0,t=o==null?void 0:o.wheelMultiplier;return{overlayScrollbar:(o==null?void 0:o.scrollbar)==="proxied",wheelMultiplier:typeof t=="number"&&Number.isFinite(t)&&t>0?t:1}}function l(i,o){const t=i==null?void 0:i.parentElement;return o&&!!t&&t.scrollHeight-t.clientHeight-t.scrollTop<=1}function n(i,o){const t=i==null?void 0:i.parentElement;return!t||!o?null:{scrollbarOverlay:t,overlayScrollTop:t.scrollHeight-t.clientHeight,contentScrollTop:o.scrollHeight-o.clientHeight}}exports.getOverlayBottomPin=n;exports.getScrollableOverlaySettings=e;exports.isOverlayAtBottom=l;

package/utils/proxiedScrollOverlay.mjs

@@ -0,0 +1,31 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+function n(i) {
+  const o = typeof i == "object" ? i : void 0, t = o == null ? void 0 : o.wheelMultiplier;
+  return {
+    overlayScrollbar: (o == null ? void 0 : o.scrollbar) === "proxied",
+    wheelMultiplier: typeof t == "number" && Number.isFinite(t) && t > 0 ? t : 1
+  };
+}
+function u(i, o) {
+  const t = i == null ? void 0 : i.parentElement;
+  return o && !!t && t.scrollHeight - t.clientHeight - t.scrollTop <= 1;
+}
+function l(i, o) {
+  const t = i == null ? void 0 : i.parentElement;
+  return !t || !o ? null : {
+    scrollbarOverlay: t,
+    overlayScrollTop: t.scrollHeight - t.clientHeight,
+    contentScrollTop: o.scrollHeight - o.clientHeight
+  };
+}
+export {
+  l as getOverlayBottomPin,
+  n as getScrollableOverlaySettings,
+  u as isOverlayAtBottom
+};

package/utils/wheelTouchScroll.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * @hidden
+ */
+export interface WheelTouchScrollOptions {
+    wheelMultiplier: number;
+    overlayRequiresCustomWheel: boolean;
+}
+/**
+ * @hidden
+ * Attaches native (non-React) wheel and touch listeners to `container` so the grid can apply a
+ * `wheelMultiplier` and/or restore scrolling when the proxied overlay hides native overflow.
+ * Returns a cleanup function that removes the listeners.
+ */
+export declare function attachWheelTouchScroll(container: HTMLDivElement, options: WheelTouchScrollOptions): () => void;

package/utils/wheelTouchScroll.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=16,X=1,W=2,I=.95,d=.1;function b(e,S){const{wheelMultiplier:m,overlayRequiresCustomWheel:M}=S;let f;const _=()=>{var t;if(f===void 0){const i=(t=e.ownerDocument.defaultView)==null?void 0:t.getComputedStyle(e).lineHeight;f=Number.parseFloat(i||"")||A}return f},L=t=>{if(t.ctrlKey||t.metaKey||!t.deltaY&&!t.deltaX)return;const i=e.scrollTop,h=e.scrollLeft;let l=t.deltaX,s=t.deltaY;if(t.shiftKey&&!l&&(l=s,s=0),t.deltaMode===X){const c=_();l*=c,s*=c}else t.deltaMode===W&&(l*=e.clientWidth,s*=e.clientHeight);e.scrollTop+=s*m,e.scrollLeft+=l*m,(e.scrollTop!==i||e.scrollLeft!==h)&&t.preventDefault()};e.addEventListener("wheel",L,{passive:!1});let r;if(M){let t=0,i=0,h=0,l=0,s=0,c;const T=()=>{c!==void 0&&(cancelAnimationFrame(c),c=void 0)},p=()=>{e.scrollTop+=s,e.scrollLeft+=l,s*=I,l*=I,Math.abs(s)>d||Math.abs(l)>d?c=requestAnimationFrame(p):c=void 0},E=o=>{o.touches.length===1&&(T(),l=0,s=0,t=o.touches[0].clientX,i=o.touches[0].clientY,h=o.timeStamp)},n=o=>{if(o.touches.length!==1)return;const a=o.touches[0],v=t-a.clientX,g=i-a.clientY,H=Math.min(Math.max(o.timeStamp-h,1),100),Y=e.scrollTop,y=e.scrollLeft;e.scrollTop+=g,e.scrollLeft+=v,s=g/H*(1e3/60),l=v/H*(1e3/60),t=a.clientX,i=a.clientY,h=o.timeStamp,(e.scrollTop!==Y||e.scrollLeft!==y)&&o.preventDefault()},u=o=>{o.touches.length>0||(Math.abs(s)>d||Math.abs(l)>d)&&(c=requestAnimationFrame(p))};e.addEventListener("touchstart",E,{passive:!0}),e.addEventListener("touchmove",n,{passive:!1}),e.addEventListener("touchend",u,{passive:!0}),e.addEventListener("touchcancel",u,{passive:!0}),r=()=>{T(),e.removeEventListener("touchstart",E),e.removeEventListener("touchmove",n),e.removeEventListener("touchend",u),e.removeEventListener("touchcancel",u)}}return()=>{e.removeEventListener("wheel",L),r==null||r()}}exports.attachWheelTouchScroll=b;

package/utils/wheelTouchScroll.mjs

@@ -0,0 +1,57 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+function O(e, n) {
+  const { wheelMultiplier: L, overlayRequiresCustomWheel: N } = n;
+  let u;
+  const v = () => {
+    var t;
+    if (u === void 0) {
+      const i = (t = e.ownerDocument.defaultView) == null ? void 0 : t.getComputedStyle(e).lineHeight;
+      u = Number.parseFloat(i || "") || 16;
+    }
+    return u;
+  }, a = (t) => {
+    if (t.ctrlKey || t.metaKey || !t.deltaY && !t.deltaX)
+      return;
+    const i = e.scrollTop, h = e.scrollLeft;
+    let l = t.deltaX, s = t.deltaY;
+    if (t.shiftKey && !l && (l = s, s = 0), t.deltaMode === 1) {
+      const c = v();
+      l *= c, s *= c;
+    } else t.deltaMode === 2 && (l *= e.clientWidth, s *= e.clientHeight);
+    e.scrollTop += s * L, e.scrollLeft += l * L, (e.scrollTop !== i || e.scrollLeft !== h) && t.preventDefault();
+  };
+  e.addEventListener("wheel", a, { passive: !1 });
+  let E;
+  if (N) {
+    let t = 0, i = 0, h = 0, l = 0, s = 0, c;
+    const I = () => {
+      c !== void 0 && (cancelAnimationFrame(c), c = void 0);
+    }, d = () => {
+      e.scrollTop += s, e.scrollLeft += l, s *= 0.95, l *= 0.95, Math.abs(s) > 0.1 || Math.abs(l) > 0.1 ? c = requestAnimationFrame(d) : c = void 0;
+    }, _ = (o) => {
+      o.touches.length === 1 && (I(), l = 0, s = 0, t = o.touches[0].clientX, i = o.touches[0].clientY, h = o.timeStamp);
+    }, f = (o) => {
+      if (o.touches.length !== 1)
+        return;
+      const r = o.touches[0], m = t - r.clientX, p = i - r.clientY, H = Math.min(Math.max(o.timeStamp - h, 1), 100), A = e.scrollTop, C = e.scrollLeft;
+      e.scrollTop += p, e.scrollLeft += m, s = p / H * (1e3 / 60), l = m / H * (1e3 / 60), t = r.clientX, i = r.clientY, h = o.timeStamp, (e.scrollTop !== A || e.scrollLeft !== C) && o.preventDefault();
+    }, T = (o) => {
+      o.touches.length > 0 || (Math.abs(s) > 0.1 || Math.abs(l) > 0.1) && (c = requestAnimationFrame(d));
+    };
+    e.addEventListener("touchstart", _, { passive: !0 }), e.addEventListener("touchmove", f, { passive: !1 }), e.addEventListener("touchend", T, { passive: !0 }), e.addEventListener("touchcancel", T, { passive: !0 }), E = () => {
+      I(), e.removeEventListener("touchstart", _), e.removeEventListener("touchmove", f), e.removeEventListener("touchend", T), e.removeEventListener("touchcancel", T);
+    };
+  }
+  return () => {
+    e.removeEventListener("wheel", a), E == null || E();
+  };
+}
+export {
+  O as attachWheelTouchScroll
+};