@progress/kendo-react-listview 14.5.0-develop.9 → 15.0.0-develop.2

package/ListView.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 M=require("react"),c=require("@progress/kendo-react-common"),y=require("./package-metadata.js");function O(a){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const r in a)if(r!=="default"){const d=Object.getOwnPropertyDescriptor(a,r);Object.defineProperty(l,r,d.get?d:{enumerable:!0,get:()=>a[r]})}}return l.default=a,Object.freeze(l)}const s=O(M),o="k-focus",C=s.forwardRef((a,l)=>{const r=!c.validatePackage(y.packageMetadata,{component:"ListView"}),d=c.getLicenseMessage(y.packageMetadata),{data:S=[],item:m,footer:f,header:v,className:D,style:N,onScroll:g,navigatable:p}=a,b=s.useRef(null),k=s.useRef(null),w=s.useCallback(()=>({onScroll:g,props:a,context:{},state:{},refs:{}}),[]);s.useImperativeHandle(k,w),s.useImperativeHandle(l,()=>k.current);const R=s.useCallback(e=>c.dispatchEvent(g,e,w(),void 0),[]),E=(e,t,n)=>{n.preventDefault(),t.focusNext(e),t.next(e).classList.add(o),t.previous(e).classList.remove(o)},L=(e,t,n)=>{n.preventDefault(),t.focusPrevious(e),t.next(e).classList.remove(o),t.previous(e).classList.add(o)},i=s.useMemo(()=>new c.Navigation({root:b,selectors:[".k-listview-item"],rovingTabIndex:!0,keyboardEvents:{keydown:{ArrowDown:E,ArrowRight:E,ArrowUp:L,ArrowLeft:L,Home:(e,t,n)=>{n.preventDefault();const u=t.first;u&&t.focusElement(u,e)},End:(e,t,n)=>{n.preventDefault();const u=t.last;u&&t.focusElement(u,e)},Tab:(e,t,n)=>{t.removeFocusClass(e)}}},tabIndex:0,focusClass:o}),[]),h=s.useCallback(i.triggerKeyboardEvent.bind(i),[]),I=s.useCallback(e=>{e.nativeEvent.target.classList.add(o),i.elements.forEach(t=>{t!==e.nativeEvent.target&&t.classList.remove(o)})},[]);return s.useEffect(()=>{if(p)return i.initializeRovingTab(),()=>i.removeFocusListener()},[]),s.createElement("div",{className:c.classNames("k-listview",D),style:N,onKeyDown:e=>p&&h(e),onClick:I},v?s.createElement(v,null):null,s.createElement("div",{role:"list",className:"k-listview-content",onScroll:R,ref:b},m&&S.map((e,t)=>s.createElement(m,{dataItem:e,index:t,key:t}))),f?s.createElement(f,null):null,r&&s.createElement(c.WatermarkOverlay,{message:d}))});C.displayName="KendoReactListView";exports.ListView=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("react"),l=require("@progress/kendo-react-common"),C=require("./package-metadata.js"),V=require("./ListViewItemContext.js");function O(a){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const o in a)if(o!=="default"){const c=Object.getOwnPropertyDescriptor(a,o);Object.defineProperty(r,o,c.get?c:{enumerable:!0,get:()=>a[o]})}}return r.default=a,Object.freeze(r)}const s=O(N),i="k-focus",M=s.forwardRef((a,r)=>{const o=!l.validatePackage(C.packageMetadata,{component:"ListView"}),c=l.getLicenseMessage(C.packageMetadata),{data:d=[],item:f,footer:w,header:g,className:I,style:R,onScroll:b,navigatable:p}=a,k=s.useRef(null),v=s.useRef(null),E=s.useCallback(()=>({onScroll:b,props:a,context:{},state:{},refs:{}}),[]);s.useImperativeHandle(v,E),s.useImperativeHandle(r,()=>v.current),l.useWebMcpRegister("listview",v,a,a.webMcp);const S=s.useCallback(e=>l.dispatchEvent(b,e,E(),void 0),[]),L=(e,t,n)=>{n.preventDefault(),t.focusNext(e),t.next(e).classList.add(i),t.previous(e).classList.remove(i)},y=(e,t,n)=>{n.preventDefault(),t.focusPrevious(e),t.next(e).classList.remove(i),t.previous(e).classList.add(i)},u=s.useMemo(()=>new l.Navigation({root:k,selectors:[".k-listview-item"],rovingTabIndex:!0,keyboardEvents:{keydown:{ArrowDown:L,ArrowRight:L,ArrowUp:y,ArrowLeft:y,Home:(e,t,n)=>{n.preventDefault();const m=t.first;m&&t.focusElement(m,e)},End:(e,t,n)=>{n.preventDefault();const m=t.last;m&&t.focusElement(m,e)},Tab:(e,t,n)=>{t.removeFocusClass(e)}}},tabIndex:0,focusClass:i}),[]),h=s.useCallback(u.triggerKeyboardEvent.bind(u),[]),D=s.useCallback(e=>{e.nativeEvent.target.classList.add(i),u.elements.forEach(t=>{t!==e.nativeEvent.target&&t.classList.remove(i)})},[]);return s.useEffect(()=>{if(p)return u.initializeRovingTab(),()=>u.removeFocusListener()},[]),s.createElement("div",{className:l.classNames("k-listview",I),style:R,onKeyDown:e=>p&&h(e),onClick:D},g?s.createElement(g,null):null,s.createElement("div",{role:"list",className:"k-listview-content",onScroll:S,ref:k},f&&d.map((e,t)=>{var n;return s.createElement(x,{key:(n=e.id)!=null?n:t,Item:f,dataItem:e,index:t,totalCount:d.length})})),w?s.createElement(w,null):null,o&&s.createElement(l.WatermarkOverlay,{message:c}))});M.displayName="KendoReactListView";const x=({Item:a,dataItem:r,index:o,totalCount:c})=>{const d=s.useMemo(()=>({index:o,totalCount:c}),[o,c]);return s.createElement(V.ListViewItemContext.Provider,{value:d},s.createElement(a,{dataItem:r,index:o}))};exports.ListView=M;

