Skip to content

Commit 9d0ea6c

Browse files
TextEditorBase, TextEditorMask, TextBox: convert into ES6 class (DevExpress#29160)
1 parent c35aa57 commit 9d0ea6c

File tree

17 files changed

+939
-655
lines changed

17 files changed

+939
-655
lines changed

packages/devextreme/js/__internal/core/widget/dom_component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -332,7 +332,7 @@ class DOMComponent<
332332
element: string | HTMLElement | dxElementWrapper,
333333
component: string | (new (...args) => TTComponent),
334334
// eslint-disable-next-line @typescript-eslint/no-explicit-any
335-
componentConfiguration: TTComponent extends Component<any, infer TTProperties>
335+
componentConfiguration?: TTComponent extends Component<any, infer TTProperties>
336336
? TTProperties
337337
: Record<string, unknown>,
338338
): TTComponent {

packages/devextreme/js/__internal/ui/date_range_box/m_date_range_box.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -408,6 +408,7 @@ class DateRangeBox extends Editor<Properties> {
408408
}
409409

410410
_renderButtonsContainer(): void {
411+
// @ts-expect-error
411412
this._buttonCollection = new TextEditorButtonCollection(this, this._getDefaultButtons());
412413

413414
this._$beforeButtonsContainer = undefined;
@@ -738,9 +739,9 @@ class DateRangeBox extends Editor<Properties> {
738739
return this.$element();
739740
}
740741

741-
_toggleFocusClass(isFocused, $element: dxElementWrapper): void {
742+
_toggleFocusClass(isFocused: boolean): void {
742743
// @ts-expect-error
743-
super._toggleFocusClass(isFocused, this._focusClassTarget($element));
744+
super._toggleFocusClass(isFocused, this._focusClassTarget());
744745
}
745746

746747
_hasActiveElement(): boolean {

packages/devextreme/js/__internal/ui/drop_down_editor/m_drop_down_button.ts

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import eventsEngine from '@js/common/core/events/core/events_engine';
22
import messageLocalization from '@js/common/core/localization/message';
3+
import type { dxElementWrapper } from '@js/core/renderer';
34
import $ from '@js/core/renderer';
45
import { extend } from '@js/core/utils/extend';
56
import Button from '@js/ui/button';
@@ -24,11 +25,13 @@ export default class DropDownButton extends TextEditorButton {
2425
const { editor } = this;
2526

2627
instance.option('onClick', (e) => {
28+
// @ts-expect-error
2729
if (editor._shouldCallOpenHandler?.()) {
30+
// @ts-expect-error
2831
editor._openHandler(e);
2932
return;
3033
}
31-
34+
// @ts-expect-error
3235
!editor.option('openOnFieldClick') && editor._openHandler(e);
3336
});
3437

@@ -39,7 +42,10 @@ export default class DropDownButton extends TextEditorButton {
3942
});
4043
}
4144

42-
_create() {
45+
_create(): {
46+
$element: dxElementWrapper;
47+
instance: Button;
48+
} {
4349
const { editor } = this;
4450
const $element = $('<div>');
4551
const options = this._getOptions();
@@ -75,7 +81,7 @@ export default class DropDownButton extends TextEditorButton {
7581

7682
_isVisible(): boolean {
7783
const { editor } = this;
78-
84+
// @ts-expect-error
7985
return super._isVisible() && editor.option('showDropDownButton');
8086
}
8187

@@ -110,7 +116,7 @@ export default class DropDownButton extends TextEditorButton {
110116
const { editor, instance } = this;
111117
const $editor = editor.$element();
112118
const options = this._getOptions();
113-
119+
// @ts-expect-error
114120
instance?.option(options);
115121
this._legacyRender($editor, instance?.$element(), options.visible);
116122
}

packages/devextreme/js/__internal/ui/editor/editor.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -41,16 +41,16 @@ const VALIDATION_MESSAGE_KEYS_MAP = {
4141
};
4242

4343
export type UnresolvedEvents = 'onContentReady' | 'onDisposing' | 'onInitialized' | 'onOptionChanged' | 'onValueChanged';
44-
type ValueChangedEvent = NativeEventInfo<Editor> & ValueChangedInfo;
44+
export type ValueChangedEvent = NativeEventInfo<Editor> & ValueChangedInfo;
4545

4646
export interface EditorProperties<
4747
// eslint-disable-next-line @typescript-eslint/no-explicit-any
4848
TComponent extends PublicEditor<any> = PublicEditor,
4949
> extends EditorOptions<TComponent> {
50-
validationMessageOffset: { h: number; v: number };
50+
validationMessageOffset?: { h: number; v: number };
5151
validationBoundary?: dxElementWrapper;
52-
validationTooltipOptions: Record<string, unknown>;
53-
_showValidationMessage: boolean;
52+
validationTooltipOptions?: Record<string, unknown>;
53+
_showValidationMessage?: boolean;
5454
name?: string;
5555
_onMarkupRendered?: () => void;
5656
}
@@ -126,7 +126,7 @@ class Editor<
126126
validationTooltipOptions: {},
127127
_showValidationMessage: true,
128128
isDirty: false,
129-
} as unknown as TProperties;
129+
};
130130
}
131131

132132
_attachKeyboardEvents(): void {
@@ -367,7 +367,7 @@ class Editor<
367367
super._dispose();
368368
}
369369

370-
_setSubmitElementName(name: string | undefined): void {
370+
_setSubmitElementName(name?: string): void {
371371
const $submitElement = this._getSubmitElement();
372372

373373
if (!$submitElement) {

packages/devextreme/js/__internal/ui/m_file_uploader.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -298,7 +298,6 @@ class FileUploader extends Editor<FileUploaderProperties> {
298298
}
299299

300300
_setUploadStrategy() {
301-
// @ts-expect-error
302301
if (this.option('chunkSize') > 0) {
303302
const uploadChunk = this.option('uploadChunk');
304303
this._uploadStrategy = uploadChunk && isFunction(uploadChunk)
@@ -514,14 +513,14 @@ class FileUploader extends Editor<FileUploaderProperties> {
514513
_validateMaxFileSize(file): boolean {
515514
const fileSize = file.value.size;
516515
const maxFileSize = this.option('maxFileSize');
517-
// @ts-expect-error
516+
518517
return maxFileSize > 0 ? fileSize <= maxFileSize : true;
519518
}
520519

521520
_validateMinFileSize(file): boolean {
522521
const fileSize = file.value.size;
523522
const minFileSize = this.option('minFileSize');
524-
// @ts-expect-error
523+
525524
return minFileSize > 0 ? fileSize >= minFileSize : true;
526525
}
527526

packages/devextreme/js/__internal/ui/number_box/m_number_box.base.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ const WIDGET_CLASS = 'dx-numberbox';
2626
const FIREFOX_CONTROL_KEYS = ['tab', 'del', 'backspace', 'leftArrow', 'rightArrow', 'home', 'end', 'enter'];
2727

2828
const FORCE_VALUECHANGE_EVENT_NAMESPACE = 'NumberBoxForceValueChange';
29-
29+
// @ts-expect-error
3030
const NumberBoxBase = TextEditor.inherit({
3131

3232
_supportedKeys() {

packages/devextreme/js/__internal/ui/number_box/m_number_box.spins.ts

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import eventsEngine from '@js/common/core/events/core/events_engine';
22
import pointer from '@js/common/core/events/pointer';
33
import { addNamespace } from '@js/common/core/events/utils/index';
4+
import type { dxElementWrapper } from '@js/core/renderer';
45
import $ from '@js/core/renderer';
56
import { extend } from '@js/core/utils/extend';
67
import TextEditorButton from '@ts/ui/text_box/texteditor_button_collection/m_button';
@@ -14,9 +15,11 @@ const SPIN_TOUCH_FRIENDLY_CLASS = 'dx-numberbox-spin-touch-friendly';
1415
export default class SpinButtons extends TextEditorButton {
1516
_attachEvents(instance, $spinContainer) {
1617
const { editor } = this;
18+
// @ts-expect-error
1719
const eventName = addNamespace(pointer.down, editor.NAME);
1820
const $spinContainerChildren = $spinContainer.children();
1921
const pointerDownAction = editor._createAction(
22+
// @ts-expect-error
2023
(e) => editor._spinButtonsPointerDownHandler(e),
2124
);
2225

@@ -29,16 +32,21 @@ export default class SpinButtons extends TextEditorButton {
2932

3033
SpinButton.getInstance($spinContainerChildren.eq(0)).option(
3134
'onChange',
35+
// @ts-expect-error
3236
(e) => editor._spinUpChangeHandler(e),
3337
);
3438

3539
SpinButton.getInstance($spinContainerChildren.eq(1)).option(
3640
'onChange',
41+
// @ts-expect-error
3742
(e) => editor._spinDownChangeHandler(e),
3843
);
3944
}
4045

41-
_create() {
46+
_create(): {
47+
$element: dxElementWrapper;
48+
instance: dxElementWrapper;
49+
} {
4250
const { editor } = this;
4351
const $spinContainer = $('<div>').addClass(SPIN_CONTAINER_CLASS);
4452
const $spinUp = $('<div>').appendTo($spinContainer);
@@ -69,6 +77,7 @@ export default class SpinButtons extends TextEditorButton {
6977
};
7078
}
7179

80+
// @ts-expect-error
7281
_isVisible() {
7382
const { editor } = this;
7483

@@ -88,14 +97,15 @@ export default class SpinButtons extends TextEditorButton {
8897
}
8998

9099
// @ts-expect-error
91-
update() {
100+
update(): void {
92101
const shouldUpdate = super.update();
93102

94103
if (shouldUpdate) {
95104
const { editor, instance } = this;
96105
const $editor = editor.$element();
97106
const isVisible = this._isVisible();
98107
const isTouchFriendly = this._isTouchFriendly();
108+
// @ts-expect-error
99109
const $spinButtons = instance.children();
100110
const spinUp = SpinButton.getInstance($spinButtons.eq(0));
101111
const spinDown = SpinButton.getInstance($spinButtons.eq(1));

packages/devextreme/js/__internal/ui/splitter/resize_handle.ts

Lines changed: 70 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -79,88 +79,86 @@ class ResizeHandle extends Widget<ResizeHandleOptions> {
7979
_supportedKeys(): Record<string, (e: KeyboardEvent) => void | boolean> {
8080
return {
8181
...super._supportedKeys(),
82-
...{
83-
rightArrow(e: KeyboardEvent): void {
84-
e.preventDefault();
85-
e.stopPropagation();
86-
87-
const {
88-
direction, showCollapseNext, showCollapsePrev, rtlEnabled,
89-
} = this.option();
90-
91-
const forbidCollapseNext = rtlEnabled
92-
? showCollapsePrev === false
93-
: showCollapseNext === false;
94-
95-
if (isCommandKeyPressed(e)) {
96-
if (direction === RESIZE_DIRECTION.vertical || forbidCollapseNext) {
97-
return;
98-
}
99-
100-
if (rtlEnabled) {
101-
this._collapsePrevHandler(e);
102-
} else {
103-
this._collapseNextHandler(e);
104-
}
105-
} else {
106-
this._resizeBy(e, { x: KEYBOARD_DELTA });
107-
}
108-
},
109-
leftArrow(e: KeyboardEvent): void {
110-
e.preventDefault();
111-
e.stopPropagation();
112-
113-
const {
114-
direction, showCollapsePrev, showCollapseNext, rtlEnabled,
115-
} = this.option();
116-
117-
const forbidCollapsePrev = rtlEnabled
118-
? showCollapseNext === false
119-
: showCollapsePrev === false;
120-
121-
if (isCommandKeyPressed(e)) {
122-
if (direction === RESIZE_DIRECTION.vertical || forbidCollapsePrev) {
123-
return;
124-
}
125-
if (rtlEnabled) {
126-
this._collapseNextHandler(e);
127-
} else {
128-
this._collapsePrevHandler(e);
129-
}
130-
} else {
131-
this._resizeBy(e, { x: -KEYBOARD_DELTA });
132-
}
133-
},
134-
upArrow(e: KeyboardEvent): void {
135-
e.preventDefault();
136-
e.stopPropagation();
82+
rightArrow(e: KeyboardEvent): void {
83+
e.preventDefault();
84+
e.stopPropagation();
85+
86+
const {
87+
direction, showCollapseNext, showCollapsePrev, rtlEnabled,
88+
} = this.option();
13789

138-
const { direction, showCollapsePrev } = this.option();
90+
const forbidCollapseNext = rtlEnabled
91+
? showCollapsePrev === false
92+
: showCollapseNext === false;
13993

140-
if (isCommandKeyPressed(e)) {
141-
if (direction === RESIZE_DIRECTION.horizontal || showCollapsePrev === false) {
142-
return;
143-
}
94+
if (isCommandKeyPressed(e)) {
95+
if (direction === RESIZE_DIRECTION.vertical || forbidCollapseNext) {
96+
return;
97+
}
98+
99+
if (rtlEnabled) {
144100
this._collapsePrevHandler(e);
145101
} else {
146-
this._resizeBy(e, { y: -KEYBOARD_DELTA });
102+
this._collapseNextHandler(e);
147103
}
148-
},
149-
downArrow(e: KeyboardEvent): void {
150-
e.preventDefault();
151-
e.stopPropagation();
104+
} else {
105+
this._resizeBy(e, { x: KEYBOARD_DELTA });
106+
}
107+
},
108+
leftArrow(e: KeyboardEvent): void {
109+
e.preventDefault();
110+
e.stopPropagation();
111+
112+
const {
113+
direction, showCollapsePrev, showCollapseNext, rtlEnabled,
114+
} = this.option();
152115

153-
const { direction, showCollapseNext } = this.option();
116+
const forbidCollapsePrev = rtlEnabled
117+
? showCollapseNext === false
118+
: showCollapsePrev === false;
154119

155-
if (isCommandKeyPressed(e)) {
156-
if (direction === RESIZE_DIRECTION.horizontal || showCollapseNext === false) {
157-
return;
158-
}
120+
if (isCommandKeyPressed(e)) {
121+
if (direction === RESIZE_DIRECTION.vertical || forbidCollapsePrev) {
122+
return;
123+
}
124+
if (rtlEnabled) {
159125
this._collapseNextHandler(e);
160126
} else {
161-
this._resizeBy(e, { y: KEYBOARD_DELTA });
127+
this._collapsePrevHandler(e);
128+
}
129+
} else {
130+
this._resizeBy(e, { x: -KEYBOARD_DELTA });
131+
}
132+
},
133+
upArrow(e: KeyboardEvent): void {
134+
e.preventDefault();
135+
e.stopPropagation();
136+
137+
const { direction, showCollapsePrev } = this.option();
138+
139+
if (isCommandKeyPressed(e)) {
140+
if (direction === RESIZE_DIRECTION.horizontal || showCollapsePrev === false) {
141+
return;
142+
}
143+
this._collapsePrevHandler(e);
144+
} else {
145+
this._resizeBy(e, { y: -KEYBOARD_DELTA });
146+
}
147+
},
148+
downArrow(e: KeyboardEvent): void {
149+
e.preventDefault();
150+
e.stopPropagation();
151+
152+
const { direction, showCollapseNext } = this.option();
153+
154+
if (isCommandKeyPressed(e)) {
155+
if (direction === RESIZE_DIRECTION.horizontal || showCollapseNext === false) {
156+
return;
162157
}
163-
},
158+
this._collapseNextHandler(e);
159+
} else {
160+
this._resizeBy(e, { y: KEYBOARD_DELTA });
161+
}
164162
},
165163
};
166164
}

0 commit comments

Comments
 (0)