@progress/kendo-react-dropdowns 4.10.0-dev.202110050803 → 4.10.0-dev.202110151005
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/README.md +43 -11
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/dist/es/AutoComplete/AutoComplete.d.ts +1 -0
- package/dist/es/AutoComplete/AutoComplete.js +1 -0
- package/dist/es/ComboBox/ComboBox.d.ts +1 -0
- package/dist/es/ComboBox/ComboBox.js +1 -0
- package/dist/es/DropDownList/DropDownList.d.ts +2 -3
- package/dist/es/DropDownList/DropDownList.js +1 -0
- package/dist/es/DropDownTree/DropDownTree.js +2 -1
- package/dist/es/MultiColumnComboBox/MultiColumnComboBox.js +1 -1
- package/dist/es/MultiSelect/MultiSelect.d.ts +1 -0
- package/dist/es/MultiSelect/MultiSelect.js +1 -0
- package/dist/es/MultiSelectTree/MultiSelectTree.js +2 -1
- package/dist/es/common/DropDownBase.d.ts +2 -0
- package/dist/es/common/DropDownBase.js +1 -0
- package/dist/es/common/settings.d.ts +4 -0
- package/dist/es/package-metadata.js +1 -1
- package/dist/npm/AutoComplete/AutoComplete.d.ts +1 -0
- package/dist/npm/AutoComplete/AutoComplete.js +1 -0
- package/dist/npm/ComboBox/ComboBox.d.ts +1 -0
- package/dist/npm/ComboBox/ComboBox.js +1 -0
- package/dist/npm/DropDownList/DropDownList.d.ts +2 -3
- package/dist/npm/DropDownList/DropDownList.js +1 -0
- package/dist/npm/DropDownTree/DropDownTree.js +2 -1
- package/dist/npm/MultiColumnComboBox/MultiColumnComboBox.js +1 -1
- package/dist/npm/MultiSelect/MultiSelect.d.ts +1 -0
- package/dist/npm/MultiSelect/MultiSelect.js +1 -0
- package/dist/npm/MultiSelectTree/MultiSelectTree.js +2 -1
- package/dist/npm/common/DropDownBase.d.ts +2 -0
- package/dist/npm/common/DropDownBase.js +1 -0
- package/dist/npm/common/settings.d.ts +4 -0
- package/dist/npm/package-metadata.js +1 -1
- package/dist/systemjs/kendo-react-dropdowns.js +1 -1
- package/package.json +7 -7
|
@@ -71,6 +71,7 @@ export default class AutoComplete extends React.Component<AutoCompleteProps, Aut
|
|
|
71
71
|
openDuration: PropTypes.Requireable<number>;
|
|
72
72
|
closeDuration: PropTypes.Requireable<number>;
|
|
73
73
|
}>>;
|
|
74
|
+
popupClass: PropTypes.Requireable<string>;
|
|
74
75
|
className: PropTypes.Requireable<string>;
|
|
75
76
|
appendTo: PropTypes.Requireable<any>;
|
|
76
77
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -392,6 +392,7 @@ var AutoComplete = /** @class */ (function (_super) {
|
|
|
392
392
|
animate: popupSettings.animate,
|
|
393
393
|
anchor: this.element,
|
|
394
394
|
show: opened,
|
|
395
|
+
popupClass: popupSettings.popupClass,
|
|
395
396
|
className: classNames('k-list-container k-reset', popupSettings.className),
|
|
396
397
|
appendTo: popupSettings.appendTo
|
|
397
398
|
}, dir: dir !== undefined ? dir : this.base.dirCalculated, itemsCount: [data.length] },
|
|
@@ -84,6 +84,7 @@ export default class ComboBox extends React.Component<ComboBoxProps, ComboBoxSta
|
|
|
84
84
|
openDuration: PropTypes.Requireable<number>;
|
|
85
85
|
closeDuration: PropTypes.Requireable<number>;
|
|
86
86
|
}>>;
|
|
87
|
+
popupClass: PropTypes.Requireable<string>;
|
|
87
88
|
className: PropTypes.Requireable<string>;
|
|
88
89
|
appendTo: PropTypes.Requireable<any>;
|
|
89
90
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -530,6 +530,7 @@ var ComboBox = /** @class */ (function (_super) {
|
|
|
530
530
|
animate: popupSettings.animate,
|
|
531
531
|
anchor: this.element,
|
|
532
532
|
show: opened,
|
|
533
|
+
popupClass: popupSettings.popupClass,
|
|
533
534
|
className: classNames('k-list-container k-reset', popupSettings.className),
|
|
534
535
|
appendTo: popupSettings.appendTo
|
|
535
536
|
}, dir: dir !== undefined ? dir : this.base.dirCalculated, itemsCount: [data.length] },
|
|
@@ -62,6 +62,7 @@ export default class DropDownList extends React.Component<DropDownListProps, Dro
|
|
|
62
62
|
openDuration: PropTypes.Requireable<number>;
|
|
63
63
|
closeDuration: PropTypes.Requireable<number>;
|
|
64
64
|
}>>;
|
|
65
|
+
popupClass: PropTypes.Requireable<string>;
|
|
65
66
|
className: PropTypes.Requireable<string>;
|
|
66
67
|
appendTo: PropTypes.Requireable<any>;
|
|
67
68
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -97,9 +98,7 @@ export default class DropDownList extends React.Component<DropDownListProps, Dro
|
|
|
97
98
|
static defaultProps: {
|
|
98
99
|
required: boolean;
|
|
99
100
|
popupSettings: {
|
|
100
|
-
height: string;
|
|
101
|
-
* @hidden
|
|
102
|
-
*/
|
|
101
|
+
height: string;
|
|
103
102
|
};
|
|
104
103
|
validityStyles: boolean;
|
|
105
104
|
delay: number;
|
|
@@ -130,6 +130,7 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
130
130
|
dir: dir !== undefined ? dir : base.dirCalculated,
|
|
131
131
|
width: popupWidth,
|
|
132
132
|
popupSettings: {
|
|
133
|
+
popupClass: popupSettings.popupClass,
|
|
133
134
|
className: classNames('k-list-container k-reset', popupSettings.className),
|
|
134
135
|
animate: popupSettings.animate,
|
|
135
136
|
anchor: _this.element,
|
|
@@ -320,7 +320,7 @@ export var DropDownTree = React.forwardRef(function (props, ref) {
|
|
|
320
320
|
React.createElement("span", { className: classNames('k-icon', { 'k-i-arrow-60-down': !props.loading, 'k-i-loading': props.loading }) })),
|
|
321
321
|
React.createElement("select", { name: name, ref: selectRef, tabIndex: -1, "aria-hidden": true, title: label, style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: 'absolute', left: '50%' } },
|
|
322
322
|
React.createElement("option", { value: props.valueMap ? props.valueMap.call(undefined, value) : value }))),
|
|
323
|
-
React.createElement(Popup, { className: classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo },
|
|
323
|
+
React.createElement(Popup, { className: classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), popupClass: popupSettings.popupClass, style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo },
|
|
324
324
|
props.filterable && (React.createElement("span", { className: "k-list-filter" },
|
|
325
325
|
React.createElement("input", { className: "k-textbox", tabIndex: tabIndex, ref: inputRef, value: props.filter === undefined ? filter : props.filter, onChange: onFilterChange, onKeyDown: onInputKeyDown }),
|
|
326
326
|
React.createElement("span", { className: "k-icon k-i-zoom" }))),
|
|
@@ -361,6 +361,7 @@ var propTypes = {
|
|
|
361
361
|
openDuration: PropTypes.number,
|
|
362
362
|
closeDuration: PropTypes.number
|
|
363
363
|
})]),
|
|
364
|
+
popupClass: PropTypes.string,
|
|
364
365
|
className: PropTypes.string,
|
|
365
366
|
appendTo: PropTypes.any,
|
|
366
367
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
@@ -101,7 +101,7 @@ export var MultiColumnComboBox = React.forwardRef(function (props, ref) {
|
|
|
101
101
|
var onPageChangeHandler = React.useCallback(function (event) { return handleEvent(onPageChange, event); }, [onPageChange]);
|
|
102
102
|
React.useEffect(function () { setScrollbarWidth(); });
|
|
103
103
|
var List = React.useCallback(function (listProps) { return React.createElement(MultiColumnList, __assign({}, listProps)); }, []);
|
|
104
|
-
return (React.createElement(ComboBox, __assign({}, other, { list: List, popupSettings: __assign({ width: popupWidth }, popupSettings, {
|
|
104
|
+
return (React.createElement(ComboBox, __assign({}, other, { list: List, popupSettings: __assign({ width: popupWidth }, popupSettings, { popupClass: 'k-dropdowngrid-popup', className: classNames('k-popup-flush', popupSettings.className) }), ref: comboBoxRef, header: header, itemRender: itemRender, onOpen: onOpenHandler, onClose: onCloseHandler, onFocus: onFocusHandler, onBlur: onBlurHandler, onChange: onChangeHandler, onFilterChange: onFilterChangeHandler, onPageChange: onPageChangeHandler })));
|
|
105
105
|
});
|
|
106
106
|
var propTypes = __assign({}, ComboBox.propTypes, { columns: PropTypes.any.isRequired });
|
|
107
107
|
var defaultProps = {
|
|
@@ -85,6 +85,7 @@ export default class MultiSelect extends React.Component<MultiSelectProps, Multi
|
|
|
85
85
|
openDuration: PropTypes.Requireable<number>;
|
|
86
86
|
closeDuration: PropTypes.Requireable<number>;
|
|
87
87
|
}>>;
|
|
88
|
+
popupClass: PropTypes.Requireable<string>;
|
|
88
89
|
className: PropTypes.Requireable<string>;
|
|
89
90
|
appendTo: PropTypes.Requireable<any>;
|
|
90
91
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -260,6 +260,7 @@ var MultiSelect = /** @class */ (function (_super) {
|
|
|
260
260
|
dir: dir !== undefined ? dir : base.dirCalculated,
|
|
261
261
|
width: popupWidth,
|
|
262
262
|
popupSettings: {
|
|
263
|
+
popupClass: popupSettings.popupClass,
|
|
263
264
|
className: classNames('k-list-container k-reset', popupSettings.className),
|
|
264
265
|
animate: popupSettings.animate,
|
|
265
266
|
anchor: _this.element,
|
|
@@ -372,7 +372,7 @@ export var MultiSelectTree = React.forwardRef(function (props, ref) {
|
|
|
372
372
|
hasValue && !disabled && (React.createElement("span", { onClick: onClear, className: "k-icon k-clear-value k-i-close", title: localization.toLanguageString(clear, messages[clear]), role: "button", tabIndex: -1, onMouseDown: function (e) { return e.preventDefault(); } })),
|
|
373
373
|
React.createElement("select", { name: name, ref: selectRef, tabIndex: -1, "aria-hidden": true, title: label, style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: 'absolute', left: '50%' } },
|
|
374
374
|
React.createElement("option", { value: props.valueMap ? props.valueMap.call(undefined, value) : value }))),
|
|
375
|
-
React.createElement(Popup, { className: classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo, ref: popupRef },
|
|
375
|
+
React.createElement(Popup, { popupClass: popupSettings.popupClass, className: classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo, ref: popupRef },
|
|
376
376
|
props.filterable && (React.createElement("span", { className: "k-list-filter" },
|
|
377
377
|
React.createElement("input", { className: "k-textbox", tabIndex: tabIndex, ref: inputRef, value: props.filter === undefined ? filterState : props.filter, onChange: onFilterChange, onKeyDown: onInputKeyDown }),
|
|
378
378
|
React.createElement("span", { className: "k-icon k-i-zoom" }))),
|
|
@@ -418,6 +418,7 @@ var propTypes = {
|
|
|
418
418
|
openDuration: PropTypes.number,
|
|
419
419
|
closeDuration: PropTypes.number
|
|
420
420
|
})]),
|
|
421
|
+
popupClass: PropTypes.string,
|
|
421
422
|
className: PropTypes.string,
|
|
422
423
|
appendTo: PropTypes.any,
|
|
423
424
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
@@ -66,6 +66,7 @@ export default class DropDownBase {
|
|
|
66
66
|
openDuration: PropTypes.Requireable<number>;
|
|
67
67
|
closeDuration: PropTypes.Requireable<number>;
|
|
68
68
|
}>>;
|
|
69
|
+
popupClass: PropTypes.Requireable<string>;
|
|
69
70
|
className: PropTypes.Requireable<string>;
|
|
70
71
|
appendTo: PropTypes.Requireable<any>;
|
|
71
72
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -109,6 +110,7 @@ export default class DropDownBase {
|
|
|
109
110
|
openDuration: PropTypes.Requireable<number>;
|
|
110
111
|
closeDuration: PropTypes.Requireable<number>;
|
|
111
112
|
}>>;
|
|
113
|
+
popupClass: PropTypes.Requireable<string>;
|
|
112
114
|
className: PropTypes.Requireable<string>;
|
|
113
115
|
appendTo: PropTypes.Requireable<any>;
|
|
114
116
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -231,6 +231,7 @@ var DropDownBase = /** @class */ (function () {
|
|
|
231
231
|
openDuration: PropTypes.number,
|
|
232
232
|
closeDuration: PropTypes.number
|
|
233
233
|
})]),
|
|
234
|
+
popupClass: PropTypes.string,
|
|
234
235
|
className: PropTypes.string,
|
|
235
236
|
appendTo: PropTypes.any,
|
|
236
237
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
@@ -42,6 +42,10 @@ export interface DropDownsPopupSettings {
|
|
|
42
42
|
* Specifies a list of CSS classes that will be added to the Popup element.
|
|
43
43
|
*/
|
|
44
44
|
className?: string | Array<string>;
|
|
45
|
+
/**
|
|
46
|
+
* Specifies a list of CSS classes that are used for styling the popup inner element.
|
|
47
|
+
*/
|
|
48
|
+
popupClass?: string;
|
|
45
49
|
/**
|
|
46
50
|
* Sets the width of the popup container. By default, the width of the host element is used.
|
|
47
51
|
*/
|
|
@@ -5,7 +5,7 @@ export var packageMetadata = {
|
|
|
5
5
|
name: '@progress/kendo-react-dropdowns',
|
|
6
6
|
productName: 'KendoReact',
|
|
7
7
|
productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
|
|
8
|
-
publishDate:
|
|
8
|
+
publishDate: 1634291501,
|
|
9
9
|
version: '',
|
|
10
10
|
licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
|
|
11
11
|
};
|
|
@@ -71,6 +71,7 @@ export default class AutoComplete extends React.Component<AutoCompleteProps, Aut
|
|
|
71
71
|
openDuration: PropTypes.Requireable<number>;
|
|
72
72
|
closeDuration: PropTypes.Requireable<number>;
|
|
73
73
|
}>>;
|
|
74
|
+
popupClass: PropTypes.Requireable<string>;
|
|
74
75
|
className: PropTypes.Requireable<string>;
|
|
75
76
|
appendTo: PropTypes.Requireable<any>;
|
|
76
77
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -394,6 +394,7 @@ var AutoComplete = /** @class */ (function (_super) {
|
|
|
394
394
|
animate: popupSettings.animate,
|
|
395
395
|
anchor: this.element,
|
|
396
396
|
show: opened,
|
|
397
|
+
popupClass: popupSettings.popupClass,
|
|
397
398
|
className: kendo_react_common_1.classNames('k-list-container k-reset', popupSettings.className),
|
|
398
399
|
appendTo: popupSettings.appendTo
|
|
399
400
|
}, dir: dir !== undefined ? dir : this.base.dirCalculated, itemsCount: [data.length] },
|
|
@@ -84,6 +84,7 @@ export default class ComboBox extends React.Component<ComboBoxProps, ComboBoxSta
|
|
|
84
84
|
openDuration: PropTypes.Requireable<number>;
|
|
85
85
|
closeDuration: PropTypes.Requireable<number>;
|
|
86
86
|
}>>;
|
|
87
|
+
popupClass: PropTypes.Requireable<string>;
|
|
87
88
|
className: PropTypes.Requireable<string>;
|
|
88
89
|
appendTo: PropTypes.Requireable<any>;
|
|
89
90
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -532,6 +532,7 @@ var ComboBox = /** @class */ (function (_super) {
|
|
|
532
532
|
animate: popupSettings.animate,
|
|
533
533
|
anchor: this.element,
|
|
534
534
|
show: opened,
|
|
535
|
+
popupClass: popupSettings.popupClass,
|
|
535
536
|
className: kendo_react_common_1.classNames('k-list-container k-reset', popupSettings.className),
|
|
536
537
|
appendTo: popupSettings.appendTo
|
|
537
538
|
}, dir: dir !== undefined ? dir : this.base.dirCalculated, itemsCount: [data.length] },
|
|
@@ -62,6 +62,7 @@ export default class DropDownList extends React.Component<DropDownListProps, Dro
|
|
|
62
62
|
openDuration: PropTypes.Requireable<number>;
|
|
63
63
|
closeDuration: PropTypes.Requireable<number>;
|
|
64
64
|
}>>;
|
|
65
|
+
popupClass: PropTypes.Requireable<string>;
|
|
65
66
|
className: PropTypes.Requireable<string>;
|
|
66
67
|
appendTo: PropTypes.Requireable<any>;
|
|
67
68
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -97,9 +98,7 @@ export default class DropDownList extends React.Component<DropDownListProps, Dro
|
|
|
97
98
|
static defaultProps: {
|
|
98
99
|
required: boolean;
|
|
99
100
|
popupSettings: {
|
|
100
|
-
height: string;
|
|
101
|
-
* @hidden
|
|
102
|
-
*/
|
|
101
|
+
height: string;
|
|
103
102
|
};
|
|
104
103
|
validityStyles: boolean;
|
|
105
104
|
delay: number;
|
|
@@ -132,6 +132,7 @@ var DropDownList = /** @class */ (function (_super) {
|
|
|
132
132
|
dir: dir !== undefined ? dir : base.dirCalculated,
|
|
133
133
|
width: popupWidth,
|
|
134
134
|
popupSettings: {
|
|
135
|
+
popupClass: popupSettings.popupClass,
|
|
135
136
|
className: kendo_react_common_1.classNames('k-list-container k-reset', popupSettings.className),
|
|
136
137
|
animate: popupSettings.animate,
|
|
137
138
|
anchor: _this.element,
|
|
@@ -322,7 +322,7 @@ exports.DropDownTree = React.forwardRef(function (props, ref) {
|
|
|
322
322
|
React.createElement("span", { className: kendo_react_common_1.classNames('k-icon', { 'k-i-arrow-60-down': !props.loading, 'k-i-loading': props.loading }) })),
|
|
323
323
|
React.createElement("select", { name: name, ref: selectRef, tabIndex: -1, "aria-hidden": true, title: label, style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: 'absolute', left: '50%' } },
|
|
324
324
|
React.createElement("option", { value: props.valueMap ? props.valueMap.call(undefined, value) : value }))),
|
|
325
|
-
React.createElement(kendo_react_popup_1.Popup, { className: kendo_react_common_1.classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo },
|
|
325
|
+
React.createElement(kendo_react_popup_1.Popup, { className: kendo_react_common_1.classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), popupClass: popupSettings.popupClass, style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo },
|
|
326
326
|
props.filterable && (React.createElement("span", { className: "k-list-filter" },
|
|
327
327
|
React.createElement("input", { className: "k-textbox", tabIndex: tabIndex, ref: inputRef, value: props.filter === undefined ? filter : props.filter, onChange: onFilterChange, onKeyDown: onInputKeyDown }),
|
|
328
328
|
React.createElement("span", { className: "k-icon k-i-zoom" }))),
|
|
@@ -363,6 +363,7 @@ var propTypes = {
|
|
|
363
363
|
openDuration: PropTypes.number,
|
|
364
364
|
closeDuration: PropTypes.number
|
|
365
365
|
})]),
|
|
366
|
+
popupClass: PropTypes.string,
|
|
366
367
|
className: PropTypes.string,
|
|
367
368
|
appendTo: PropTypes.any,
|
|
368
369
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
@@ -103,7 +103,7 @@ exports.MultiColumnComboBox = React.forwardRef(function (props, ref) {
|
|
|
103
103
|
var onPageChangeHandler = React.useCallback(function (event) { return handleEvent(onPageChange, event); }, [onPageChange]);
|
|
104
104
|
React.useEffect(function () { kendo_react_common_1.setScrollbarWidth(); });
|
|
105
105
|
var List = React.useCallback(function (listProps) { return React.createElement(MultiColumnList_1.MultiColumnList, __assign({}, listProps)); }, []);
|
|
106
|
-
return (React.createElement(ComboBox_1.default, __assign({}, other, { list: List, popupSettings: __assign({ width: popupWidth }, popupSettings, {
|
|
106
|
+
return (React.createElement(ComboBox_1.default, __assign({}, other, { list: List, popupSettings: __assign({ width: popupWidth }, popupSettings, { popupClass: 'k-dropdowngrid-popup', className: kendo_react_common_1.classNames('k-popup-flush', popupSettings.className) }), ref: comboBoxRef, header: header, itemRender: itemRender, onOpen: onOpenHandler, onClose: onCloseHandler, onFocus: onFocusHandler, onBlur: onBlurHandler, onChange: onChangeHandler, onFilterChange: onFilterChangeHandler, onPageChange: onPageChangeHandler })));
|
|
107
107
|
});
|
|
108
108
|
var propTypes = __assign({}, ComboBox_1.default.propTypes, { columns: PropTypes.any.isRequired });
|
|
109
109
|
var defaultProps = {
|
|
@@ -85,6 +85,7 @@ export default class MultiSelect extends React.Component<MultiSelectProps, Multi
|
|
|
85
85
|
openDuration: PropTypes.Requireable<number>;
|
|
86
86
|
closeDuration: PropTypes.Requireable<number>;
|
|
87
87
|
}>>;
|
|
88
|
+
popupClass: PropTypes.Requireable<string>;
|
|
88
89
|
className: PropTypes.Requireable<string>;
|
|
89
90
|
appendTo: PropTypes.Requireable<any>;
|
|
90
91
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -262,6 +262,7 @@ var MultiSelect = /** @class */ (function (_super) {
|
|
|
262
262
|
dir: dir !== undefined ? dir : base.dirCalculated,
|
|
263
263
|
width: popupWidth,
|
|
264
264
|
popupSettings: {
|
|
265
|
+
popupClass: popupSettings.popupClass,
|
|
265
266
|
className: kendo_react_common_1.classNames('k-list-container k-reset', popupSettings.className),
|
|
266
267
|
animate: popupSettings.animate,
|
|
267
268
|
anchor: _this.element,
|
|
@@ -374,7 +374,7 @@ exports.MultiSelectTree = React.forwardRef(function (props, ref) {
|
|
|
374
374
|
hasValue && !disabled && (React.createElement("span", { onClick: onClear, className: "k-icon k-clear-value k-i-close", title: localization.toLanguageString(messages_1.clear, messages_1.messages[messages_1.clear]), role: "button", tabIndex: -1, onMouseDown: function (e) { return e.preventDefault(); } })),
|
|
375
375
|
React.createElement("select", { name: name, ref: selectRef, tabIndex: -1, "aria-hidden": true, title: label, style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: 'absolute', left: '50%' } },
|
|
376
376
|
React.createElement("option", { value: props.valueMap ? props.valueMap.call(undefined, value) : value }))),
|
|
377
|
-
React.createElement(kendo_react_popup_1.Popup, { className: kendo_react_common_1.classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo, ref: popupRef },
|
|
377
|
+
React.createElement(kendo_react_popup_1.Popup, { popupClass: popupSettings.popupClass, className: kendo_react_common_1.classNames('k-list-container k-group k-reset k-popup-dropdowntree', popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo, ref: popupRef },
|
|
378
378
|
props.filterable && (React.createElement("span", { className: "k-list-filter" },
|
|
379
379
|
React.createElement("input", { className: "k-textbox", tabIndex: tabIndex, ref: inputRef, value: props.filter === undefined ? filterState : props.filter, onChange: onFilterChange, onKeyDown: onInputKeyDown }),
|
|
380
380
|
React.createElement("span", { className: "k-icon k-i-zoom" }))),
|
|
@@ -420,6 +420,7 @@ var propTypes = {
|
|
|
420
420
|
openDuration: PropTypes.number,
|
|
421
421
|
closeDuration: PropTypes.number
|
|
422
422
|
})]),
|
|
423
|
+
popupClass: PropTypes.string,
|
|
423
424
|
className: PropTypes.string,
|
|
424
425
|
appendTo: PropTypes.any,
|
|
425
426
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
@@ -66,6 +66,7 @@ export default class DropDownBase {
|
|
|
66
66
|
openDuration: PropTypes.Requireable<number>;
|
|
67
67
|
closeDuration: PropTypes.Requireable<number>;
|
|
68
68
|
}>>;
|
|
69
|
+
popupClass: PropTypes.Requireable<string>;
|
|
69
70
|
className: PropTypes.Requireable<string>;
|
|
70
71
|
appendTo: PropTypes.Requireable<any>;
|
|
71
72
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -109,6 +110,7 @@ export default class DropDownBase {
|
|
|
109
110
|
openDuration: PropTypes.Requireable<number>;
|
|
110
111
|
closeDuration: PropTypes.Requireable<number>;
|
|
111
112
|
}>>;
|
|
113
|
+
popupClass: PropTypes.Requireable<string>;
|
|
112
114
|
className: PropTypes.Requireable<string>;
|
|
113
115
|
appendTo: PropTypes.Requireable<any>;
|
|
114
116
|
width: PropTypes.Requireable<string | number>;
|
|
@@ -233,6 +233,7 @@ var DropDownBase = /** @class */ (function () {
|
|
|
233
233
|
openDuration: PropTypes.number,
|
|
234
234
|
closeDuration: PropTypes.number
|
|
235
235
|
})]),
|
|
236
|
+
popupClass: PropTypes.string,
|
|
236
237
|
className: PropTypes.string,
|
|
237
238
|
appendTo: PropTypes.any,
|
|
238
239
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
@@ -42,6 +42,10 @@ export interface DropDownsPopupSettings {
|
|
|
42
42
|
* Specifies a list of CSS classes that will be added to the Popup element.
|
|
43
43
|
*/
|
|
44
44
|
className?: string | Array<string>;
|
|
45
|
+
/**
|
|
46
|
+
* Specifies a list of CSS classes that are used for styling the popup inner element.
|
|
47
|
+
*/
|
|
48
|
+
popupClass?: string;
|
|
45
49
|
/**
|
|
46
50
|
* Sets the width of the popup container. By default, the width of the host element is used.
|
|
47
51
|
*/
|
|
@@ -7,7 +7,7 @@ exports.packageMetadata = {
|
|
|
7
7
|
name: '@progress/kendo-react-dropdowns',
|
|
8
8
|
productName: 'KendoReact',
|
|
9
9
|
productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
|
|
10
|
-
publishDate:
|
|
10
|
+
publishDate: 1634291501,
|
|
11
11
|
version: '',
|
|
12
12
|
licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
|
|
13
13
|
};
|