@progress/kendo-vue-layout
Version:
66 lines (65 loc) • 2.82 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 { SVGIcon } from '@progress/kendo-svg-icons';
/**
* An interface which holds the shared properties of the MenuItemModel and the MenuItem components.
*/
export interface BaseMenuItem {
/**
* Specifies the item text ([see example]({% slug itemproperties_menu %}#toc-text)).
*/
text?: string;
/**
* Specifies a URL which is rendered as a `href` attribute on the item link ([see example]({% slug itemproperties_menu %}#toc-url)).
*/
url?: string;
/**
* Specifies the name of the [FontIcon]({% slug overview_icon %}) that will be rendered for the item).
*/
icon?: string;
/**
* Specifies the name of the [SVGIcon]({% slug overview_svgicon %}) that will be rendered for the item).
*/
svgIcon?: SVGIcon;
/**
* Specifies if the item is disabled ([see example]({% slug itemproperties_menu %}#toc-disabled-items)).
*/
disabled?: boolean;
/**
* The additional CSS classes that will be rendered on the item ([see example]({% slug itemproperties_menu %}#toc-styles-and-classes)).
*/
cssClass?: string;
/**
* The additional CSS classes that will be rendered on the item's popup.
*/
popupClass?: string;
/**
* The CSS styles that will be rendered on the item ([see example]({% slug itemproperties_menu %}#toc-styles-and-classes)).
*/
cssStyle?: any;
/**
* 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.
*/
render?: 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;
/**
* A Vue functional or class component which is used for rendering content instead of the item children ([see example]({% slug rendering_menu %}#toc-content)).
*/
contentRender?: any;
/**
* Represents any additional data that is associated with the Menu item.
*/
data?: any;
/**
* Specifies if this is a separator item. If set to true only the `cssClass` and `cssStyle` props should be rendered along.
*/
separator?: boolean;
}