@progress/kendo-vue-layout
Version:
59 lines (58 loc) • 2.68 kB
TypeScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { MenuItemModel } from './models/MenuItemModel';
import { MenuSelectEvent } from './events';
/**
* The properties of the [Kendo UI for Vue Menu component]({% slug overview_menu %}).
*/
export interface MenuProps {
/**
* Specifies whether the Menu will be vertical ([see example]({% slug vertical_menu %})).
*/
vertical?: boolean;
/**
* Sets the Menu items.
*/
items?: MenuItemModel[];
/**
* Sets the direction of the Menu.
*/
dir?: string;
/**
* Specifies the delay in milliseconds before the Menu items are opened on item mouse-hover ([see example]({% slug opening_closing_menu %}#toc-delay-on-hover)). Defaults to `100`. If `openOnClick` is `true`, defaults to `0`.
*/
hoverOpenDelay?: number;
/**
* Specifies the delay in milliseconds before the Menu items are closed on item mouse-leave ([see example]({% slug opening_closing_menu %}#toc-delay-on-hover)). Used to avoid accidental closure on leaving. Defaults to `100`.
*/
hoverCloseDelay?: number;
/**
* If `openOnClick` is set to `true`, the items are opened on mouse hover only after an initial click.
*/
openOnClick?: boolean;
/**
* A Vue functional or class component which is used for rendering the innermost part of the Menu item ([see example]({% slug rendering_menu %}#toc-items)). By default, the innermost item part includes only the text for the item.
*/
itemRender?: any;
/**
* A Vue functional or class component which is used for rendering the link of the item ([see example]({% slug rendering_menu %}#toc-links)). The item link is a part of the visual representation of the item which, by default, includes an arrow, icon, and text.
*/
linkRender?: any;
/**
* Sets the ids of the Menu items that will not be closed on mouse-leave. The ids are hierarchical and zero-based. The first root item has a `0` id. If the first root item has children, the first child item acquires a `0_0` id and the second acquires a `0_1` id.
*/
customCloseItemIds?: string[];
/**
* Adds a custom className to the Menu top element.
*/
className?: string;
/**
* Fires when a Menu item is selected.
*/
onSelect?: (event: MenuSelectEvent) => void;
}