UNPKG

devextreme-vue

Version:

DevExtreme Vue UI and Visualization Components

439 lines (437 loc) • 23.7 kB
/*! * devextreme-vue * Version: 25.1.6 * Build date: Mon Oct 13 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * * This software may be modified and distributed under the terms * of the MIT license. See the LICENSE file in the root of the project for details. * * https://github.com/DevExpress/devextreme-vue */ import { PropType } from "vue"; import Chat, { Properties } from "devextreme/ui/chat"; import DataSource from "devextreme/data/data_source"; import dxChat from "devextreme/ui/chat"; import { Alert, Message, DisposingEvent, InitializedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, OptionChangedEvent, TypingEndEvent, TypingStartEvent, User } from "devextreme/ui/chat"; import { DataSourceOptions } from "devextreme/common/data"; import { Store } from "devextreme/data/store"; type AccessibleOptions = Pick<Properties, "accessKey" | "activeStateEnabled" | "alerts" | "dataSource" | "dayHeaderFormat" | "disabled" | "editing" | "elementAttr" | "focusStateEnabled" | "height" | "hint" | "hoverStateEnabled" | "items" | "messageTemplate" | "messageTimestampFormat" | "onDisposing" | "onInitialized" | "onMessageDeleted" | "onMessageDeleting" | "onMessageEditCanceled" | "onMessageEditingStart" | "onMessageEntered" | "onMessageUpdated" | "onMessageUpdating" | "onOptionChanged" | "onTypingEnd" | "onTypingStart" | "reloadOnChange" | "rtlEnabled" | "showAvatar" | "showDayHeaders" | "showMessageTimestamp" | "showUserName" | "typingUsers" | "user" | "visible" | "width">; interface DxChat extends AccessibleOptions { readonly instance?: Chat; } declare const DxChat: import("@vue/runtime-core").DefineComponent<{ accessKey: StringConstructor; activeStateEnabled: BooleanConstructor; alerts: PropType<Alert[]>; dataSource: PropType<string | Record<string, any> | DataSource<any, any> | DataSourceOptions<any, any, any, any> | Store<any, any> | Message[] | null>; dayHeaderFormat: PropType<string | Record<string, any> | import("devextreme/artifacts/npm/devextreme/common/core/localization").FormatObject | ((value: number | Date) => string) | ((value: Date) => string) | ((value: number) => string) | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((value: number | Date) => string) | undefined>; disabled: BooleanConstructor; editing: PropType<Record<string, any>>; elementAttr: PropType<Record<string, any>>; focusStateEnabled: BooleanConstructor; height: (NumberConstructor | StringConstructor)[]; hint: StringConstructor; hoverStateEnabled: BooleanConstructor; items: PropType<Message[]>; messageTemplate: {}; messageTimestampFormat: PropType<string | Record<string, any> | import("devextreme/artifacts/npm/devextreme/common/core/localization").FormatObject | ((value: number | Date) => string) | ((value: Date) => string) | ((value: number) => string) | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((value: number | Date) => string) | undefined>; onDisposing: PropType<(e: DisposingEvent) => void>; onInitialized: PropType<(e: InitializedEvent) => void>; onMessageDeleted: PropType<(e: MessageDeletedEvent) => void>; onMessageDeleting: PropType<(e: MessageDeletingEvent) => void>; onMessageEditCanceled: PropType<(e: MessageEditCanceledEvent) => void>; onMessageEditingStart: PropType<(e: MessageEditingStartEvent) => void>; onMessageEntered: PropType<(e: MessageEnteredEvent) => void>; onMessageUpdated: PropType<(e: MessageUpdatedEvent) => void>; onMessageUpdating: PropType<(e: MessageUpdatingEvent) => void>; onOptionChanged: PropType<(e: OptionChangedEvent) => void>; onTypingEnd: PropType<(e: TypingEndEvent) => void>; onTypingStart: PropType<(e: TypingStartEvent) => void>; reloadOnChange: BooleanConstructor; rtlEnabled: BooleanConstructor; showAvatar: BooleanConstructor; showDayHeaders: BooleanConstructor; showMessageTimestamp: BooleanConstructor; showUserName: BooleanConstructor; typingUsers: PropType<User[]>; user: PropType<Record<string, any> | User>; visible: BooleanConstructor; width: (NumberConstructor | StringConstructor)[]; }, unknown, unknown, { instance(): Chat; }, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:accessKey": null; "update:activeStateEnabled": null; "update:alerts": null; "update:dataSource": null; "update:dayHeaderFormat": null; "update:disabled": null; "update:editing": null; "update:elementAttr": null; "update:focusStateEnabled": null; "update:height": null; "update:hint": null; "update:hoverStateEnabled": null; "update:items": null; "update:messageTemplate": null; "update:messageTimestampFormat": null; "update:onDisposing": null; "update:onInitialized": null; "update:onMessageDeleted": null; "update:onMessageDeleting": null; "update:onMessageEditCanceled": null; "update:onMessageEditingStart": null; "update:onMessageEntered": null; "update:onMessageUpdated": null; "update:onMessageUpdating": null; "update:onOptionChanged": null; "update:onTypingEnd": null; "update:onTypingStart": null; "update:reloadOnChange": null; "update:rtlEnabled": null; "update:showAvatar": null; "update:showDayHeaders": null; "update:showMessageTimestamp": null; "update:showUserName": null; "update:typingUsers": null; "update:user": null; "update:visible": null; "update:width": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ accessKey: StringConstructor; activeStateEnabled: BooleanConstructor; alerts: PropType<Alert[]>; dataSource: PropType<string | Record<string, any> | DataSource<any, any> | DataSourceOptions<any, any, any, any> | Store<any, any> | Message[] | null>; dayHeaderFormat: PropType<string | Record<string, any> | import("devextreme/artifacts/npm/devextreme/common/core/localization").FormatObject | ((value: number | Date) => string) | ((value: Date) => string) | ((value: number) => string) | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((value: number | Date) => string) | undefined>; disabled: BooleanConstructor; editing: PropType<Record<string, any>>; elementAttr: PropType<Record<string, any>>; focusStateEnabled: BooleanConstructor; height: (NumberConstructor | StringConstructor)[]; hint: StringConstructor; hoverStateEnabled: BooleanConstructor; items: PropType<Message[]>; messageTemplate: {}; messageTimestampFormat: PropType<string | Record<string, any> | import("devextreme/artifacts/npm/devextreme/common/core/localization").FormatObject | ((value: number | Date) => string) | ((value: Date) => string) | ((value: number) => string) | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((value: number | Date) => string) | undefined>; onDisposing: PropType<(e: DisposingEvent) => void>; onInitialized: PropType<(e: InitializedEvent) => void>; onMessageDeleted: PropType<(e: MessageDeletedEvent) => void>; onMessageDeleting: PropType<(e: MessageDeletingEvent) => void>; onMessageEditCanceled: PropType<(e: MessageEditCanceledEvent) => void>; onMessageEditingStart: PropType<(e: MessageEditingStartEvent) => void>; onMessageEntered: PropType<(e: MessageEnteredEvent) => void>; onMessageUpdated: PropType<(e: MessageUpdatedEvent) => void>; onMessageUpdating: PropType<(e: MessageUpdatingEvent) => void>; onOptionChanged: PropType<(e: OptionChangedEvent) => void>; onTypingEnd: PropType<(e: TypingEndEvent) => void>; onTypingStart: PropType<(e: TypingStartEvent) => void>; reloadOnChange: BooleanConstructor; rtlEnabled: BooleanConstructor; showAvatar: BooleanConstructor; showDayHeaders: BooleanConstructor; showMessageTimestamp: BooleanConstructor; showUserName: BooleanConstructor; typingUsers: PropType<User[]>; user: PropType<Record<string, any> | User>; visible: BooleanConstructor; width: (NumberConstructor | StringConstructor)[]; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:accessKey"?: ((...args: any[]) => any) | undefined; "onUpdate:activeStateEnabled"?: ((...args: any[]) => any) | undefined; "onUpdate:dataSource"?: ((...args: any[]) => any) | undefined; "onUpdate:disabled"?: ((...args: any[]) => any) | undefined; "onUpdate:elementAttr"?: ((...args: any[]) => any) | undefined; "onUpdate:focusStateEnabled"?: ((...args: any[]) => any) | undefined; "onUpdate:height"?: ((...args: any[]) => any) | undefined; "onUpdate:hint"?: ((...args: any[]) => any) | undefined; "onUpdate:hoverStateEnabled"?: ((...args: any[]) => any) | undefined; "onUpdate:items"?: ((...args: any[]) => any) | undefined; "onUpdate:onDisposing"?: ((...args: any[]) => any) | undefined; "onUpdate:onInitialized"?: ((...args: any[]) => any) | undefined; "onUpdate:onOptionChanged"?: ((...args: any[]) => any) | undefined; "onUpdate:rtlEnabled"?: ((...args: any[]) => any) | undefined; "onUpdate:visible"?: ((...args: any[]) => any) | undefined; "onUpdate:width"?: ((...args: any[]) => any) | undefined; "onUpdate:editing"?: ((...args: any[]) => any) | undefined; "onUpdate:alerts"?: ((...args: any[]) => any) | undefined; "onUpdate:dayHeaderFormat"?: ((...args: any[]) => any) | undefined; "onUpdate:messageTemplate"?: ((...args: any[]) => any) | undefined; "onUpdate:messageTimestampFormat"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageDeleted"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageDeleting"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageEditCanceled"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageEditingStart"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageEntered"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageUpdated"?: ((...args: any[]) => any) | undefined; "onUpdate:onMessageUpdating"?: ((...args: any[]) => any) | undefined; "onUpdate:onTypingEnd"?: ((...args: any[]) => any) | undefined; "onUpdate:onTypingStart"?: ((...args: any[]) => any) | undefined; "onUpdate:reloadOnChange"?: ((...args: any[]) => any) | undefined; "onUpdate:showAvatar"?: ((...args: any[]) => any) | undefined; "onUpdate:showDayHeaders"?: ((...args: any[]) => any) | undefined; "onUpdate:showMessageTimestamp"?: ((...args: any[]) => any) | undefined; "onUpdate:showUserName"?: ((...args: any[]) => any) | undefined; "onUpdate:typingUsers"?: ((...args: any[]) => any) | undefined; "onUpdate:user"?: ((...args: any[]) => any) | undefined; }, { activeStateEnabled: boolean; disabled: boolean; focusStateEnabled: boolean; hoverStateEnabled: boolean; rtlEnabled: boolean; visible: boolean; reloadOnChange: boolean; showAvatar: boolean; showDayHeaders: boolean; showMessageTimestamp: boolean; showUserName: boolean; }>; declare const DxAlert: import("@vue/runtime-core").DefineComponent<{ id: (NumberConstructor | StringConstructor)[]; message: StringConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:id": null; "update:message": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ id: (NumberConstructor | StringConstructor)[]; message: StringConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:message"?: ((...args: any[]) => any) | undefined; "onUpdate:id"?: ((...args: any[]) => any) | undefined; }, {}>; declare const DxAuthor: import("@vue/runtime-core").DefineComponent<{ avatarAlt: StringConstructor; avatarUrl: StringConstructor; id: (NumberConstructor | StringConstructor)[]; name: StringConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:avatarAlt": null; "update:avatarUrl": null; "update:id": null; "update:name": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ avatarAlt: StringConstructor; avatarUrl: StringConstructor; id: (NumberConstructor | StringConstructor)[]; name: StringConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:name"?: ((...args: any[]) => any) | undefined; "onUpdate:id"?: ((...args: any[]) => any) | undefined; "onUpdate:avatarAlt"?: ((...args: any[]) => any) | undefined; "onUpdate:avatarUrl"?: ((...args: any[]) => any) | undefined; }, {}>; declare const DxDayHeaderFormat: import("@vue/runtime-core").DefineComponent<{ currency: StringConstructor; formatter: PropType<(value: number | Date) => string>; parser: PropType<(value: string) => number | Date>; precision: NumberConstructor; type: PropType<string>; useCurrencyAccountingStyle: BooleanConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:currency": null; "update:formatter": null; "update:parser": null; "update:precision": null; "update:type": null; "update:useCurrencyAccountingStyle": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ currency: StringConstructor; formatter: PropType<(value: number | Date) => string>; parser: PropType<(value: string) => number | Date>; precision: NumberConstructor; type: PropType<string>; useCurrencyAccountingStyle: BooleanConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:type"?: ((...args: any[]) => any) | undefined; "onUpdate:currency"?: ((...args: any[]) => any) | undefined; "onUpdate:formatter"?: ((...args: any[]) => any) | undefined; "onUpdate:parser"?: ((...args: any[]) => any) | undefined; "onUpdate:precision"?: ((...args: any[]) => any) | undefined; "onUpdate:useCurrencyAccountingStyle"?: ((...args: any[]) => any) | undefined; }, { useCurrencyAccountingStyle: boolean; }>; declare const DxEditing: import("@vue/runtime-core").DefineComponent<{ allowDeleting: PropType<boolean | ((options: { component: dxChat; message: Message; }) => boolean)>; allowUpdating: PropType<boolean | ((options: { component: dxChat; message: Message; }) => boolean)>; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:allowDeleting": null; "update:allowUpdating": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ allowDeleting: PropType<boolean | ((options: { component: dxChat; message: Message; }) => boolean)>; allowUpdating: PropType<boolean | ((options: { component: dxChat; message: Message; }) => boolean)>; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:allowDeleting"?: ((...args: any[]) => any) | undefined; "onUpdate:allowUpdating"?: ((...args: any[]) => any) | undefined; }, {}>; declare const DxItem: import("@vue/runtime-core").DefineComponent<{ alt: StringConstructor; author: PropType<Record<string, any> | User>; id: (NumberConstructor | StringConstructor)[]; isDeleted: BooleanConstructor; isEdited: BooleanConstructor; src: StringConstructor; text: StringConstructor; timestamp: (DateConstructor | NumberConstructor | StringConstructor)[]; type: StringConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:alt": null; "update:author": null; "update:id": null; "update:isDeleted": null; "update:isEdited": null; "update:src": null; "update:text": null; "update:timestamp": null; "update:type": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ alt: StringConstructor; author: PropType<Record<string, any> | User>; id: (NumberConstructor | StringConstructor)[]; isDeleted: BooleanConstructor; isEdited: BooleanConstructor; src: StringConstructor; text: StringConstructor; timestamp: (DateConstructor | NumberConstructor | StringConstructor)[]; type: StringConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:text"?: ((...args: any[]) => any) | undefined; "onUpdate:type"?: ((...args: any[]) => any) | undefined; "onUpdate:id"?: ((...args: any[]) => any) | undefined; "onUpdate:alt"?: ((...args: any[]) => any) | undefined; "onUpdate:author"?: ((...args: any[]) => any) | undefined; "onUpdate:isDeleted"?: ((...args: any[]) => any) | undefined; "onUpdate:isEdited"?: ((...args: any[]) => any) | undefined; "onUpdate:src"?: ((...args: any[]) => any) | undefined; "onUpdate:timestamp"?: ((...args: any[]) => any) | undefined; }, { isDeleted: boolean; isEdited: boolean; }>; declare const DxMessageTimestampFormat: import("@vue/runtime-core").DefineComponent<{ currency: StringConstructor; formatter: PropType<(value: number | Date) => string>; parser: PropType<(value: string) => number | Date>; precision: NumberConstructor; type: PropType<string>; useCurrencyAccountingStyle: BooleanConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:currency": null; "update:formatter": null; "update:parser": null; "update:precision": null; "update:type": null; "update:useCurrencyAccountingStyle": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ currency: StringConstructor; formatter: PropType<(value: number | Date) => string>; parser: PropType<(value: string) => number | Date>; precision: NumberConstructor; type: PropType<string>; useCurrencyAccountingStyle: BooleanConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:type"?: ((...args: any[]) => any) | undefined; "onUpdate:currency"?: ((...args: any[]) => any) | undefined; "onUpdate:formatter"?: ((...args: any[]) => any) | undefined; "onUpdate:parser"?: ((...args: any[]) => any) | undefined; "onUpdate:precision"?: ((...args: any[]) => any) | undefined; "onUpdate:useCurrencyAccountingStyle"?: ((...args: any[]) => any) | undefined; }, { useCurrencyAccountingStyle: boolean; }>; declare const DxTypingUser: import("@vue/runtime-core").DefineComponent<{ avatarAlt: StringConstructor; avatarUrl: StringConstructor; id: (NumberConstructor | StringConstructor)[]; name: StringConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:avatarAlt": null; "update:avatarUrl": null; "update:id": null; "update:name": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ avatarAlt: StringConstructor; avatarUrl: StringConstructor; id: (NumberConstructor | StringConstructor)[]; name: StringConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:name"?: ((...args: any[]) => any) | undefined; "onUpdate:id"?: ((...args: any[]) => any) | undefined; "onUpdate:avatarAlt"?: ((...args: any[]) => any) | undefined; "onUpdate:avatarUrl"?: ((...args: any[]) => any) | undefined; }, {}>; declare const DxUser: import("@vue/runtime-core").DefineComponent<{ avatarAlt: StringConstructor; avatarUrl: StringConstructor; id: (NumberConstructor | StringConstructor)[]; name: StringConstructor; }, unknown, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, { "update:isActive": null; "update:hoveredElement": null; "update:avatarAlt": null; "update:avatarUrl": null; "update:id": null; "update:name": null; }, string, import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{ avatarAlt: StringConstructor; avatarUrl: StringConstructor; id: (NumberConstructor | StringConstructor)[]; name: StringConstructor; }>> & { "onUpdate:isActive"?: ((...args: any[]) => any) | undefined; "onUpdate:hoveredElement"?: ((...args: any[]) => any) | undefined; "onUpdate:name"?: ((...args: any[]) => any) | undefined; "onUpdate:id"?: ((...args: any[]) => any) | undefined; "onUpdate:avatarAlt"?: ((...args: any[]) => any) | undefined; "onUpdate:avatarUrl"?: ((...args: any[]) => any) | undefined; }, {}>; export default DxChat; export { DxChat, DxAlert, DxAuthor, DxDayHeaderFormat, DxEditing, DxItem, DxMessageTimestampFormat, DxTypingUser, DxUser }; import type * as DxChatTypes from "devextreme/ui/chat_types"; export { DxChatTypes };