@progress/kendo-react-listview 13.3.0 → 13.4.0-develop.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ListView.d.ts +22 -0
- package/ListViewFooter.d.ts +14 -0
- package/ListViewHeader.d.ts +14 -0
- package/ListViewItemWrapper.d.ts +14 -0
- package/dist/cdn/js/kendo-react-listview.js +1 -1
- package/events.d.ts +14 -0
- package/index.d.mts +10 -194
- package/index.d.ts +10 -194
- package/interfaces/ListViewFooterProps.d.ts +24 -0
- package/interfaces/ListViewHeaderProps.d.ts +24 -0
- package/interfaces/ListViewItemProps.d.ts +20 -0
- package/interfaces/ListViewItemWrapperProps.d.ts +24 -0
- package/interfaces/ListViewProps.d.ts +95 -0
- package/package-metadata.d.ts +12 -0
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +10 -16
- package/package.json +3 -3
package/ListView.d.ts
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ListViewProps } from './interfaces/ListViewProps.js';
|
|
9
|
+
import { ListViewEvent } from './events.js';
|
|
10
|
+
import * as React from 'react';
|
|
11
|
+
/** @hidden */
|
|
12
|
+
interface ListViewHandle {
|
|
13
|
+
onScroll?: (event: ListViewEvent) => void;
|
|
14
|
+
props: ListViewProps;
|
|
15
|
+
context: {};
|
|
16
|
+
state: {};
|
|
17
|
+
refs: {};
|
|
18
|
+
}
|
|
19
|
+
export declare const ListView: React.ForwardRefExoticComponent<ListViewProps & React.RefAttributes<ListViewHandle | null>>;
|
|
20
|
+
/** @hidden */
|
|
21
|
+
export type ListView = ListViewHandle;
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ListViewFooterProps } from './interfaces/ListViewFooterProps.js';
|
|
9
|
+
import * as React from 'react';
|
|
10
|
+
/**
|
|
11
|
+
* The ListViewFooter component.
|
|
12
|
+
*/
|
|
13
|
+
declare const ListViewFooter: React.FunctionComponent<ListViewFooterProps>;
|
|
14
|
+
export { ListViewFooter };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ListViewHeaderProps } from './interfaces/ListViewHeaderProps.js';
|
|
9
|
+
import * as React from 'react';
|
|
10
|
+
/**
|
|
11
|
+
* The ListViewHeader component.
|
|
12
|
+
*/
|
|
13
|
+
declare const ListViewHeader: React.FunctionComponent<ListViewHeaderProps>;
|
|
14
|
+
export { ListViewHeader };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ListViewItemWrapperProps } from './interfaces/ListViewItemWrapperProps.js';
|
|
9
|
+
import * as React from 'react';
|
|
10
|
+
/**
|
|
11
|
+
* The ListViewItemWrapper component.
|
|
12
|
+
*/
|
|
13
|
+
declare const ListViewItemWrapper: React.FunctionComponent<ListViewItemWrapperProps>;
|
|
14
|
+
export { ListViewItemWrapper };
|
|
@@ -12,4 +12,4 @@
|
|
|
12
12
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
13
13
|
*-------------------------------------------------------------------------------------------
|
|
14
14
|
*/
|
|
15
|
-
!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,
|
|
15
|
+
!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:"13.4.0-develop.2",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)}});
|
package/events.d.ts
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { BaseEvent } from '@progress/kendo-react-common';
|
|
9
|
+
import { ListView } from './ListView.js';
|
|
10
|
+
/**
|
|
11
|
+
* The base event for ListView operations.
|
|
12
|
+
*/
|
|
13
|
+
export interface ListViewEvent extends BaseEvent<ListView> {
|
|
14
|
+
}
|
package/index.d.mts
CHANGED
|
@@ -5,197 +5,13 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
import {
|
|
9
|
-
import
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
*/
|
|
19
|
-
export declare interface ListViewEvent extends BaseEvent<ListView> {
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
/**
|
|
23
|
-
* The ListViewFooter component.
|
|
24
|
-
*/
|
|
25
|
-
export declare const ListViewFooter: React_2.FunctionComponent<ListViewFooterProps>;
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* Represents the props of the ListViewFooter component.
|
|
29
|
-
*/
|
|
30
|
-
export declare interface ListViewFooterProps {
|
|
31
|
-
/**
|
|
32
|
-
* Sets the ListViewFooter children elements.
|
|
33
|
-
*/
|
|
34
|
-
children?: React.ReactNode;
|
|
35
|
-
/**
|
|
36
|
-
* Sets additional CSS styles to the ListViewFooter.
|
|
37
|
-
*/
|
|
38
|
-
style?: React.CSSProperties;
|
|
39
|
-
/**
|
|
40
|
-
* Adds additional classes to the ListViewFooter.
|
|
41
|
-
*/
|
|
42
|
-
className?: string;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
/** @hidden */
|
|
46
|
-
declare interface ListViewHandle {
|
|
47
|
-
onScroll?: (event: ListViewEvent) => void;
|
|
48
|
-
props: ListViewProps;
|
|
49
|
-
context: {};
|
|
50
|
-
state: {};
|
|
51
|
-
refs: {};
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* The ListViewHeader component.
|
|
56
|
-
*/
|
|
57
|
-
export declare const ListViewHeader: React_2.FunctionComponent<ListViewHeaderProps>;
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Represents the props of the ListViewHeader component.
|
|
61
|
-
*/
|
|
62
|
-
export declare interface ListViewHeaderProps {
|
|
63
|
-
/**
|
|
64
|
-
* Sets the ListViewHeader children elements.
|
|
65
|
-
*/
|
|
66
|
-
children?: React.ReactNode;
|
|
67
|
-
/**
|
|
68
|
-
* Sets additional CSS styles to the ListViewHeader.
|
|
69
|
-
*/
|
|
70
|
-
style?: React.CSSProperties;
|
|
71
|
-
/**
|
|
72
|
-
* Adds additional classes to the ListViewHeader.
|
|
73
|
-
*/
|
|
74
|
-
className?: string;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* Represents the props of each ListView item.
|
|
79
|
-
*/
|
|
80
|
-
export declare interface ListViewItemProps {
|
|
81
|
-
/**
|
|
82
|
-
* The data object that represents the current item.
|
|
83
|
-
*/
|
|
84
|
-
dataItem: any;
|
|
85
|
-
/**
|
|
86
|
-
* The index of the item in the data collection.
|
|
87
|
-
*/
|
|
88
|
-
index?: number;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
/**
|
|
92
|
-
* The ListViewItemWrapper component.
|
|
93
|
-
*/
|
|
94
|
-
export declare const ListViewItemWrapper: React_2.FunctionComponent<ListViewItemWrapperProps>;
|
|
95
|
-
|
|
96
|
-
/**
|
|
97
|
-
* Represents the props of each ListViewWrapper item.
|
|
98
|
-
*/
|
|
99
|
-
declare interface ListViewItemWrapperProps {
|
|
100
|
-
/**
|
|
101
|
-
* Sets the ListViewItemWrapper children elements.
|
|
102
|
-
*/
|
|
103
|
-
children?: React.ReactNode;
|
|
104
|
-
/**
|
|
105
|
-
* Sets additional CSS styles to the ListViewItemWrapper.
|
|
106
|
-
*/
|
|
107
|
-
style?: React.CSSProperties;
|
|
108
|
-
/**
|
|
109
|
-
* Specifies the CSS class names which are set to the ListViewItemWrapper.
|
|
110
|
-
*/
|
|
111
|
-
className?: string;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
/**
|
|
115
|
-
* Represents the props of the [KendoReact ListView component](https://www.telerik.com/kendo-react-ui/components/listview).
|
|
116
|
-
*/
|
|
117
|
-
export declare interface ListViewProps {
|
|
118
|
-
/**
|
|
119
|
-
* Sets a class of the ListView DOM element.
|
|
120
|
-
*
|
|
121
|
-
* @example
|
|
122
|
-
* ```jsx
|
|
123
|
-
* <ListView className="custom-class" />
|
|
124
|
-
* ```
|
|
125
|
-
*/
|
|
126
|
-
className?: string;
|
|
127
|
-
/**
|
|
128
|
-
* Sets the data of the ListView.
|
|
129
|
-
*
|
|
130
|
-
* @example
|
|
131
|
-
* ```jsx
|
|
132
|
-
* <ListView data={[{ text: 'Item 1' }, { text: 'Item 2' }]} />
|
|
133
|
-
* ```
|
|
134
|
-
*/
|
|
135
|
-
data?: any[];
|
|
136
|
-
/**
|
|
137
|
-
* Defines the component that renders for each item of the data collection.
|
|
138
|
-
*
|
|
139
|
-
* @example
|
|
140
|
-
* ```jsx
|
|
141
|
-
* const CustomItem = (props) => <div>{props.text}</div>;
|
|
142
|
-
*
|
|
143
|
-
* <ListView item={CustomItem} />
|
|
144
|
-
* ```
|
|
145
|
-
*/
|
|
146
|
-
item?: React.ComponentType<ListViewItemProps>;
|
|
147
|
-
/**
|
|
148
|
-
* Defines the component that renders for the ListView header.
|
|
149
|
-
*
|
|
150
|
-
* @example
|
|
151
|
-
* ```jsx
|
|
152
|
-
* const CustomHeader = (props) => <div>Custom Header</div>;
|
|
153
|
-
*
|
|
154
|
-
* <ListView header={CustomHeader} />
|
|
155
|
-
* ```
|
|
156
|
-
*/
|
|
157
|
-
header?: React.ComponentType<any>;
|
|
158
|
-
/**
|
|
159
|
-
* Defines the component that renders for the ListView footer.
|
|
160
|
-
*
|
|
161
|
-
* @example
|
|
162
|
-
* ```jsx
|
|
163
|
-
* const CustomFooter = (props) => <div>Custom Footer</div>;
|
|
164
|
-
*
|
|
165
|
-
* <ListView footer={CustomFooter} />
|
|
166
|
-
* ```
|
|
167
|
-
*/
|
|
168
|
-
footer?: React.ComponentType<any>;
|
|
169
|
-
/**
|
|
170
|
-
* Sets styles to the ListView container.
|
|
171
|
-
*
|
|
172
|
-
* @example
|
|
173
|
-
* ```jsx
|
|
174
|
-
* <ListView style={{ height: '400px' }} />
|
|
175
|
-
* ```
|
|
176
|
-
*/
|
|
177
|
-
style?: React.CSSProperties;
|
|
178
|
-
/**
|
|
179
|
-
* Fires when the ListView has been scrolled.
|
|
180
|
-
*
|
|
181
|
-
* @example
|
|
182
|
-
* ```jsx
|
|
183
|
-
* <ListView onScroll={(event) => console.log(event)} />
|
|
184
|
-
* ```
|
|
185
|
-
*/
|
|
186
|
-
onScroll?: (event: ListViewEvent) => void;
|
|
187
|
-
/**
|
|
188
|
-
* If set to `true`, the user can use dedicated shortcuts to interact with the ListView.
|
|
189
|
-
* By default, navigation is disabled.
|
|
190
|
-
*
|
|
191
|
-
* @default false
|
|
192
|
-
*
|
|
193
|
-
* @example
|
|
194
|
-
* ```jsx
|
|
195
|
-
* <ListView navigatable={true} />
|
|
196
|
-
* ```
|
|
197
|
-
*/
|
|
198
|
-
navigatable?: boolean;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
export { }
|
|
8
|
+
import { ListView } from './ListView.js';
|
|
9
|
+
import { ListViewHeader } from './ListViewHeader.js';
|
|
10
|
+
import { ListViewFooter } from './ListViewFooter.js';
|
|
11
|
+
import { ListViewItemWrapper } from './ListViewItemWrapper.js';
|
|
12
|
+
import { ListViewProps } from './interfaces/ListViewProps.js';
|
|
13
|
+
import { ListViewItemProps } from './interfaces/ListViewItemProps.js';
|
|
14
|
+
import { ListViewFooterProps } from './interfaces/ListViewFooterProps.js';
|
|
15
|
+
import { ListViewHeaderProps } from './interfaces/ListViewHeaderProps.js';
|
|
16
|
+
import { ListViewEvent } from './events.js';
|
|
17
|
+
export { ListView, ListViewProps, ListViewEvent, ListViewHeader, ListViewFooter, ListViewItemWrapper, ListViewItemProps, ListViewFooterProps, ListViewHeaderProps };
|
package/index.d.ts
CHANGED
|
@@ -5,197 +5,13 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
import {
|
|
9
|
-
import
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
*/
|
|
19
|
-
export declare interface ListViewEvent extends BaseEvent<ListView> {
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
/**
|
|
23
|
-
* The ListViewFooter component.
|
|
24
|
-
*/
|
|
25
|
-
export declare const ListViewFooter: React_2.FunctionComponent<ListViewFooterProps>;
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* Represents the props of the ListViewFooter component.
|
|
29
|
-
*/
|
|
30
|
-
export declare interface ListViewFooterProps {
|
|
31
|
-
/**
|
|
32
|
-
* Sets the ListViewFooter children elements.
|
|
33
|
-
*/
|
|
34
|
-
children?: React.ReactNode;
|
|
35
|
-
/**
|
|
36
|
-
* Sets additional CSS styles to the ListViewFooter.
|
|
37
|
-
*/
|
|
38
|
-
style?: React.CSSProperties;
|
|
39
|
-
/**
|
|
40
|
-
* Adds additional classes to the ListViewFooter.
|
|
41
|
-
*/
|
|
42
|
-
className?: string;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
/** @hidden */
|
|
46
|
-
declare interface ListViewHandle {
|
|
47
|
-
onScroll?: (event: ListViewEvent) => void;
|
|
48
|
-
props: ListViewProps;
|
|
49
|
-
context: {};
|
|
50
|
-
state: {};
|
|
51
|
-
refs: {};
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* The ListViewHeader component.
|
|
56
|
-
*/
|
|
57
|
-
export declare const ListViewHeader: React_2.FunctionComponent<ListViewHeaderProps>;
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Represents the props of the ListViewHeader component.
|
|
61
|
-
*/
|
|
62
|
-
export declare interface ListViewHeaderProps {
|
|
63
|
-
/**
|
|
64
|
-
* Sets the ListViewHeader children elements.
|
|
65
|
-
*/
|
|
66
|
-
children?: React.ReactNode;
|
|
67
|
-
/**
|
|
68
|
-
* Sets additional CSS styles to the ListViewHeader.
|
|
69
|
-
*/
|
|
70
|
-
style?: React.CSSProperties;
|
|
71
|
-
/**
|
|
72
|
-
* Adds additional classes to the ListViewHeader.
|
|
73
|
-
*/
|
|
74
|
-
className?: string;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* Represents the props of each ListView item.
|
|
79
|
-
*/
|
|
80
|
-
export declare interface ListViewItemProps {
|
|
81
|
-
/**
|
|
82
|
-
* The data object that represents the current item.
|
|
83
|
-
*/
|
|
84
|
-
dataItem: any;
|
|
85
|
-
/**
|
|
86
|
-
* The index of the item in the data collection.
|
|
87
|
-
*/
|
|
88
|
-
index?: number;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
/**
|
|
92
|
-
* The ListViewItemWrapper component.
|
|
93
|
-
*/
|
|
94
|
-
export declare const ListViewItemWrapper: React_2.FunctionComponent<ListViewItemWrapperProps>;
|
|
95
|
-
|
|
96
|
-
/**
|
|
97
|
-
* Represents the props of each ListViewWrapper item.
|
|
98
|
-
*/
|
|
99
|
-
declare interface ListViewItemWrapperProps {
|
|
100
|
-
/**
|
|
101
|
-
* Sets the ListViewItemWrapper children elements.
|
|
102
|
-
*/
|
|
103
|
-
children?: React.ReactNode;
|
|
104
|
-
/**
|
|
105
|
-
* Sets additional CSS styles to the ListViewItemWrapper.
|
|
106
|
-
*/
|
|
107
|
-
style?: React.CSSProperties;
|
|
108
|
-
/**
|
|
109
|
-
* Specifies the CSS class names which are set to the ListViewItemWrapper.
|
|
110
|
-
*/
|
|
111
|
-
className?: string;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
/**
|
|
115
|
-
* Represents the props of the [KendoReact ListView component](https://www.telerik.com/kendo-react-ui/components/listview).
|
|
116
|
-
*/
|
|
117
|
-
export declare interface ListViewProps {
|
|
118
|
-
/**
|
|
119
|
-
* Sets a class of the ListView DOM element.
|
|
120
|
-
*
|
|
121
|
-
* @example
|
|
122
|
-
* ```jsx
|
|
123
|
-
* <ListView className="custom-class" />
|
|
124
|
-
* ```
|
|
125
|
-
*/
|
|
126
|
-
className?: string;
|
|
127
|
-
/**
|
|
128
|
-
* Sets the data of the ListView.
|
|
129
|
-
*
|
|
130
|
-
* @example
|
|
131
|
-
* ```jsx
|
|
132
|
-
* <ListView data={[{ text: 'Item 1' }, { text: 'Item 2' }]} />
|
|
133
|
-
* ```
|
|
134
|
-
*/
|
|
135
|
-
data?: any[];
|
|
136
|
-
/**
|
|
137
|
-
* Defines the component that renders for each item of the data collection.
|
|
138
|
-
*
|
|
139
|
-
* @example
|
|
140
|
-
* ```jsx
|
|
141
|
-
* const CustomItem = (props) => <div>{props.text}</div>;
|
|
142
|
-
*
|
|
143
|
-
* <ListView item={CustomItem} />
|
|
144
|
-
* ```
|
|
145
|
-
*/
|
|
146
|
-
item?: React.ComponentType<ListViewItemProps>;
|
|
147
|
-
/**
|
|
148
|
-
* Defines the component that renders for the ListView header.
|
|
149
|
-
*
|
|
150
|
-
* @example
|
|
151
|
-
* ```jsx
|
|
152
|
-
* const CustomHeader = (props) => <div>Custom Header</div>;
|
|
153
|
-
*
|
|
154
|
-
* <ListView header={CustomHeader} />
|
|
155
|
-
* ```
|
|
156
|
-
*/
|
|
157
|
-
header?: React.ComponentType<any>;
|
|
158
|
-
/**
|
|
159
|
-
* Defines the component that renders for the ListView footer.
|
|
160
|
-
*
|
|
161
|
-
* @example
|
|
162
|
-
* ```jsx
|
|
163
|
-
* const CustomFooter = (props) => <div>Custom Footer</div>;
|
|
164
|
-
*
|
|
165
|
-
* <ListView footer={CustomFooter} />
|
|
166
|
-
* ```
|
|
167
|
-
*/
|
|
168
|
-
footer?: React.ComponentType<any>;
|
|
169
|
-
/**
|
|
170
|
-
* Sets styles to the ListView container.
|
|
171
|
-
*
|
|
172
|
-
* @example
|
|
173
|
-
* ```jsx
|
|
174
|
-
* <ListView style={{ height: '400px' }} />
|
|
175
|
-
* ```
|
|
176
|
-
*/
|
|
177
|
-
style?: React.CSSProperties;
|
|
178
|
-
/**
|
|
179
|
-
* Fires when the ListView has been scrolled.
|
|
180
|
-
*
|
|
181
|
-
* @example
|
|
182
|
-
* ```jsx
|
|
183
|
-
* <ListView onScroll={(event) => console.log(event)} />
|
|
184
|
-
* ```
|
|
185
|
-
*/
|
|
186
|
-
onScroll?: (event: ListViewEvent) => void;
|
|
187
|
-
/**
|
|
188
|
-
* If set to `true`, the user can use dedicated shortcuts to interact with the ListView.
|
|
189
|
-
* By default, navigation is disabled.
|
|
190
|
-
*
|
|
191
|
-
* @default false
|
|
192
|
-
*
|
|
193
|
-
* @example
|
|
194
|
-
* ```jsx
|
|
195
|
-
* <ListView navigatable={true} />
|
|
196
|
-
* ```
|
|
197
|
-
*/
|
|
198
|
-
navigatable?: boolean;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
export { }
|
|
8
|
+
import { ListView } from './ListView.js';
|
|
9
|
+
import { ListViewHeader } from './ListViewHeader.js';
|
|
10
|
+
import { ListViewFooter } from './ListViewFooter.js';
|
|
11
|
+
import { ListViewItemWrapper } from './ListViewItemWrapper.js';
|
|
12
|
+
import { ListViewProps } from './interfaces/ListViewProps.js';
|
|
13
|
+
import { ListViewItemProps } from './interfaces/ListViewItemProps.js';
|
|
14
|
+
import { ListViewFooterProps } from './interfaces/ListViewFooterProps.js';
|
|
15
|
+
import { ListViewHeaderProps } from './interfaces/ListViewHeaderProps.js';
|
|
16
|
+
import { ListViewEvent } from './events.js';
|
|
17
|
+
export { ListView, ListViewProps, ListViewEvent, ListViewHeader, ListViewFooter, ListViewItemWrapper, ListViewItemProps, ListViewFooterProps, ListViewHeaderProps };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Represents the props of the ListViewFooter component.
|
|
10
|
+
*/
|
|
11
|
+
export interface ListViewFooterProps {
|
|
12
|
+
/**
|
|
13
|
+
* Sets the ListViewFooter children elements.
|
|
14
|
+
*/
|
|
15
|
+
children?: React.ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Sets additional CSS styles to the ListViewFooter.
|
|
18
|
+
*/
|
|
19
|
+
style?: React.CSSProperties;
|
|
20
|
+
/**
|
|
21
|
+
* Adds additional classes to the ListViewFooter.
|
|
22
|
+
*/
|
|
23
|
+
className?: string;
|
|
24
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Represents the props of the ListViewHeader component.
|
|
10
|
+
*/
|
|
11
|
+
export interface ListViewHeaderProps {
|
|
12
|
+
/**
|
|
13
|
+
* Sets the ListViewHeader children elements.
|
|
14
|
+
*/
|
|
15
|
+
children?: React.ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Sets additional CSS styles to the ListViewHeader.
|
|
18
|
+
*/
|
|
19
|
+
style?: React.CSSProperties;
|
|
20
|
+
/**
|
|
21
|
+
* Adds additional classes to the ListViewHeader.
|
|
22
|
+
*/
|
|
23
|
+
className?: string;
|
|
24
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Represents the props of each ListView item.
|
|
10
|
+
*/
|
|
11
|
+
export interface ListViewItemProps {
|
|
12
|
+
/**
|
|
13
|
+
* The data object that represents the current item.
|
|
14
|
+
*/
|
|
15
|
+
dataItem: any;
|
|
16
|
+
/**
|
|
17
|
+
* The index of the item in the data collection.
|
|
18
|
+
*/
|
|
19
|
+
index?: number;
|
|
20
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Represents the props of each ListViewWrapper item.
|
|
10
|
+
*/
|
|
11
|
+
export interface ListViewItemWrapperProps {
|
|
12
|
+
/**
|
|
13
|
+
* Sets the ListViewItemWrapper children elements.
|
|
14
|
+
*/
|
|
15
|
+
children?: React.ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Sets additional CSS styles to the ListViewItemWrapper.
|
|
18
|
+
*/
|
|
19
|
+
style?: React.CSSProperties;
|
|
20
|
+
/**
|
|
21
|
+
* Specifies the CSS class names which are set to the ListViewItemWrapper.
|
|
22
|
+
*/
|
|
23
|
+
className?: string;
|
|
24
|
+
}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ListViewEvent } from '../events.js';
|
|
9
|
+
import { ListViewItemProps } from './ListViewItemProps.js';
|
|
10
|
+
/**
|
|
11
|
+
* Represents the props of the [KendoReact ListView component](https://www.telerik.com/kendo-react-ui/components/listview).
|
|
12
|
+
*/
|
|
13
|
+
export interface ListViewProps {
|
|
14
|
+
/**
|
|
15
|
+
* Sets a class of the ListView DOM element.
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* ```jsx
|
|
19
|
+
* <ListView className="custom-class" />
|
|
20
|
+
* ```
|
|
21
|
+
*/
|
|
22
|
+
className?: string;
|
|
23
|
+
/**
|
|
24
|
+
* Sets the data of the ListView.
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```jsx
|
|
28
|
+
* <ListView data={[{ text: 'Item 1' }, { text: 'Item 2' }]} />
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
data?: any[];
|
|
32
|
+
/**
|
|
33
|
+
* Defines the component that renders for each item of the data collection.
|
|
34
|
+
*
|
|
35
|
+
* @example
|
|
36
|
+
* ```jsx
|
|
37
|
+
* const CustomItem = (props) => <div>{props.text}</div>;
|
|
38
|
+
*
|
|
39
|
+
* <ListView item={CustomItem} />
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
42
|
+
item?: React.ComponentType<ListViewItemProps>;
|
|
43
|
+
/**
|
|
44
|
+
* Defines the component that renders for the ListView header.
|
|
45
|
+
*
|
|
46
|
+
* @example
|
|
47
|
+
* ```jsx
|
|
48
|
+
* const CustomHeader = (props) => <div>Custom Header</div>;
|
|
49
|
+
*
|
|
50
|
+
* <ListView header={CustomHeader} />
|
|
51
|
+
* ```
|
|
52
|
+
*/
|
|
53
|
+
header?: React.ComponentType<any>;
|
|
54
|
+
/**
|
|
55
|
+
* Defines the component that renders for the ListView footer.
|
|
56
|
+
*
|
|
57
|
+
* @example
|
|
58
|
+
* ```jsx
|
|
59
|
+
* const CustomFooter = (props) => <div>Custom Footer</div>;
|
|
60
|
+
*
|
|
61
|
+
* <ListView footer={CustomFooter} />
|
|
62
|
+
* ```
|
|
63
|
+
*/
|
|
64
|
+
footer?: React.ComponentType<any>;
|
|
65
|
+
/**
|
|
66
|
+
* Sets styles to the ListView container.
|
|
67
|
+
*
|
|
68
|
+
* @example
|
|
69
|
+
* ```jsx
|
|
70
|
+
* <ListView style={{ height: '400px' }} />
|
|
71
|
+
* ```
|
|
72
|
+
*/
|
|
73
|
+
style?: React.CSSProperties;
|
|
74
|
+
/**
|
|
75
|
+
* Fires when the ListView has been scrolled.
|
|
76
|
+
*
|
|
77
|
+
* @example
|
|
78
|
+
* ```jsx
|
|
79
|
+
* <ListView onScroll={(event) => console.log(event)} />
|
|
80
|
+
* ```
|
|
81
|
+
*/
|
|
82
|
+
onScroll?: (event: ListViewEvent) => void;
|
|
83
|
+
/**
|
|
84
|
+
* If set to `true`, the user can use dedicated shortcuts to interact with the ListView.
|
|
85
|
+
* By default, navigation is disabled.
|
|
86
|
+
*
|
|
87
|
+
* @default false
|
|
88
|
+
*
|
|
89
|
+
* @example
|
|
90
|
+
* ```jsx
|
|
91
|
+
* <ListView navigatable={true} />
|
|
92
|
+
* ```
|
|
93
|
+
*/
|
|
94
|
+
navigatable?: boolean;
|
|
95
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { PackageMetadata } from '@progress/kendo-licensing';
|
|
9
|
+
/**
|
|
10
|
+
* @hidden
|
|
11
|
+
*/
|
|
12
|
+
export declare const packageMetadata: PackageMetadata;
|
package/package-metadata.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"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:
|
|
8
|
+
"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: 1770288334,version:"13.4.0-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
|
package/package-metadata.mjs
CHANGED
|
@@ -1,19 +1,13 @@
|
|
|
1
|
+
// Generated file. DO NOT EDIT.
|
|
1
2
|
/**
|
|
2
|
-
* @
|
|
3
|
-
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
-
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
-
*-------------------------------------------------------------------------------------------
|
|
3
|
+
* @hidden
|
|
7
4
|
*/
|
|
8
|
-
const
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
5
|
+
export const packageMetadata = Object.freeze({
|
|
6
|
+
name: '@progress/kendo-react-listview',
|
|
7
|
+
productName: 'KendoReact',
|
|
8
|
+
productCode: 'KENDOUIREACT',
|
|
9
|
+
productCodes: ['KENDOUIREACT'],
|
|
10
|
+
publishDate: 0,
|
|
11
|
+
version: '13.4.0-develop.2',
|
|
12
|
+
licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
|
|
16
13
|
});
|
|
17
|
-
export {
|
|
18
|
-
e as packageMetadata
|
|
19
|
-
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-listview",
|
|
3
|
-
"version": "13.
|
|
3
|
+
"version": "13.4.0-develop.2",
|
|
4
4
|
"description": "React ListView enables you to display a custom layout of data items. KendoReact ListView package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"sideEffects": false,
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"@progress/kendo-licensing": "^1.7.2",
|
|
29
|
-
"@progress/kendo-react-common": "13.
|
|
29
|
+
"@progress/kendo-react-common": "13.4.0-develop.2",
|
|
30
30
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
|
|
31
31
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
|
|
32
32
|
},
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"package": {
|
|
52
52
|
"productName": "KendoReact",
|
|
53
53
|
"productCode": "KENDOUIREACT",
|
|
54
|
-
"publishDate":
|
|
54
|
+
"publishDate": 1770288334,
|
|
55
55
|
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
56
56
|
}
|
|
57
57
|
},
|