/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the package root for more information *------------------------------------------------------------------------------------------- */ import { ComponentOptionsMixin } from 'vue'; import { ComponentProvideOptions } from 'vue'; import { DefineComponent } from 'vue'; import { ExtractPropTypes } from 'vue'; import { PropType } from 'vue'; import { PublicProps } from 'vue'; /** @hidden */ export declare const ADAPTIVE_MEDIUM_BREAKPOINT: number; /** @hidden */ export declare const ADAPTIVE_SMALL_BREAKPOINT: number; /** * Represents a Vue Provider Component that enables further configuration of the adaptive mode breakpoints. * Used for global configuration across components that implement adaptive rendering. * For more information and demos, refer to: * * [ComboBox Adaptive Rendering article]({% slug adaptive_rendering_combobox %}) * * [DropDownList Adaptive Rendering article]({% slug adaptive_rendering_dropdownlist %}) * * [DropDownTree Adaptive Rendering article]({% slug adaptive_rendering_dropdowntree %}) * * [MultiSelect Adaptive Rendering article]({% slug adaptive_rendering_multiselect %}) * * [MultiSelectTree Adaptive Rendering article]({% slug adaptive_rendering_multiselecttree %}) * */ export declare const AdaptiveModeProvider: DefineComponent; default: number; }; medium: { type: PropType; default: number; }; }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly; default: number; }; medium: { type: PropType; default: number; }; }>> & Readonly<{}>, { small: number; medium: number; }, {}, {}, {}, string, () => { adaptiveModeBreakpoints: { small: any; medium: any; }; }, true, {}, any>; /** * @hidden */ declare interface BaseIconProps { /** * Sets the `tabIndex` of the icon element. */ tabIndex?: number; /** * Sets the `id` of the icon element. */ id?: string; /** * Sets the `aria-label` of the icon element. */ ariaLabel?: string; /** * Sets the `title` of the icon element. */ title?: string; /** * Specifies a list of CSS classes that will be added to the root DOM element. */ class?: string; /** * Specifies the theme color of the Icon. * * The possible values are: * * `inherit` (Default)—Applies coloring based on the current color. * * `primary` —Applies coloring based on primary theme color. * * `secondary`—Applies coloring based on secondary theme color. * * `tertiary`— Applies coloring based on tertiary theme color. * * `info`—Applies coloring based on info theme color. * * `success`— Applies coloring based on success theme color. * * `warning`— Applies coloring based on warning theme color. * * `error`— Applies coloring based on error theme color. * * `dark`— Applies coloring based on dark theme color. * * `light`— Applies coloring based on light theme color. * * `inverse`— Applies coloring based on inverse theme color. * * If the property is not set, the icon inherits the color from its parent. * * You can use the `style` prop to apply custom color related properties to the icon. */ themeColor?: IconThemeColor | string; /** * Specifies the size of the icon. * * The possible values are: * `default` (Default)—Font-size: 16px; Width: 16px; Height: 16px. * `xsmall`—Font-size: 12px; Width: 12px; Height: 12px. * `small`—Font-size: 14px; Width: 14px; Height: 14px. * `medium`—Font-size: 16px; Width: 16px; Height: 16px. * `large`—Font-size: 20px; Width: 20px; Height: 20px. * `xlarge`—Font-size: 24px; Width: 24px; Height: 24px. * `xxlarge`—Font-size: 32px; Width: 32px; Height: 32px. * `xxxlarge`—Font-size: 48px; Width: 48px; Height: 48px. * * * You can use the `style` prop to apply custom font size to the icon. */ size?: IconSize | string; /** * Specifies the icon flip direction. * * The possible values are: * * `default` (Default)—No flipping applied. * * `horizontal`—Flips the icon in horizontal direction. * * `vertical`—Flips the icon in vertical direction. * * `both`—Flips the icon in both horizontal and vertical directions. * */ flip?: IconFlip | string; } /** * @hidden */ export declare class BrowserSupportService { private scrollbar; get scrollbarWidth(): number; } /** * @hidden */ export declare const canUseDOM: boolean; /** * @hidden */ export declare const classNames: (...args: any[]) => string; /** * @hidden */ export declare function clone(obj: any): any; /** * @hidden */ export declare function cloneArray(array: any[]): any; /** * @hidden */ export declare const cloneDate: (date?: Date) => Date | null; /** * @hidden */ export declare function cloneObject(obj: any, result: any): void; /** * @hidden */ export declare function cloneValue(value: any, nextValue: any): any; /** * @hidden */ export declare const Draggable: DefineComponent< {}, {}, {}, {}, { press(event: any): void; drag(event: any): void; release(event: any): void; }, ComponentOptionsMixin, ComponentOptionsMixin, { press: any; drag: any; release: any; }, string, PublicProps, Readonly<{}> & Readonly<{ onPress?: (...args: any[] | unknown[]) => any; onDrag?: (...args: any[] | unknown[]) => any; onRelease?: (...args: any[] | unknown[]) => any; }>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>; /** * @hidden */ export declare interface DraggableDragEvent { event: any; element: HTMLElement; } /** * @hidden */ export declare interface DraggablePressEvent { event: any; element: HTMLElement; } /** * @hidden */ export declare interface DraggableReleaseEvent { event: any; } /** * Similar to the `Object.assign` function. Additionally, creates a new array for the subitems. * * @param {object} item - The source data item. * @param {string} subItemsField - The field which points to the subitems collection of each data item. * @param {object} propsToExtend - The props with which the source data item will be extended. * @returns {object} - The target data item. */ export declare const extendDataItem: (item: any, subItemsField: string, propsToExtend?: any) => any; /** * @hidden */ export declare const FIELD_REGEX: RegExp; /** * @hidden */ export declare const firstFocusableChild: (element: any) => any; /** * @hidden */ export declare const FOCUSABLE_ELEMENTS: string[]; /** * @hidden */ export declare const focusContainer: (e: any, containerElement: any) => boolean; /** * @hidden */ export declare const focusFirstFocusableChild: (element: any) => void; /** * @hidden */ export declare const focusLastFocusableChild: (element: any) => void; /** * @hidden */ export declare const FontIcon: DefineComponent, {}, {}, { fontClassNames(this: FontIconAll): { [x: string]: any; [x: number]: any; 'k-icon': boolean; 'k-font-icon': boolean; 'k-flip-h': boolean; 'k-flip-v': boolean; }; }, { handleClick(e: any): void; }, ComponentOptionsMixin, ComponentOptionsMixin, { click: any; }, string, PublicProps, Readonly> & Readonly<{ onClick?: (...args: any[] | unknown[]) => any; }>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>; /** * @hidden */ export declare interface FontIconAll extends FontIconMethods, FontIconData, FontIconComputed, FontIconState { } /** * @hidden */ export declare interface FontIconComputed { [key: string]: any; } /** * @hidden */ export declare interface FontIconData { } /** * @hidden */ export declare interface FontIconMethods { [key: string]: any; } /** * Represents the props of the [Kendo UI for Vue Icon component]({% slug overview_icon %}). */ export declare interface FontIconProps extends BaseIconProps { /** * Represents the name of the icon. */ name?: string; } /** * @hidden */ export declare interface FontIconState { } /** * Represents the basic props of the KendoVue form components. * * For runnable examples on forms support, refer to the documentation of the respective form component: * * [DateInput]({% slug forms_dateinput %}) * * [DatePicker]({% slug forms_datepicker %}) * * [TimePicker]({% slug forms_timepicker %}) * * [DateTimePicker]({% slug forms_datetimepicker %}) * * [AutoComplete]({% slug forms_autocomplete %}) * * [ComboBox]({% slug forms_combobox %}) * * [DropDownList]({% slug forms_dropdownlist %}) * * [MultiSelect]({% slug forms_multiselect %}) * * [Input]({% slug forms_input %}) * * [MaskedTextBox]({% slug forms_maskedtextbox %}) * * [NumericTextBox]({% slug forms_numerictextbox %}) */ export declare interface FormComponentProps { /** * Controls the form error message of the component. If set to an empty string, no error will be thrown. * */ validationMessage?: string; /** * Specifies if `null` is a valid value for the component. * */ required?: boolean; /** * Specifies the `name` property of the `input` DOM element. * */ name?: string; /** * Overrides the validity state of the component. * If `valid` is set, the `required` property will be ignored. * */ valid?: boolean; /** * If set to `false`, no visual representation of the invalid state of the component will be applied. * */ validityStyles?: boolean; /** * @hidden */ value?: any; /** * @hidden */ defaultValue?: any; } /** * Represents the `validity` state of the KendoVue form components. * * For runnable examples on forms support, refer to the documentation of the respective form component: * * [DateInput]({% slug forms_dateinput %}) * * [DatePicker]({% slug forms_datepicker %}) * * [TimePicker]({% slug forms_timepicker %}) * * [DateTimePicker]({% slug forms_timepicker %}) * * [AutoComplete]({% slug forms_autocomplete %}) * * [ComboBox]({% slug forms_combobox %}) * * [DropDownList]({% slug forms_dropdownlist %}) * * [MultiSelect]({% slug forms_multiselect %}) * * [Input]({% slug forms_input %}) * * [MaskedTextBox]({% slug forms_maskedtextbox %}) * * [NumericTextBox]({% slug forms_numerictextbox %}) */ export declare interface FormComponentValidity { readonly badInput?: boolean; readonly customError: boolean; readonly patternMismatch?: boolean; readonly rangeOverflow?: boolean; readonly rangeUnderflow?: boolean; readonly stepMismatch?: boolean; readonly tooLong?: boolean; readonly tooShort?: boolean; readonly typeMismatch?: boolean; readonly valid: boolean; readonly valueMissing: boolean; } /** * @hidden */ export declare const getActiveElement: (document: any) => HTMLElement | undefined; /** * @hidden */ export declare function getDefaultSlots(component: any): any; /** * @hidden */ export declare function getDir(element: Element | null, initialDir: string): string; export declare const getIconName: (iconName: string) => string; /** * @hidden */ export declare const getInnerActiveElement: any; /** * Returns the data item path in the tree based on the level parameter. * * @param {any[]} tree - The data tree. * @param {number[]} level - The level of the target tree item. * @param {string} subItemsField - The field which points to the subitems collection of each data item. * @returns {any[]} - The path of the data item. */ export declare const getItemPath: (tree: any[], level: number[], subItemsField?: string) => any[]; /** * @hidden */ export declare function getListeners(this: any): {}; /** * @hidden */ export declare function getNestedValue(fieldName: string, dataItem: any): any; /** * @hidden */ export declare function getRef(comp: any, refName: string): any; /** * @hidden */ export declare const getScrollbarWidth: () => number | false; /** * @hidden */ export declare const getTabIndex: (tabIndex?: number | string, disabled?: boolean, useDefaultTabIndexWhenDisabled?: boolean) => number | undefined; /** * @hidden */ export declare function getTemplate(this: any, { h: h, template: template, defaultRendering: defaultRendering, defaultSlots: defaultSlots, additionalProps: additionalProps, additionalListeners: additionalListeners, swapDefaultSlots: swapDefaultSlots }: any): any; /** * @hidden */ export declare function getter(field: string): any; /** * @hidden */ export declare const guid: Function; /** * @hidden */ export declare function hasListener(this: any, eventName: string): boolean; /** @hidden */ export declare const hasRelativeStackingContext: (elementSource?: HTMLElement) => boolean; /** * @hidden */ export declare const Icon: DefineComponent, {}, {}, {}, { handleClick(e: any): void; }, ComponentOptionsMixin, ComponentOptionsMixin, { click: any; }, string, PublicProps, Readonly> & Readonly<{ onClick?: (...args: any[] | unknown[]) => any; }>, { viewBox: string; }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>; /** * @hidden */ export declare interface IconAll extends IconMethods, IconData, IconComputed, IconState { } /** * @hidden */ export declare interface IconComputed { [key: string]: any; } /** * @hidden */ export declare interface IconData { } /** * Specifies the icon flip direction. * * The possible values are: * * `default` (Default)—No flipping applied. * * `horizontal`—Flips the icon in horizontal direction. * * `vertical`—Flips the icon in vertical direction. * * `both`—Flips the icon in both horizontal and vertical directions. * */ export declare type IconFlip = 'default' | 'horizontal' | 'vertical' | 'both'; /** * @hidden */ export declare interface IconMethods { [key: string]: any; } /** * @hidden */ export declare interface IconProps extends SvgIconProps { iconType?: string; name?: string; } /** * Specifies the size of the icon. * * The possible values are: * * `default` (Default)—Font-size: 16px; Width: 16px; Height: 16px. * * `xsmall`—Font-size: 12px; Width: 12px; Height: 12px. * * `small`—Font-size: 14px; Width: 14px; Height: 14px. * * `medium`—Font-size: 16px; Width: 16px; Height: 16px. * * `large`—Font-size: 20px; Width: 20px; Height: 20px. * * `xlarge`—Font-size: 24px; Width: 24px; Height: 24px. * * `xxlarge`—Font-size: 32px; Width: 32px; Height: 32px. * * `xxxlarge`—Font-size: 48px; Width: 48px; Height: 48px. * */ export declare type IconSize = 'default' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'; /** * @hidden */ export declare interface IconState { } /** * Specifies the theme color of the Icon. * * The possible values are: * * `inherit` (Default)—Applies coloring based on the current color. * * `primary` —Applies coloring based on primary theme color. * * `secondary`—Applies coloring based on secondary theme color. * * `tertiary`— Applies coloring based on tertiary theme color. * * `info`—Applies coloring based on info theme color. * * `success`— Applies coloring based on success theme color. * * `warning`— Applies coloring based on warning theme color. * * `error`— Applies coloring based on error theme color. * * `dark`— Applies coloring based on dark theme color. * * `light`— Applies coloring based on light theme color. * * `inverse`— Applies coloring based on inverse theme color. * * If the property is not set, the icon inherits the color from its parent. * * You can use the `style` prop to apply custom color related properties to the icon. */ export declare type IconThemeColor = 'inherit' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse'; /** * @hidden */ export declare const isObject: (value: any) => boolean; /** * @hidden */ export declare function isRtl(element: Element | null): boolean; /** @hidden */ export declare interface KendoThemeMaps { sizeMap: Record, string>; roundedMap: Record, string>; } /** @hidden */ export declare const kendoThemeMaps: KendoThemeMaps; /** * @hidden */ export declare const Keys: { backspace: number; tab: number; enter: number; shift: number; esc: number; space: number; pageUp: number; pageDown: number; end: number; home: number; left: number; up: number; right: number; down: number; delete: number; }; /** * @hidden */ export declare const lastFocusableChild: (element: any) => any; /** * Creates a new array with the results of calling the provided callback function * on every element in the provided data tree. * * @param {any[]} tree - The data tree. * @param {string} subItemsField - The field which points to the subitems collection of each data item. * @param {(value: any) => any} callback - The callback function. * @returns {any[]} - The new data tree. */ export declare const mapTree: (tree: any[], subItemsField: string, callback: (value: any) => any) => any[]; /** * Creates a new array with the results of calling the provided callback function * on the element which match the `level` in the provided data tree. * * @param {any[]} tree - The data tree. * @param {number[]} level - An array of indexes of each parent and current item in the data tree. * @param {string} subItemsField - The field which points to the subitems collection of each data item. * @param {(value: any) => any} callback - The callback function. * @returns {any[]} - The new data tree. */ export declare const mapTreeItem: (tree: any[], level: number[], subItemsField: string, callback: (value: any) => any) => void; /** * @hidden */ export declare class Navigation { selectors: string[]; mouseEvents: { [type: string]: (target: HTMLElement, nav: Navigation, ev: any) => void; }; keyboardEvents: { [type: string]: { [key: string]: (target: HTMLElement, nav: Navigation, ev: any) => void; }; }; tabIndex: number; root: any; rovingTabIndex?: boolean; constructor(options: { tabIndex: number; root: any; selectors: string[]; rovingTabIndex?: boolean; mouseEvents?: { [type: string]: (target: HTMLElement, nav: Navigation, ev: any) => void; }; keyboardEvents?: { [type: string]: { [key: string]: (target: HTMLElement, nav: Navigation, ev: any) => void; }; }; }); get elements(): HTMLElement[]; get first(): HTMLElement | null; get last(): HTMLElement | null; get current(): HTMLElement | null; focusNext(target: HTMLElement): void; focusPrevious(target: HTMLElement): void; triggerKeyboardEvent(ev: any): void; triggerMouseEvent(ev: any): void; focusElement(element: HTMLElement | null, previous: HTMLElement | null): void; update: () => void; private focusNextIndex; } /** * @hidden */ export declare const noop: () => void; /** * @hidden */ export declare function setRef(comp: any, refName: string): any; /** * @hidden */ export declare const setScrollbarWidth: () => boolean; /** * @hidden */ export declare function setter(field: string): any; /** * @hidden */ export declare function shouldShowValidationUI(packageMetadata: any): boolean; /** * Specifies the SVG icon. */ export declare interface SVGIcon { /** * The unique name of the icon. */ name: string; /** * The entire SVG content of the icon. */ content: string; /** * The [viewBox](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/viewBox) * definition that should be used for the icon. */ viewBox: string; } /** * @hidden */ export declare const SvgIcon: DefineComponent, {}, {}, { wrapperClass(this: SvgIconAll): { [x: string]: any; [x: number]: any; 'k-icon': boolean; 'k-svg-icon': boolean; 'k-flip-h': boolean; 'k-flip-v': boolean; }; }, { handleClick(e: any): void; }, ComponentOptionsMixin, ComponentOptionsMixin, { click: any; }, string, PublicProps, Readonly> & Readonly<{ onClick?: (...args: any[] | unknown[]) => any; }>, { viewBox: string; }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>; /** * @hidden */ export declare interface SvgIconAll extends SvgIconMethods, SvgIconData, SvgIconComputed, SvgIconState { } /** * @hidden */ export declare interface SvgIconComputed { [key: string]: any; } /** * @hidden */ export declare interface SvgIconData { } /** * @hidden */ export declare interface SvgIconHandle { /** * The SvgIconHandle element. */ element: HTMLSpanElement | null; } /** * @hidden */ export declare interface SvgIconMethods { [key: string]: any; } /** * Represents the props of the [Kendo UI for Vue SvgIcon component]({% slug overview_svgicon %}). */ export declare interface SvgIconProps extends BaseIconProps { /** * Represents the name of the icon. */ name?: string; /** * Specifies the SVG icon. * * * The possible keys are: * * `name`—The unique name of the icon. * * `content`—The entire SVG content of the icon. * * `viewBox`—The viewBox definition that should be used for the icon. */ icon?: SVGIcon; /** * Specifies the viewBox of the custom SVG icon. */ viewBox?: string; /** * Specifies a list of CSS classes that will be added to the svg element. */ svgClassName?: string; /** * Sets additional CSS styles to the svg element. */ svgStyle?: object; } /** * @hidden */ export declare interface SvgIconState { } /** * @hidden */ export declare const templateDefinition: { type: (ObjectConstructor | BooleanConstructor | StringConstructor | FunctionConstructor)[]; default: () => any; }; /** * @hidden */ export declare function templateRendering(this: any, template: any, listeners: any): any; /** * @hidden */ export declare function validatePackage(packageMetadata: any): void; /** * @hidden */ export declare const WatermarkOverlay: DefineComponent< {}, {}, { watermarkStyles: { position: string; width: string; height: string; top: number; left: number; right: number; bottom: number; opacity: number; 'z-index': number; 'pointer-events': string; 'background-image': string; }; bannerStyles: { display: string; justifyContent: string; alignItems: string; position: string; top: string; right: string; padding: string; 'border-radius': string; 'box-shadow': string; 'font-size': string; 'font-weight': number; 'line-height': string; 'background-color': string; color: string; 'z-index': number; }; bannerButtonStyles: { display: string; position: string; border: string; 'border-radius': string; padding: string; 'background-color': string; transition: string; outline: string; cursor: string; }; showBanner: boolean; }, {}, { onCloseBannerClick(): void; }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>; export { }