@progress/kendo-vue-layout
Version:
82 lines (81 loc) • 2.62 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 { PropType } from 'vue';
/**
* @hidden
*/
export interface DrawerItemComputed {
itemClassNames: object;
}
/**
* @hidden
*/
declare const DrawerItem: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
index: PropType<number>;
text: PropType<string>;
icon: PropType<string>;
svgIcon: PropType<import('@progress/kendo-vue-common').SVGIcon>;
separator: PropType<boolean>;
selected: PropType<boolean>;
disabled: PropType<boolean>;
targetItem: PropType<any>;
}>, {}, {}, {
itemClassNames(): DrawerItemComputed['itemClassNames'];
}, {
focus(e: any): void;
handleClick(): void;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
click: any;
}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
index: PropType<number>;
text: PropType<string>;
icon: PropType<string>;
svgIcon: PropType<import('@progress/kendo-vue-common').SVGIcon>;
separator: PropType<boolean>;
selected: PropType<boolean>;
disabled: PropType<boolean>;
targetItem: PropType<any>;
}>> & Readonly<{
onClick?: (...args: any[] | unknown[]) => any;
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
/**
* Represents the [Kendo UI for Vue Drawer component]({% slug overview_drawer %}).
*
* ```jsx
* <Drawer
* :expanded="expanded"
* :position="position"
* :mode="mode"
* :mini="true"
* :width="175"
* :items="
* items.map((item, index) => ({
* ...item,
* selected: index === selectedId,
* }))
* "
* :item="'CustomItem'"
* @select="onSelect"
* >
* <template v-slot:CustomItem="{ props }">
* <DrawerItem v-bind="props" @click="props.onClick">
* <span :class="'k-icon flag ' + props.flag" />
* <div class="item-descr-wrap">
* <div>{{ props.text }}</div>
* <span class="item-descr">Capital of {{ props.country }}</span>
* </div>
* </DrawerItem>
* </template>
* <DrawerContent>
* <router-view />
* </DrawerContent>
* </Drawer>
* ```
*
*/
export { DrawerItem };