package/ListView.mjs

@@ -6,47 +6,48 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as s from "react";
-import { validatePackage as D, getLicenseMessage as R, dispatchEvent as S, Navigation as A, classNames as H, WatermarkOverlay as F } from "@progress/kendo-react-common";
-import { packageMetadata as E } from "./package-metadata.mjs";
-const o = "k-focus", K = s.forwardRef((r, L) => {
-  const g = !D(E, { component: "ListView" }), b = R(E), { data: y = [], item: c, footer: i, header: m, className: C, style: h, onScroll: u, navigatable: v } = r, d = s.useRef(null), f = s.useRef(null), w = s.useCallback(
+import { validatePackage as x, getLicenseMessage as D, useWebMcpRegister as M, dispatchEvent as V, Navigation as S, classNames as A, WatermarkOverlay as H } from "@progress/kendo-react-common";
+import { packageMetadata as C } from "./package-metadata.mjs";
+import { ListViewItemContext as F } from "./ListViewItemContext.mjs";
+const o = "k-focus", K = s.forwardRef((n, u) => {
+  const l = !x(C, { component: "ListView" }), c = D(C), { data: m = [], item: d, footer: f, header: w, className: h, style: y, onScroll: p, navigatable: E } = n, k = s.useRef(null), v = s.useRef(null), L = s.useCallback(
     () => ({
-      onScroll: u,
-      props: r,
+      onScroll: p,
+      props: n,
       context: {},
       state: {},
       refs: {}
     }),
     []
   );
-  s.useImperativeHandle(f, w), s.useImperativeHandle(L, () => f.current);
+  s.useImperativeHandle(v, L), s.useImperativeHandle(u, () => v.current), M("listview", v, n, n.webMcp);
   const I = s.useCallback(
-    (e) => S(u, e, w(), void 0),
+    (e) => V(p, e, L(), void 0),
     []
-  ), p = (e, t, a) => {
+  ), g = (e, t, a) => {
     a.preventDefault(), t.focusNext(e), t.next(e).classList.add(o), t.previous(e).classList.remove(o);
-  }, k = (e, t, a) => {
+  }, b = (e, t, a) => {
     a.preventDefault(), t.focusPrevious(e), t.next(e).classList.remove(o), t.previous(e).classList.add(o);
-  }, n = s.useMemo(
-    () => new A({
-      root: d,
+  }, r = s.useMemo(
+    () => new S({
+      root: k,
       selectors: [".k-listview-item"],
       rovingTabIndex: !0,
       keyboardEvents: {
         keydown: {
-          ArrowDown: p,
-          ArrowRight: p,
-          ArrowUp: k,
-          ArrowLeft: k,
+          ArrowDown: g,
+          ArrowRight: g,
+          ArrowUp: b,
+          ArrowLeft: b,
           Home: (e, t, a) => {
             a.preventDefault();
-            const l = t.first;
-            l && t.focusElement(l, e);
+            const i = t.first;
+            i && t.focusElement(i, e);
           },
           End: (e, t, a) => {
             a.preventDefault();
-            const l = t.last;
-            l && t.focusElement(l, e);
+            const i = t.last;
+            i && t.focusElement(i, e);
           },
           Tab: (e, t, a) => {
             t.removeFocusClass(e);
@@ -57,29 +58,45 @@ const o = "k-focus", K = s.forwardRef((r, L) => {
       focusClass: o
     }),
     []
-  ), N = s.useCallback(n.triggerKeyboardEvent.bind(n), []), x = s.useCallback((e) => {
-    e.nativeEvent.target.classList.add(o), n.elements.forEach((t) => {
+  ), N = s.useCallback(r.triggerKeyboardEvent.bind(r), []), R = s.useCallback((e) => {
+    e.nativeEvent.target.classList.add(o), r.elements.forEach((t) => {
       t !== e.nativeEvent.target && t.classList.remove(o);
     });
   }, []);
   return s.useEffect(() => {
-    if (v)
-      return n.initializeRovingTab(), () => n.removeFocusListener();
+    if (E)
+      return r.initializeRovingTab(), () => r.removeFocusListener();
   }, []), /* @__PURE__ */ s.createElement(
     "div",
     {
-      className: H("k-listview", C),
-      style: h,
-      onKeyDown: (e) => v && N(e),
-      onClick: x
+      className: A("k-listview", h),
+      style: y,
+      onKeyDown: (e) => E && N(e),
+      onClick: R
     },
-    m ? /* @__PURE__ */ s.createElement(m, null) : null,
-    /* @__PURE__ */ s.createElement("div", { role: "list", className: "k-listview-content", onScroll: I, ref: d }, c && y.map((e, t) => /* @__PURE__ */ s.createElement(c, { dataItem: e, index: t, key: t }))),
-    i ? /* @__PURE__ */ s.createElement(i, null) : null,
-    g && /* @__PURE__ */ s.createElement(F, { message: b })
+    w ? /* @__PURE__ */ s.createElement(w, null) : null,
+    /* @__PURE__ */ s.createElement("div", { role: "list", className: "k-listview-content", onScroll: I, ref: k }, d && m.map((e, t) => {
+      var a;
+      return /* @__PURE__ */ s.createElement(
+        P,
+        {
+          key: (a = e.id) != null ? a : t,
+          Item: d,
+          dataItem: e,
+          index: t,
+          totalCount: m.length
+        }
+      );
+    })),
+    f ? /* @__PURE__ */ s.createElement(f, null) : null,
+    l && /* @__PURE__ */ s.createElement(H, { message: c })
   );
 });
 K.displayName = "KendoReactListView";
+const P = ({ Item: n, dataItem: u, index: l, totalCount: c }) => {
+  const m = s.useMemo(() => ({ index: l, totalCount: c }), [l, c]);
+  return /* @__PURE__ */ s.createElement(F.Provider, { value: m }, /* @__PURE__ */ s.createElement(n, { dataItem: u, index: l }));
+};
 export {
   K as ListView
 };

package/ListViewItemContext.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import * as React from 'react';
+/** @hidden */
+export interface ListViewItemContextValue {
+    index: number;
+    totalCount: number;
+}
+/** @hidden */
+export declare const ListViewItemContext: React.Context<ListViewItemContextValue | null>;

package/ListViewItemContext.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 r=require("react");function c(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const a=c(r),i=a.createContext(null);exports.ListViewItemContext=i;

package/ListViewItemContext.mjs

@@ -0,0 +1,12 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import * as t from "react";
+const e = t.createContext(null);
+export {
+  e as ListViewItemContext
+};

package/ListViewItemWrapper.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 n=require("react"),a=require("@progress/kendo-react-common");function o(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,c.get?c:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const s=o(n),i=e=>{const{children:r,style:t,className:c}=e;return s.createElement("div",{role:"listitem",style:t,className:a.classNames("k-listview-item",c)},r)};exports.ListViewItemWrapper=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),a=require("@progress/kendo-react-common"),c=require("./ListViewItemContext.js");function l(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(i,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return i.default=e,Object.freeze(i)}const r=l(s),u=e=>{const{children:i,style:t,className:n}=e,o=r.useContext(c.ListViewItemContext);return r.createElement("div",{role:"listitem",style:t,className:a.classNames("k-listview-item",n),"aria-posinset":o?o.index+1:void 0,"aria-setsize":o?o.totalCount:void 0},i)};exports.ListViewItemWrapper=u;

package/ListViewItemWrapper.mjs

@@ -5,12 +5,23 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as i from "react";
-import { classNames as m } from "@progress/kendo-react-common";
-const l = (e) => {
-  const { children: t, style: s, className: r } = e;
-  return /* @__PURE__ */ i.createElement("div", { role: "listitem", style: s, className: m("k-listview-item", r) }, t);
+import * as e from "react";
+import { classNames as a } from "@progress/kendo-react-common";
+import { ListViewItemContext as m } from "./ListViewItemContext.mjs";
+const c = (i) => {
+  const { children: s, style: o, className: r } = i, t = e.useContext(m);
+  return /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      role: "listitem",
+      style: o,
+      className: a("k-listview-item", r),
+      "aria-posinset": t ? t.index + 1 : void 0,
+      "aria-setsize": t ? t.totalCount : void 0
+    },
+    s
+  );
 };
 export {
-  l as ListViewItemWrapper
+  c as ListViewItemWrapper
 };

package/README.md

@@ -1,4 +1,4 @@
-[![KendoReact NPM Banner](https://raw.githubusercontent.com/telerik/kendo-react/master/images/kendoreact-github-banner.png)](https://www.telerik.com/kendo-react-ui/components/free?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview&utm_content=banner)
+[![KendoReact NPM Banner](https://raw.githubusercontent.com/telerik/kendo-react/master/images/kendoreact-github-banner.png)](https://www.telerik.com/kendo-react-ui/components/getting-started/free-vs-premium?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview&utm_content=banner)
 
 # KendoReact ListView Component for React
 
@@ -12,7 +12,7 @@
 >
 > [Start using KendoReact](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview) and speed up your development process!
 >
-> If you're looking for free React components, check out [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free).
+> If you're looking for free React components, check out [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/getting-started).
 
 The [React ListView](https://www.telerik.com/kendo-react-ui/listview), part of KendoReact, enables you to display a custom layout of data items.
 
@@ -30,7 +30,7 @@ Among the features which the KendoReact ListView component delivers are:
 
 The following table outlines the key resources available with KendoReact and KendoReact Free.
 
-|                                  | [KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free)                                                                                                                                | [KendoReact](https://www.telerik.com/kendo-react-ui)                                                                                                                                                     |
+|                                  | [KendoReact Free](https://www.telerik.com/kendo-react-ui/components/getting-started/free-vs-premium)                                                                                                     | [KendoReact](https://www.telerik.com/kendo-react-ui)                                                                                                                                                     |
 | -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | React components                 | 50+                                                                                                                                                                                                      | 120+                                                                                                                                                                                                     |
 | Four professional themes         | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
@@ -53,7 +53,7 @@ For any issues you might encounter while working with the KendoReact ListView, u
 ## Resources
 
 -   [Getting Started with KendoReact](https://www.telerik.com/kendo-react-ui/components/getting-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview)
--   [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free)
+-   [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/getting-started)
 -   [Get Started with the KendoReact ListView](https://www.telerik.com/kendo-react-ui/components/listview/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview)
 -   [API Reference of the KendoReact ListView](https://www.telerik.com/kendo-react-ui/components/listview/api/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview)
 -   [KendoReact Roadmap](https://www.telerik.com/support/whats-new/kendo-react-ui/roadmap?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-listview)

package/dist/cdn/js/kendo-react-listview.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("@progress/kendo-react-common")):"function"==typeof define&&define.amd?define(["exports","react","@progress/kendo-react-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactListview={},e.React,e.KendoReactCommon)}(this,function(e,t,s){"use strict";function a(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(s){if("default"!==s){var a=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,a.get?a:{enumerable:!0,get:function(){return e[s]}})}}),t.default=e,Object.freeze(t)}var r=a(t);const n=Object.freeze({name:"@progress/kendo-react-listview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"14.5.0-develop.9",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),l="k-focus",o=r.forwardRef((e,t)=>{const a=!s.validatePackage(n,{component:"ListView"}),o=s.getLicenseMessage(n),{data:i=[],item:c,footer:d,header:m,className:u,style:f,onScroll:v,navigatable:p}=e,w=r.useRef(null),E=r.useRef(null),b=r.useCallback(()=>({onScroll:v,props:e,context:{},state:{},refs:{}}),[]);r.useImperativeHandle(E,b),r.useImperativeHandle(t,()=>E.current);const k=r.useCallback(e=>s.dispatchEvent(v,e,b(),void 0),[]),y=(e,t,s)=>{s.preventDefault(),t.focusNext(e),t.next(e).classList.add(l),t.previous(e).classList.remove(l)},g=(e,t,s)=>{s.preventDefault(),t.focusPrevious(e),t.next(e).classList.remove(l),t.previous(e).classList.add(l)},N=r.useMemo(()=>new s.Navigation({root:w,selectors:[".k-listview-item"],rovingTabIndex:!0,keyboardEvents:{keydown:{ArrowDown:y,ArrowRight:y,ArrowUp:g,ArrowLeft:g,Home:(e,t,s)=>{s.preventDefault();const a=t.first;a&&t.focusElement(a,e)},End:(e,t,s)=>{s.preventDefault();const a=t.last;a&&t.focusElement(a,e)},Tab:(e,t,s)=>{t.removeFocusClass(e)}}},tabIndex:0,focusClass:l}),[]),L=r.useCallback(N.triggerKeyboardEvent.bind(N),[]),h=r.useCallback(e=>{e.nativeEvent.target.classList.add(l),N.elements.forEach(t=>{t!==e.nativeEvent.target&&t.classList.remove(l)})},[]);return r.useEffect(()=>{if(p)return N.initializeRovingTab(),()=>N.removeFocusListener()},[]),r.createElement("div",{className:s.classNames("k-listview",u),style:f,onKeyDown:e=>p&&L(e),onClick:h},m?r.createElement(m,null):null,r.createElement("div",{role:"list",className:"k-listview-content",onScroll:k,ref:w},c&&i.map((e,t)=>r.createElement(c,{dataItem:e,index:t,key:t}))),d?r.createElement(d,null):null,a&&r.createElement(s.WatermarkOverlay,{message:o}))});o.displayName="KendoReactListView";e.ListView=o,e.ListViewFooter=e=>r.createElement("div",{className:s.classNames("k-listview-footer",e.className),style:e.style},e.children),e.ListViewHeader=e=>r.createElement("div",{className:s.classNames("k-listview-header",e.className),style:e.style},e.children),e.ListViewItemWrapper=e=>{const{children:t,style:a,className:n}=e;return r.createElement("div",{role:"listitem",style:a,className:s.classNames("k-listview-item",n)},t)}});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("@progress/kendo-react-common")):"function"==typeof define&&define.amd?define(["exports","react","@progress/kendo-react-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactListview={},e.React,e.KendoReactCommon)}(this,function(e,t,s){"use strict";function a(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(s){if("default"!==s){var a=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,a.get?a:{enumerable:!0,get:function(){return e[s]}})}}),t.default=e,Object.freeze(t)}var n=a(t);const r=Object.freeze({name:"@progress/kendo-react-listview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"15.0.0-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),o=n.createContext(null),l="k-focus",i=n.forwardRef((e,t)=>{const a=!s.validatePackage(r,{component:"ListView"}),o=s.getLicenseMessage(r),{data:i=[],item:u,footer:d,header:m,className:v,style:f,onScroll:p,navigatable:w}=e,E=n.useRef(null),b=n.useRef(null),g=n.useCallback(()=>({onScroll:p,props:e,context:{},state:{},refs:{}}),[]);n.useImperativeHandle(b,g),n.useImperativeHandle(t,()=>b.current),s.useWebMcpRegister("listview",b,e,e.webMcp);const k=n.useCallback(e=>s.dispatchEvent(p,e,g(),void 0),[]),y=(e,t,s)=>{s.preventDefault(),t.focusNext(e),t.next(e).classList.add(l),t.previous(e).classList.remove(l)},N=(e,t,s)=>{s.preventDefault(),t.focusPrevious(e),t.next(e).classList.remove(l),t.previous(e).classList.add(l)},C=n.useMemo(()=>new s.Navigation({root:E,selectors:[".k-listview-item"],rovingTabIndex:!0,keyboardEvents:{keydown:{ArrowDown:y,ArrowRight:y,ArrowUp:N,ArrowLeft:N,Home:(e,t,s)=>{s.preventDefault();const a=t.first;a&&t.focusElement(a,e)},End:(e,t,s)=>{s.preventDefault();const a=t.last;a&&t.focusElement(a,e)},Tab:(e,t,s)=>{t.removeFocusClass(e)}}},tabIndex:0,focusClass:l}),[]),x=n.useCallback(C.triggerKeyboardEvent.bind(C),[]),L=n.useCallback(e=>{e.nativeEvent.target.classList.add(l),C.elements.forEach(t=>{t!==e.nativeEvent.target&&t.classList.remove(l)})},[]);return n.useEffect(()=>{if(w)return C.initializeRovingTab(),()=>C.removeFocusListener()},[]),n.createElement("div",{className:s.classNames("k-listview",v),style:f,onKeyDown:e=>w&&x(e),onClick:L},m?n.createElement(m,null):null,n.createElement("div",{role:"list",className:"k-listview-content",onScroll:k,ref:E},u&&i.map((e,t)=>{var s;return n.createElement(c,{key:null!=(s=e.id)?s:t,Item:u,dataItem:e,index:t,totalCount:i.length})})),d?n.createElement(d,null):null,a&&n.createElement(s.WatermarkOverlay,{message:o}))});i.displayName="KendoReactListView";const c=({Item:e,dataItem:t,index:s,totalCount:a})=>{const r=n.useMemo(()=>({index:s,totalCount:a}),[s,a]);return n.createElement(o.Provider,{value:r},n.createElement(e,{dataItem:t,index:s}))};e.ListView=i,e.ListViewFooter=e=>n.createElement("div",{className:s.classNames("k-listview-footer",e.className),style:e.style},e.children),e.ListViewHeader=e=>n.createElement("div",{className:s.classNames("k-listview-header",e.className),style:e.style},e.children),e.ListViewItemWrapper=e=>{const{children:t,style:a,className:r}=e,l=n.useContext(o);return n.createElement("div",{role:"listitem",style:a,className:s.classNames("k-listview-item",r),"aria-posinset":l?l.index+1:void 0,"aria-setsize":l?l.totalCount:void 0},t)}});

package/interfaces/ListViewProps.d.ts

@@ -7,6 +7,7 @@
  */
 import { ListViewEvent } from '../events';
 import { ListViewItemProps } from './ListViewItemProps';
+import { WebMcpProps } from '@progress/kendo-react-common';
 /**
  * Represents the props of the [KendoReact ListView component](https://www.telerik.com/kendo-react-ui/components/listview).
  */
@@ -92,4 +93,9 @@ export interface ListViewProps {
      * ```
      */
     navigatable?: boolean;
+    /**
+     * Enables Web MCP tool registration for this component.
+     * Requires a parent `WebMcpProvider` from `@progress/kendo-react-webmcp`.
+     */
+    webMcp?: boolean | WebMcpProps;
 }

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-listview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1778599924,version:"14.5.0-develop.9",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-listview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1779253341,version:"15.0.0-develop.2",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: 1778599924,
-    version: '14.5.0-develop.9',
+    publishDate: 1779253341,
+    version: '15.0.0-develop.2',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-listview",
-  "version": "14.5.0-develop.9",
+  "version": "15.0.0-develop.2",
   "description": "React ListView enables you to display a custom layout of data items. KendoReact ListView package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -26,7 +26,7 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.7.2",
-    "@progress/kendo-react-common": "14.5.0-develop.9",
+    "@progress/kendo-react-common": "15.0.0-develop.2",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
@@ -51,7 +51,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1778599924,
+      "publishDate": 1779253341,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },