Merge branch '24_2' of https://github.com/DevExpress/DevExtreme into …

…24_2-splitter-on-resizeend-issue

apps/demos/project.json

@@ -44,6 +44,8 @@
         "test"
       ],
       "outputs": [
+        "{projectRoot}/accessibility_report.txt",
+        "{projectRoot}/accessibility_testcafe_report",
         "{projectRoot}/testing/artifacts"
       ],
       "cache": true

packages/devextreme-angular/src/index.ts

@@ -13,6 +13,7 @@ export { DxButtonGroupComponent, DxButtonGroupModule } from 'devextreme-angular/
 export { DxButtonComponent, DxButtonModule } from 'devextreme-angular/ui/button';
 export { DxCalendarComponent, DxCalendarModule } from 'devextreme-angular/ui/calendar';
 export { DxChartComponent, DxChartModule } from 'devextreme-angular/ui/chart';
+export { DxChatComponent, DxChatModule } from 'devextreme-angular/ui/chat';
 export { DxCheckBoxComponent, DxCheckBoxModule } from 'devextreme-angular/ui/check-box';
 export { DxCircularGaugeComponent, DxCircularGaugeModule } from 'devextreme-angular/ui/circular-gauge';
 export { DxColorBoxComponent, DxColorBoxModule } from 'devextreme-angular/ui/color-box';

packages/devextreme-angular/src/ui/all.ts

@@ -9,6 +9,7 @@ import { DxButtonModule } from 'devextreme-angular/ui/button';
 import { DxButtonGroupModule } from 'devextreme-angular/ui/button-group';
 import { DxCalendarModule } from 'devextreme-angular/ui/calendar';
 import { DxChartModule } from 'devextreme-angular/ui/chart';
+import { DxChatModule } from 'devextreme-angular/ui/chat';
 import { DxCheckBoxModule } from 'devextreme-angular/ui/check-box';
 import { DxCircularGaugeModule } from 'devextreme-angular/ui/circular-gauge';
 import { DxColorBoxModule } from 'devextreme-angular/ui/color-box';
@@ -92,6 +93,7 @@ import { DxTemplateModule } from 'devextreme-angular/core';
     DxButtonGroupModule,
     DxCalendarModule,
     DxChartModule,
+    DxChatModule,
     DxCheckBoxModule,
     DxCircularGaugeModule,
     DxColorBoxModule,
@@ -174,6 +176,7 @@ import { DxTemplateModule } from 'devextreme-angular/core';
     DxButtonGroupModule,
     DxCalendarModule,
     DxChartModule,
+    DxChatModule,
     DxCheckBoxModule,
     DxCircularGaugeModule,
     DxColorBoxModule,

packages/devextreme-angular/src/ui/chat/index.ts

