@progress/kendo-react-dropdowns 5.18.0-dev.202309011146 → 5.18.0-dev.202309080842

package/dist/es/DropDownTree/DropDownTree.js

@@ -217,10 +217,13 @@ export var DropDownTree = React.forwardRef(function (directProps, ref) {
                 switchFocus(function () { var _a; focusElement(((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.element) || treeview); });
             }
         }
-        else {
-            if (altKey && keyCode === Keys.down) {
-                event.preventDefault();
-                openPopup(ev);
+        else if (altKey && keyCode === Keys.down) {
+            event.preventDefault();
+            openPopup(ev);
+        }
+        else if (!isOpen) {
+            if (keyCode === Keys.esc) {
+                onClear(event);
             }
         }
     }, [isOpen, opened, onOpen, onClose]);

package/dist/es/common/DropDownBase.d.ts

@@ -158,6 +158,16 @@ export default class DropDownBase {
     triggerOnPageChange(state: InternalState, skip: number, take: number): void;
     triggerPageChangeCornerItems(item: any, state: InternalState): void;
     scrollToVirtualItem: (virtual: VirtualizationSettings, selectedItemIndex: number) => void;
+    /**
+     * @hidden
+     * Scrolls the data inside the popup of a selected DropDown by `one page'. The page size
+     * depends on the height of the popup.
+     *
+     * @param {number} direction Defines the direction(Up/Down) in which the page will be moved
+     * @param {number} filterHeight Defines the heigh of the filter element that appears in the DropDownList and DropDownTree.
+     * This property is added for handling the filtering scenarios of the mentioned components.
+     */
+    scrollPopupByPageSize: (direction: number) => void;
     renderScrollElement: () => false | JSX.Element;
     getPopupSettings(): DropDownsPopupSettings;
     getGroupedDataModernMode(data: any[], groupField: string): any[];

package/dist/es/common/DropDownBase.js

@@ -99,6 +99,25 @@ var DropDownBase = /** @class */ (function () {
             }
             window.setTimeout(function () { return vs.enabled = true; }, 10);
         };
+        /**
+         * @hidden
+         * Scrolls the data inside the popup of a selected DropDown by `one page'. The page size
+         * depends on the height of the popup.
+         *
+         * @param {number} direction Defines the direction(Up/Down) in which the page will be moved
+         * @param {number} filterHeight Defines the heigh of the filter element that appears in the DropDownList and DropDownTree.
+         * This property is added for handling the filtering scenarios of the mentioned components.
+         */
+        this.scrollPopupByPageSize = function (direction) {
+            var _a, _b, _c, _d, _e, _f;
+            var vs = _this.vs;
+            var offsetTop = (_b = (_a = _this.list) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.scrollTop;
+            var itemHeight = (vs.enabled && vs.itemHeight ? vs.itemHeight : (_this.list ? _this.list.children[0].offsetHeight : 0));
+            var height = (_d = (_c = _this.list) === null || _c === void 0 ? void 0 : _c.parentElement) === null || _d === void 0 ? void 0 : _d.offsetHeight;
+            if (offsetTop !== undefined && height !== undefined) {
+                (_f = (_e = _this.list) === null || _e === void 0 ? void 0 : _e.parentElement) === null || _f === void 0 ? void 0 : _f.scroll({ top: offsetTop + direction * Math.floor(height / itemHeight) * itemHeight });
+            }
+        };
         this.renderScrollElement = function () {
             var vs = _this.vs;
             return vs.enabled && (React.createElement("div", { ref: function (element) { return vs.scrollElement = element; }, key: 'scrollElementKey' }));

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-react-dropdowns',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1693566995,
+    publishDate: 1694160401,
     version: '',
     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'
 };

package/dist/npm/DropDownTree/DropDownTree.js

@@ -220,10 +220,13 @@ exports.DropDownTree = React.forwardRef(function (directProps, ref) {
                 switchFocus(function () { var _a; focusElement(((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.element) || treeview); });
             }
         }
-        else {
-            if (altKey && keyCode === kendo_react_common_1.Keys.down) {
-                event.preventDefault();
-                openPopup(ev);
+        else if (altKey && keyCode === kendo_react_common_1.Keys.down) {
+            event.preventDefault();
+            openPopup(ev);
+        }
+        else if (!isOpen) {
+            if (keyCode === kendo_react_common_1.Keys.esc) {
+                onClear(event);
             }
         }
     }, [isOpen, opened, onOpen, onClose]);

package/dist/npm/common/DropDownBase.d.ts

@@ -158,6 +158,16 @@ export default class DropDownBase {
     triggerOnPageChange(state: InternalState, skip: number, take: number): void;
     triggerPageChangeCornerItems(item: any, state: InternalState): void;
     scrollToVirtualItem: (virtual: VirtualizationSettings, selectedItemIndex: number) => void;
+    /**
+     * @hidden
+     * Scrolls the data inside the popup of a selected DropDown by `one page'. The page size
+     * depends on the height of the popup.
+     *
+     * @param {number} direction Defines the direction(Up/Down) in which the page will be moved
+     * @param {number} filterHeight Defines the heigh of the filter element that appears in the DropDownList and DropDownTree.
+     * This property is added for handling the filtering scenarios of the mentioned components.
+     */
+    scrollPopupByPageSize: (direction: number) => void;
     renderScrollElement: () => false | JSX.Element;
     getPopupSettings(): DropDownsPopupSettings;
     getGroupedDataModernMode(data: any[], groupField: string): any[];

package/dist/npm/common/DropDownBase.js

@@ -101,6 +101,25 @@ var DropDownBase = /** @class */ (function () {
             }
             window.setTimeout(function () { return vs.enabled = true; }, 10);
         };
+        /**
+         * @hidden
+         * Scrolls the data inside the popup of a selected DropDown by `one page'. The page size
+         * depends on the height of the popup.
+         *
+         * @param {number} direction Defines the direction(Up/Down) in which the page will be moved
+         * @param {number} filterHeight Defines the heigh of the filter element that appears in the DropDownList and DropDownTree.
+         * This property is added for handling the filtering scenarios of the mentioned components.
+         */
+        this.scrollPopupByPageSize = function (direction) {
+            var _a, _b, _c, _d, _e, _f;
+            var vs = _this.vs;
+            var offsetTop = (_b = (_a = _this.list) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.scrollTop;
+            var itemHeight = (vs.enabled && vs.itemHeight ? vs.itemHeight : (_this.list ? _this.list.children[0].offsetHeight : 0));
+            var height = (_d = (_c = _this.list) === null || _c === void 0 ? void 0 : _c.parentElement) === null || _d === void 0 ? void 0 : _d.offsetHeight;
+            if (offsetTop !== undefined && height !== undefined) {
+                (_f = (_e = _this.list) === null || _e === void 0 ? void 0 : _e.parentElement) === null || _f === void 0 ? void 0 : _f.scroll({ top: offsetTop + direction * Math.floor(height / itemHeight) * itemHeight });
+            }
+        };
         this.renderScrollElement = function () {
             var vs = _this.vs;
             return vs.enabled && (React.createElement("div", { ref: function (element) { return vs.scrollElement = element; }, key: 'scrollElementKey' }));

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-dropdowns',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1693566995,
+    publishDate: 1694160401,
     version: '',
     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'
 };