@progress/kendo-vue-dropdowns 3.9.3 → 3.9.4-dev.202304190945

package/dist/es/DropDownTree/DropDownTree.d.ts

@@ -0,0 +1 @@
+

package/dist/es/DropDownTree/DropDownTree.js

@@ -0,0 +1,639 @@
+// // @ts-ignore
+// import * as Vue from 'vue';
+// const allVue = Vue as any;
+// const gh = allVue.h;
+// const isV3 = allVue.version && allVue.version[0] === '3';
+// import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+// type DefaultData<V> =  object | ((this: V) => {});
+// type DefaultMethods<V> =  { [key: string]: (this: V, ...args: any[]) => any };
+// import {
+//     classNames,
+//     noop,
+//     useRtl,
+//     getTabIndex,
+//     Keys,
+//     mapTree,
+//     extendDataItem,
+//     guid,
+//     kendoThemeMaps,
+//     Icon
+// } from '@progress/kendo-vue-common';
+// import { Popup } from '@progress/kendo-vue-popup';
+// import { provideLocalizationService } from '@progress/kendo-vue-intl';
+// import { TreeView, TreeViewExpandChangeEvent, TreeViewItemClickEvent } from '@progress/kendo-vue-treeview';
+// import { FilterDescriptor } from '@progress/kendo-data-query';
+// import { validatePackage } from '@progress/kendo-vue-common';
+// import { packageMetadata } from './../package-metadata';
+// import {
+//     DropDownTreeProps, DropDownTreeHandle, DropDownTreeFilterChangeEvent,
+//     DropDownTreeFocusEvent, DropDownTreeBlurEvent,
+//     DropDownTreeChangeEvent, DropDownTreeOpenEvent, DropDownTreeCloseEvent, DropDownTreeExpandEvent,
+//     ValueHolderProps
+// } from './DropDownTreeProps';
+// import { getItemValue, areSame, isPresent } from '../common/utils';
+// import { useDropdownWidth } from './useDropdownWidth';
+// import { ListNoData } from './ListNoData';
+// import { DropdownEvent } from '../common/events';
+// import { messages, clear, nodata } from './../messages/main';
+// import { FloatingLabel } from '@progress/kendo-vue-labels';
+// import { ListFilter } from '../common/ListFilter';
+// import { Button } from '@progress/kendo-vue-buttons';
+// import { xIcon, caretAltDownIcon } from '@progress/kendo-svg-icons';
+// const { sizeMap, roundedMap } = kendoThemeMaps;
+// const VALIDATION_MESSAGE: string = 'Please select a value from the list!';
+// const ValueHolder: React.FunctionComponent<ValueHolderProps> = props =>
+//   <span className="k-input-value-text">{props.children}</span>;
+// const toLevel = (hierarchicalIndex: string): number[] =>
+//     hierarchicalIndex.split('_').map(i => parseInt(i, 10));
+// const getValidity = (parameters: { validationMessage?: string; valid?: 
+// boolean; required?: boolean }, hasValue: boolean) => {
+//     const {validationMessage, valid, required } = parameters;
+//     return ({
+//         customError: validationMessage !== undefined,
+//         valid: Boolean(valid !== undefined ? valid : (!required || hasValue)),
+//         valueMissing: !hasValue
+//     });
+// };
+// const defaultProps = {
+//     selectField: 'selected',
+//     subItemsField: 'items',
+//     popupSettings: {
+//         animate: true,
+//         width: '200px',
+//         height: '200px'
+//     },
+//     required: false,
+//     validityStyles: true,
+//     size: 'medium' as DropDownTreeProps['size'],
+//     rounded: 'medium' as DropDownTreeProps['rounded'],
+//     fillMode: 'solid' as DropDownTreeProps['fillMode']
+// };
+// /**
+//  * @hidden
+//  */
+// export interface DropDownTreeState {
+//     calculatedId: string;
+// }
+// /**
+//  * @hidden
+//  */
+// export interface DropDownTreeComputed {
+//     [key: string]: any;
+//     wrapperClass: object;
+// }
+// /**
+//  * @hidden
+//  */
+// export interface DropDownTreeMethods {
+//     [key: string]: any;
+// }
+// /**
+//  * @hidden
+//  */
+// export interface DropDownTreeData {
+// }
+// /**
+//  * @hidden
+//  */
+// export interface DropDownTreeAll extends Vue2type, DropDownTreeMethods,
+//     DropDownTreeData, DropDownTreeComputed, DropDownTreeState { 
+// }
+// /**
+//  * @hidden
+//  */
+// let DropDownTreeVue2: ComponentOptions<DropDownTreeAll, DefaultData<DropDownTreeData>, 
+// DefaultMethods<DropDownTreeAll>, DropDownTreeComputed, RecordPropsDefinition<DropDownTreeProps>> = {
+//     name: 'KendoDropDownTree',
+//     props: {
+//     validatePackage(packageMetadata);
+//     const props: DropDownTreeProps = usePropsContext<DropDownTreeProps>(DropDownTreePropsContext, directProps);
+//     const calculatedId = React.useMemo(() => guid(), []);
+//     const id: string = props.id || calculatedId;
+//     const {
+//         data = [], dataItemKey, popupSettings = {}, style = {},
+//         opened, disabled, onOpen = noop, onClose = noop,
+//         placeholder, label, name, selectField = defaultProps.selectField,
+//         subItemsField = defaultProps.subItemsField,
+//         validationMessage, valid,
+//         required, validityStyles
+//     } = props;
+//     const tabIndex = getTabIndex(props.tabIndex, disabled);
+//     const target = React.useRef<DropDownTreeHandle>(null);
+//     const elementRef = React.useRef<HTMLSpanElement>(null);
+//     const inputRef = React.useRef<HTMLInputElement>(null);
+//     const selectRef = React.useRef<HTMLSelectElement>(null);
+//     const treeViewRef = React.useRef<TreeView>(null);
+//     const skipFocusRef = React.useRef<boolean>(false);
+//     const [ stateValue, setStateValue ] = React.useState<any>(undefined);
+//     const controlled = props.value !== undefined;
+//     const value = controlled ? props.value : (stateValue !== undefined ? stateValue : props.defaultValue);
+//     const hasValue = isPresent(value);
+//     const currentValueText = hasValue ? getItemValue(value, props.textField) : '';
+//     const validity = getValidity({ validationMessage, valid, required }, hasValue);
+//     const focus = React.useCallback(() => elementRef.current && elementRef.current.focus(), []);
+//     React.useImperativeHandle(
+//         target,
+//         () => ({
+//             props,
+//             element: elementRef.current,
+//             focus
+//         })
+//     );
+//     React.useImperativeHandle<DropDownTreeHandle | null, DropDownTreeHandle | null>(ref, () => target.current);
+//     const dir = useRtl(elementRef, props.dir);
+//     const initialStyleWidth = popupSettings.width !== undefined ?
+//         popupSettings.width : (style.width !== undefined ? style.width : defaultProps.popupSettings.width);
+//     const popupWidth = useDropdownWidth(elementRef, initialStyleWidth);
+//     const popupStyles: React.CSSProperties = {
+//         width: popupWidth,
+//         ...(dir !== undefined ? { direction: (dir as any) } : {})
+//     };
+//     const [open, setOpen] = React.useState(false);
+//     const isOpen = opened !== undefined ? opened : open;
+//     const [focused, setFocused] = React.useState(false);
+//     const [filter, setFilter] = React.useState('');
+//     const setValidity = React.useCallback(
+//         () => {
+//             if (selectRef.current && selectRef.current.setCustomValidity) {
+//                 selectRef.current.setCustomValidity(
+//                     validity.valid
+//                         ? ''
+//                         : validationMessage === undefined ? VALIDATION_MESSAGE : validationMessage
+//                 );
+//             }
+//         },
+//         [validationMessage, validity]
+//     );
+//     React.useEffect(setValidity);
+//     const openPopup = React.useCallback(
+//         (event: DropdownEvent<DropDownTreeHandle>) => {
+//             if (!isOpen) {
+//                 if (onOpen) {
+//                     const openEvent: DropDownTreeOpenEvent = { ...event };
+//                     onOpen.call(undefined, openEvent);
+//                 }
+//                 if (opened === undefined) {
+//                     setOpen(true);
+//                 }
+//             }
+//         },
+//         [isOpen, opened, onOpen]
+//     );
+//     const closePopup = React.useCallback(
+//         (event: DropdownEvent<DropDownTreeHandle>) => {
+//             if (isOpen) {
+//                 if (onClose) {
+//                     const closeEvent: DropDownTreeCloseEvent = { ...event };
+//                     onClose.call(undefined, closeEvent);
+//                 }
+//                 if (opened === undefined) {
+//                     setOpen(false);
+//                 }
+//             }
+//         },
+//         [isOpen, opened, onClose]
+//     );
+//     const onWrapperClick = React.useCallback(
+//         (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {
+//             if (!event.isDefaultPrevented() && target.current) {
+//                 setFocused(true);
+//                 const ev: DropdownEvent<DropDownTreeHandle> = {
+//                     syntheticEvent: event,
+//                     nativeEvent: event.nativeEvent,
+//                     target: target.current
+//                 };
+//                 (isOpen ? closePopup : openPopup)(ev);
+//             }
+//         },
+//         [isOpen, opened, onOpen, onClose]
+//     );
+//     const switchFocus = React.useCallback(
+//         (focusFn: () => void) => {
+//             skipFocusRef.current = true;
+//             focusFn();
+//             window.setTimeout(() => skipFocusRef.current = false, 0);
+//         },
+//         []
+//     );
+//     const onWrapperKeyDown = React.useCallback(
+//         (event: React.KeyboardEvent<HTMLSpanElement>) => {
+//             const { keyCode, altKey } = event;
+//             const treeview = treeViewRef.current && treeViewRef.current.element;
+//             if (!target.current || (event.isDefaultPrevented() && inputRef.current === event.target)) {
+//                 return;
+//             }
+//             const ev: DropdownEvent<DropDownTreeHandle> = {
+//                 syntheticEvent: event,
+//                 nativeEvent: event.nativeEvent,
+//                 target: target.current
+//             };
+//             if (isOpen) {
+//                 if (keyCode === Keys.esc || (altKey && keyCode === Keys.up)) {
+//                     event.preventDefault();
+//                     closePopup(ev);
+//                 } else if (treeview && treeview.querySelector('.k-focus') &&
+//                     (keyCode === Keys.up || keyCode === Keys.down ||
+//                     keyCode === Keys.left || keyCode === Keys.right ||
+//                     keyCode === Keys.home || keyCode === Keys.end)) {
+//                     if (keyCode === Keys.up && inputRef.current) {
+//                         const items = 
+// Array.from(treeview.querySelectorAll('.k-treeview-item'));
+//                         const focusedItem = 
+// [...items].reverse().find(i => Boolean(i && i.querySelector('.k-focus')));
+//                         if (focusedItem && items.indexOf(focusedItem) === 0) {
+//                             return switchFocus(() => { focusElement(inputRef.current); });
+//                         }
+//                     }
+//                     switchFocus(noop);
+//                 } else if (keyCode === Keys.down) {
+//                     switchFocus(() => { focusElement(inputRef.current || treeview); });
+//                 }
+//             } else {
+//                 if (altKey && keyCode === Keys.down) {
+//                     event.preventDefault();
+//                     openPopup(ev);
+//                 }
+//             }
+//         },
+//         [isOpen, opened, onOpen, onClose]
+//     );
+//     const onInputKeyDown = React.useCallback(
+//         (event: React.KeyboardEvent<HTMLSpanElement>) => {
+//             const { keyCode, altKey } = event;
+//             if (altKey || (keyCode !== Keys.up && keyCode !== Keys.down)) {
+//                 return;
+//             }
+//             event.preventDefault();
+//             switchFocus(
+//                 keyCode === Keys.up ?
+//                     () => { focusElement(elementRef.current); } :
+//                     () => { focusElement(treeViewRef.current && treeViewRef.current.element); }
+//             );
+//         },
+//         []
+//     );
+//     const focusElement = React.useCallback(
+//         (element: HTMLElement | null) => {
+//             if (element) {
+//                 switchFocus(() => element.focus());
+//             }
+//         },
+//         []
+//     );
+//     const onPopupOpened = React.useCallback(
+//         () => {
+//             if (!focused && isOpen && !opened) {
+//                 closePopup({ target: target.current } as any);
+//             } else {
+//                 if (props.filterable) {
+//                     focusElement(inputRef.current);
+//                 } else {
+//                     focusElement(treeViewRef.current && treeViewRef.current.element);
+//                 }
+//             }
+//         },
+//         [onClose, props.filterable, focused, opened, isOpen]
+//     );
+//     const onPopupClosed = React.useCallback(
+//         () => {
+//             if (focused) {
+//                 // Move the focus from treeview to dropdown without triggering Focus or Blur events.
+//                 focusElement(elementRef.current);
+//             }
+//         },
+//         [focused]
+//     );
+//     const onFocus = React.useCallback(
+//         (event: React.FocusEvent<HTMLSpanElement>) => {
+//             if (!focused && !skipFocusRef.current) {
+//                 setFocused(true);
+//                 if (props.onFocus && target.current) {
+//                     const focusEvent: DropDownTreeFocusEvent = {
+//                         syntheticEvent: event,
+//                         nativeEvent: event.nativeEvent,
+//                         target: target.current
+//                     };
+//                     props.onFocus.call(undefined, focusEvent);
+//                 }
+//             }
+//         },
+//         [focused, props.onFocus]
+//     );
+//     const onBlur = React.useCallback(
+//         (event: React.FocusEvent<HTMLSpanElement>) => {
+//             if (focused && !skipFocusRef.current && target.current) {
+//                 setFocused(false);
+//                 const ev: DropdownEvent<DropDownTreeHandle> = {
+//                     syntheticEvent: event,
+//                     nativeEvent: event.nativeEvent,
+//                     target: target.current
+//                 };
+//                 if (props.onBlur) {
+//                     const focusEvent: DropDownTreeBlurEvent = { ...ev };
+//                     props.onBlur.call(undefined, focusEvent);
+//                 }
+//                 closePopup(ev);
+//             }
+//         },
+//         [focused, props.onBlur, isOpen, opened, onClose]
+//     );
+//     const onWrapperMouseDown = React.useCallback(
+//         () => {
+//             if (focused) {
+//                 // moving focus from treeview to dropdown triggers Focus and Blur events.
+//                 switchFocus(noop);
+//             }
+//         },
+//         [focused]
+//     );
+//     const changeValue = React.useCallback(
+//         (event: DropdownEvent<DropDownTreeHandle>, newValue: any, hierarchicalIndex?: string) => {
+//             if (props.onChange) {
+//                 const changeEvent: DropDownTreeChangeEvent = {
+//                     value: newValue,
+//                     level: hierarchicalIndex ? toLevel(hierarchicalIndex) : [],
+//                     ...event
+//                 };
+//                 props.onChange.call(undefined, changeEvent);
+//             }
+//             if (!controlled) {
+//                 setStateValue(newValue);
+//             }
+//         },
+//         [props.onChange, controlled]
+//     );
+//     const onChange = React.useCallback(
+//         (event: TreeViewItemClickEvent) => {
+//             if (areSame(event.item, value, dataItemKey) || !target.current) {
+//                 return;
+//             }
+//             const { item, itemHierarchicalIndex, nativeEvent, syntheticEvent } = event;
+//             const ev: DropdownEvent<DropDownTreeHandle> = {
+//                 syntheticEvent,
+//                 nativeEvent: nativeEvent,
+//                 target: target.current
+//             };
+//             changeValue(ev, item, itemHierarchicalIndex);
+//             closePopup(ev);
+//         },
+//         [controlled, value, props.onChange, dataItemKey, isOpen, opened, onClose]
+//     );
+//     const onClear = React.useCallback(
+//         (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {
+//             if (!target.current) {
+//                 return;
+//             }
+//             const ev: DropdownEvent<DropDownTreeHandle> = {
+//                 syntheticEvent: event,
+//                 nativeEvent: event.nativeEvent,
+//                 target: target.current
+//             };
+//             changeValue(ev, null);
+//             closePopup(ev);
+//             event.preventDefault();
+//         },
+//         [controlled, props.onChange, isOpen, opened, onClose]
+//     );
+//     const onExpand = React.useCallback(
+//         (event: TreeViewExpandChangeEvent) => {
+//             event.syntheticEvent.stopPropagation();
+//             if (props.onExpandChange && target.current) {
+//                 const { item, itemHierarchicalIndex, nativeEvent, syntheticEvent } = event;
+//                 const expandEvent: DropDownTreeExpandEvent = {
+//                     level: toLevel(itemHierarchicalIndex),
+//                     item, nativeEvent, syntheticEvent, target: target.current
+//                 };
+//                 props.onExpandChange.call(undefined, expandEvent);
+//             }
+//         },
+//         [props.onExpandChange]
+//     );
+//     const onFilterChange = React.useCallback(
+//         (event: React.ChangeEvent<HTMLInputElement>) => {
+//             if (props.onFilterChange && target.current) {
+//                 const filterDesc: FilterDescriptor
+// = { field: props.textField, operator: 'contains', value: event.target.value };
+//                 const ev: DropDownTreeFilterChangeEvent = {
+//                     filter: filterDesc,
+//                     syntheticEvent: event,
+//                     nativeEvent: event.nativeEvent,
+//                     target: target.current
+//                 };
+//                 props.onFilterChange.call(undefined, ev);
+//                 if (props.filter === undefined) {
+//                     setFilter(event.target.value);
+//                 }
+//             }
+//         },
+//         [props.onFilterChange, props.filter, props.textField]
+//     );
+//     const treeViewData = React.useMemo(
+//         () => {
+//             return (controlled || !hasValue) ? data :
+//                 mapTree(
+//                     data,
+//                     subItemsField,
+//                     item => extendDataItem(
+//                         item,
+//                         subItemsField,
+//                         { [selectField]: areSame(item, value, dataItemKey) }
+//                     )
+//                 );
+//         },
+//         [data, value, controlled, hasValue, selectField, subItemsField]
+//     );
+//     const NoData = props.listNoData || ListNoData;
+//     const ValueComponent = props.valueHolder || ValueHolder;
+//     const localization = useLocalization();
+//     const isValid = !validityStyles || validity.valid;
+//     const { size, rounded, fillMode } = props;
+//     const dropdowntree = (
+//       <span
+//         className={
+//             classNames('k-dropdowntree k-picker', props.className, {
+//                 [`k-picker-${sizeMap[size!] || size}`]: size,
+//                 [`k-rounded-${roundedMap[rounded!] || rounded}`]: rounded,
+//                 [`k-picker-${fillMode}`]: fillMode,
+//                 'k-focus': focused,
+//                 'k-invalid': !isValid,
+//                 'k-loading': props.loading,
+//                 'k-required': required,
+//                 'k-disabled': props.disabled
+//             })}
+//         tabIndex={tabIndex}
+//         accessKey={props.accessKey}
+//         id={id}
+//         style={label ? { ...style, width: undefined } : style}
+//         dir={dir}
+//         ref={elementRef}
+//         onKeyDown={disabled ? undefined : onWrapperKeyDown}
+//         onMouseDown={onWrapperMouseDown}
+//         onClick={disabled ? undefined : onWrapperClick}
+//         onFocus={onFocus}
+//         onBlur={onBlur}
+//         role="combobox"
+//         aria-haspopup="tree"
+//         aria-expanded={isOpen}
+//         aria-disabled={disabled}
+//         aria-label={label}
+//         aria-labelledby={props.ariaLabelledBy}
+//         aria-describedby={props.ariaDescribedBy}
+//         aria-required={required}
+//       >
+//         <span className="k-input-inner">
+//           <ValueComponent item={value}>{currentValueText || placeholder}</ValueComponent>
+//         </span>
+//         {props.loading && <IconWrap className="k-input-loading-icon" name='loading' />}
+//         {hasValue && !disabled && (
+//         <span
+//           onClick={onClear}
+//           className="k-clear-value"
+//           title={localization.toLanguageString(clear, messages[clear])}
+//           role="button"
+//           tabIndex={-1}
+//           onMouseDown={(e: any) => e.preventDefault()}
+//         >
+//           <IconWrap name='x' icon={xIcon} />
+//         </span>
+//         )}
+//         <Button
+//           tabIndex={-1}
+//           type="button"
+//           aria-label="select"
+//           className="k-input-button"
+//           size={size}
+//           fillMode={fillMode}
+//           themeColor="base"
+//           rounded={null}
+//           icon="caret-alt-down"
+//           svgIcon={caretAltDownIcon}
+//         />
+//         {/* Dummy component to support forms */}
+//         <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%' }}
+//         >
+//           <option value={props.valueMap ? props.valueMap.call(undefined, value) : value} />
+//         </select>
+//         <Popup
+//           className={classNames(popupSettings.className, { 'k-rtl': dir === 'rtl' })}
+//           popupClass={classNames(
+//             popupSettings.popupClass,
+//             'k-list-container',
+//             'k-dropdowntree-popup'
+//           )}
+//           style={popupStyles}
+//           animate={popupSettings.animate}
+//           anchor={elementRef.current}
+//           show={isOpen}
+//           onOpen={onPopupOpened}
+//           onClose={onPopupClosed}
+//           appendTo={popupSettings.appendTo}
+//             >
+//           {props.filterable && (
+//             <ListFilter
+//               value={props.filter === undefined ? filter : props.filter}
+//               inputRef={inputRef}
+//               onChange={onFilterChange}
+//               onKeyDown={onInputKeyDown}
+//               size={size}
+//               rounded={rounded}
+//               fillMode={fillMode}
+//             />
+//                 )}
+//           {data.length > 0 ? (
+//             <TreeView
+//               ref={treeViewRef}
+//               tabIndex={tabIndex}
+//               data={treeViewData}
+//               focusIdField={dataItemKey}
+//               textField={props.textField}
+//               selectField={selectField}
+//               expandField={props.expandField}
+//               childrenField={subItemsField}
+//               expandIcons={true}
+//               onItemClick={onChange}
+//               onExpandChange={onExpand}
+//               size={size}
+//               item={props.item}
+//                     />
+//                 ) : (
+//                   <NoData>
+//                     {localization.toLanguageString(nodata, messages[nodata])}
+//                   </NoData>
+//                 )}
+//         </Popup>
+//       </span>
+//     );
+//     return label ? (
+//       <FloatingLabel
+//         label={label}
+//         editorValue={currentValueText}
+//         editorPlaceholder={placeholder}
+//         editorValid={isValid}
+//         editorDisabled={disabled}
+//         editorId={id}
+//         style={{ width: style ? style.width : undefined }}
+//         children={dropdowntree}
+//         dir={dir}
+//         />
+//     ) : dropdowntree;
+// });
+// const propTypes = {
+//     opened: PropTypes.bool,
+//     disabled: PropTypes.bool,
+//     dir: PropTypes.string,
+//     tabIndex: PropTypes.number,
+//     accessKey: PropTypes.string,
+//     data: PropTypes.array,
+//     value: PropTypes.any,
+//     valueMap: PropTypes.func,
+//     placeholder: PropTypes.string,
+//     dataItemKey: PropTypes.string.isRequired,
+//     textField: PropTypes.string.isRequired,
+//     selectField: PropTypes.string,
+//     expandField: PropTypes.string,
+//     subItemsField: PropTypes.string,
+//     className: PropTypes.string,
+//     style: PropTypes.object,
+//     label: PropTypes.string,
+//     validationMessage: PropTypes.string,
+//     validityStyles: PropTypes.bool,
+//     valid: PropTypes.bool,
+//     required: PropTypes.bool,
+//     name: PropTypes.string,
+//     id: PropTypes.string,
+//     ariaLabelledBy: PropTypes.string,
+//     ariaDescribedBy: PropTypes.string,
+//     filterable: PropTypes.bool,
+//     filter: PropTypes.string,
+//     loading: PropTypes.bool,
+//     popupSettings: PropTypes.shape({
+//         animate: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
+//             openDuration: PropTypes.number,
+//             closeDuration: PropTypes.number
+//         }) ]),
+//         popupClass: PropTypes.string,
+//         className: PropTypes.string,
+//         appendTo: PropTypes.any,
+//         width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+//         height: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+//     }),
+//     onOpen: PropTypes.func,
+//     onClose: PropTypes.func,
+//     onFocus: PropTypes.func,
+//     onBlur: PropTypes.func,
+//     onChange: PropTypes.func,
+//     onFilterChange: PropTypes.func,
+//     onExpandChange: PropTypes.func,
+//     item: PropTypes.func,
+//     valueHolder: PropTypes.func,
+//     listNoData: PropTypes.func
+// };
+// DropDownTree.displayName = 'KendoReactDropDownTree';
+// DropDownTree.defaultProps = defaultProps;
+// (DropDownTree as any).propTypes = propTypes;