@@ -0,0 +1,357 @@
+/* tslint:disable:max-line-length */
+
+
+import {
+    TransferState,
+    Component,
+    NgModule,
+    ElementRef,
+    NgZone,
+    PLATFORM_ID,
+    Inject,
+
+    Input,
+    Output,
+    OnDestroy,
+    EventEmitter,
+    OnChanges,
+    DoCheck,
+    SimpleChanges,
+    ContentChildren,
+    QueryList
+} from '@angular/core';
+
+
+import { DisposingEvent, InitializedEvent, Message, MessageSendEvent, OptionChangedEvent } from 'devextreme/ui/chat';
+
+import DxChat from 'devextreme/ui/chat';
+
+
+import {
+    DxComponent,
+    DxTemplateHost,
+    DxIntegrationModule,
+    DxTemplateModule,
+    NestedOptionHost,
+    IterableDifferHelper,
+    WatcherHelper
+} from 'devextreme-angular/core';
+
+import { DxiItemModule } from 'devextreme-angular/ui/nested';
+import { DxoAuthorModule } from 'devextreme-angular/ui/nested';
+
+import { DxiItemComponent } from 'devextreme-angular/ui/nested';
+
+
+
+/**
+ * [descr:dxChat]
+
+ */
+@Component({
+    selector: 'dx-chat',
+    template: '',
+    providers: [
+        DxTemplateHost,
+        WatcherHelper,
+        NestedOptionHost,
+        IterableDifferHelper
+    ]
+})
+export class DxChatComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck {
+    instance: DxChat = null;
+
+    /**
+     * [descr:WidgetOptions.disabled]
+    
+     */
+    @Input()
+    get disabled(): boolean {
+        return this._getOption('disabled');
+    }
+    set disabled(value: boolean) {
+        this._setOption('disabled', value);
+    }
+
+
+    /**
+     * [descr:DOMComponentOptions.elementAttr]
+    
+     */
+    @Input()
+    get elementAttr(): any {
+        return this._getOption('elementAttr');
+    }
+    set elementAttr(value: any) {
+        this._setOption('elementAttr', value);
+    }
+
+
+    /**
+     * [descr:DOMComponentOptions.height]
+    
+     */
+    @Input()
+    get height(): number | Function | string | undefined {
+        return this._getOption('height');
+    }
+    set height(value: number | Function | string | undefined) {
+        this._setOption('height', value);
+    }
+
+
+    /**
+     * [descr:WidgetOptions.hoverStateEnabled]
+    
+     */
+    @Input()
+    get hoverStateEnabled(): boolean {
+        return this._getOption('hoverStateEnabled');
+    }
+    set hoverStateEnabled(value: boolean) {
+        this._setOption('hoverStateEnabled', value);
+    }
+
+
+    /**
+     * [descr:dxChatOptions.items]
+    
+     */
+    @Input()
+    get items(): Array<Message> {
+        return this._getOption('items');
+    }
+    set items(value: Array<Message>) {
+        this._setOption('items', value);
+    }
+
+
+    /**
+     * [descr:DOMComponentOptions.rtlEnabled]
+    
+     */
+    @Input()
+    get rtlEnabled(): boolean {
+        return this._getOption('rtlEnabled');
+    }
+    set rtlEnabled(value: boolean) {
+        this._setOption('rtlEnabled', value);
+    }
+
+
+    /**
+     * [descr:WidgetOptions.visible]
+    
+     */
+    @Input()
+    get visible(): boolean {
+        return this._getOption('visible');
+    }
+    set visible(value: boolean) {
+        this._setOption('visible', value);
+    }
+
+
+    /**
+     * [descr:DOMComponentOptions.width]
+    
+     */
+    @Input()
+    get width(): number | Function | string | undefined {
+        return this._getOption('width');
+    }
+    set width(value: number | Function | string | undefined) {
+        this._setOption('width', value);
+    }
+
+    /**
+    
+     * [descr:dxChatOptions.onDisposing]
+    
+    
+     */
+    @Output() onDisposing: EventEmitter<DisposingEvent>;
+
+    /**
+    
+     * [descr:dxChatOptions.onInitialized]
+    
+    
+     */
+    @Output() onInitialized: EventEmitter<InitializedEvent>;
+
+    /**
+    
+     * [descr:dxChatOptions.onMessageSend]
+    
+    
+     */
+    @Output() onMessageSend: EventEmitter<MessageSendEvent>;
+
+    /**
+    
+     * [descr:dxChatOptions.onOptionChanged]
+    
+    
+     */
+    @Output() onOptionChanged: EventEmitter<OptionChangedEvent>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() disabledChange: EventEmitter<boolean>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() elementAttrChange: EventEmitter<any>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() heightChange: EventEmitter<number | Function | string | undefined>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() hoverStateEnabledChange: EventEmitter<boolean>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() itemsChange: EventEmitter<Array<Message>>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() rtlEnabledChange: EventEmitter<boolean>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() visibleChange: EventEmitter<boolean>;
+
+    /**
+    
+     * This member supports the internal infrastructure and is not intended to be used directly from your code.
+    
+     */
+    @Output() widthChange: EventEmitter<number | Function | string | undefined>;
+
+
+
+
+    @ContentChildren(DxiItemComponent)
+    get itemsChildren(): QueryList<DxiItemComponent> {
+        return this._getOption('items');
+    }
+    set itemsChildren(value) {
+        this.setChildren('items', value);
+    }
+
+
+
+
+    constructor(elementRef: ElementRef, ngZone: NgZone, templateHost: DxTemplateHost,
+            private _watcherHelper: WatcherHelper,
+            private _idh: IterableDifferHelper,
+            optionHost: NestedOptionHost,
+            transferState: TransferState,
+            @Inject(PLATFORM_ID) platformId: any) {
+
+        super(elementRef, ngZone, templateHost, _watcherHelper, transferState, platformId);
+
+        this._createEventEmitters([
+            { subscribe: 'disposing', emit: 'onDisposing' },
+            { subscribe: 'initialized', emit: 'onInitialized' },
+            { subscribe: 'messageSend', emit: 'onMessageSend' },
+            { subscribe: 'optionChanged', emit: 'onOptionChanged' },
+            { emit: 'disabledChange' },
+            { emit: 'elementAttrChange' },
+            { emit: 'heightChange' },
+            { emit: 'hoverStateEnabledChange' },
+            { emit: 'itemsChange' },
+            { emit: 'rtlEnabledChange' },
+            { emit: 'visibleChange' },
+            { emit: 'widthChange' }
+        ]);
+
+        this._idh.setHost(this);
+        optionHost.setHost(this);
+    }
+
+    protected _createInstance(element, options) {
+
+        return new DxChat(element, options);
+    }
+
+
+    ngOnDestroy() {
+        this._destroyWidget();
+    }
+
+    ngOnChanges(changes: SimpleChanges) {
+        super.ngOnChanges(changes);
+        this.setupChanges('items', changes);
+    }
+
+    setupChanges(prop: string, changes: SimpleChanges) {
+        if (!(prop in this._optionsToUpdate)) {
+            this._idh.setup(prop, changes);
+        }
+    }
+
+    ngDoCheck() {
+        this._idh.doCheck('items');
+        this._watcherHelper.checkWatchers();
+        super.ngDoCheck();
+        super.clearChangedOptions();
+    }
+
+    _setOption(name: string, value: any) {
+        let isSetup = this._idh.setupSingle(name, value);
+        let isChanged = this._idh.getChanges(name, value) !== null;
+
+        if (isSetup || isChanged) {
+            super._setOption(name, value);
+        }
+    }
+}
+
+@NgModule({
+  imports: [
+    DxiItemModule,
+    DxoAuthorModule,
+    DxIntegrationModule,
+    DxTemplateModule
+  ],
+  declarations: [
+    DxChatComponent
+  ],
+  exports: [
+    DxChatComponent,
+    DxiItemModule,
+    DxoAuthorModule,
+    DxTemplateModule
+  ]
+})
+export class DxChatModule { }
+
+import type * as DxChatTypes from "devextreme/ui/chat_types";
+export { DxChatTypes };
+
+