Skip to content

Scheduler — Replace underscore-prefixed: m_appointment.ts + m_tooltip_strategy_base.ts #32916

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
aleksei-semikozov wants to merge 3 commits into from
+89 −89
Closed

Scheduler — Replace underscore-prefixed: m_appointment.ts + m_tooltip_strategy_base.ts #32916

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f97a584
Scheduler - Replace underscore-prefixed: m_appointment.ts + m_tooltip…
aleksei-semikozov Mar 15, 2026
cdc06cf
Scheduler - Fix options visibility to public (accessed externally by …
aleksei-semikozov Mar 15, 2026
2dbfafd
Scheduler - Fix QUnit tests accessing renamed tooltip strategy proper…
aleksei-semikozov Mar 15, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/devextreme/js/__internal/scheduler/appointments/appointment/agenda_appointment.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export class AgendaAppointment extends Appointment {
return this.$element().find(`.${APPOINTMENT_CONTENT_CLASSES.AGENDA_MARKER}`);
}

_renderResourceList(): void {
private renderResourceList(): void {
const resourceManager = this.option('getResourceManager')();

// eslint-disable-next-line no-void
Expand Down Expand Up @@ -42,6 +42,6 @@ export class AgendaAppointment extends Appointment {

_render(): void {
super._render();
this._renderResourceList();
this.renderResourceList();
}
}
56 changes: 28 additions & 28 deletions packages/devextreme/js/__internal/scheduler/appointments/appointment/m_appointment.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,15 +111,15 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
this._invalidate();
break;
case 'isDragSource':
this._renderDragSourceClass();
this.renderDragSourceClass();
break;
default:
// @ts-expect-error
super._optionChanged(args);
}
}

_getHorizontalResizingRule() {
private getHorizontalResizingRule() {
const reducedHandles = {
head: this.option('rtlEnabled') ? 'right' : 'left',
body: '',
Expand All @@ -137,7 +137,7 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
};
}

_getVerticalResizingRule() {
private getVerticalResizingRule() {
const height = Math.round(this.invoke('getCellHeight'));

return {
Expand All @@ -153,24 +153,24 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
// @ts-expect-error
super._render();

this._renderAppointmentGeometry();
this._renderAriaLabel();
this._renderEmptyClass();
this._renderReducedAppointment();
this._renderAllDayClass();
this._renderDragSourceClass();
this._renderDirection();
this.renderAppointmentGeometry();
this.renderAriaLabel();
this.renderEmptyClass();
this.renderReducedAppointment();
this.renderAllDayClass();
this.renderDragSourceClass();
this.renderDirection();

this.$element().data('dxAppointmentStartDate', this.option('startDate'));
this.$element().attr('role', 'button');

this._renderRecurrenceClass();
this._renderResizable();
this.renderRecurrenceClass();
this.renderResizable();

this._setResourceColor();
this.setResourceColor();
}

_setResourceColor() {
private setResourceColor() {
const appointmentConfig = {
itemData: this.rawAppointment,
groupIndex: this.option('groupIndex') ?? 0,
Expand All @@ -186,7 +186,7 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
});
}

_renderAriaLabel(): void {
private renderAriaLabel(): void {
const $element: dxElementWrapper = this.$element();
$element.attr('aria-label', getAriaLabel(this.option()));

Expand All @@ -205,7 +205,7 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
});
}

_renderAppointmentGeometry(): void {
private renderAppointmentGeometry(): void {
const geometry: any = this.option('geometry');
const $element: any = this.$element();
move($element, {
Expand All @@ -219,15 +219,15 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
});
}

_renderEmptyClass() {
private renderEmptyClass() {
const geometry: any = this.option('geometry');

if (geometry.empty || this.option('isCompact')) {
(this.$element() as any).addClass(EMPTY_APPOINTMENT_CLASS);
}
}

_renderReducedAppointment() {
private renderReducedAppointment() {
const reducedPart: any = this.option('reduced');

if (!reducedPart) {
Expand All @@ -238,10 +238,10 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
.toggleClass(REDUCED_APPOINTMENT_CLASS, true)
.toggleClass(REDUCED_APPOINTMENT_PARTS_CLASSES[reducedPart], true);

this._renderAppointmentReducedIcon();
this.renderAppointmentReducedIcon();
}

_renderAppointmentReducedIcon() {
private renderAppointmentReducedIcon() {
const $icon = $('<div>')
.addClass(REDUCED_APPOINTMENT_ICON)
.appendTo(this.$element());
Expand All @@ -259,28 +259,28 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
});
}

_renderAllDayClass() {
private renderAllDayClass() {
(this.$element() as any).toggleClass(ALL_DAY_APPOINTMENT_CLASS, Boolean(this.option('allDay')));
}

_renderDragSourceClass() {
private renderDragSourceClass() {
(this.$element() as any).toggleClass(APPOINTMENT_DRAG_SOURCE_CLASS, Boolean(this.option('isDragSource')));
}

_renderRecurrenceClass() {
private renderRecurrenceClass() {
const rule = this.dataAccessors.get('recurrenceRule', this.rawAppointment);

if (validateRRule(rule)) {
(this.$element() as any).addClass(RECURRENCE_APPOINTMENT_CLASS);
}
}

_renderDirection() {
private renderDirection() {
(this.$element() as any).addClass(DIRECTION_APPOINTMENT_CLASSES[this.option('direction') as any]);
}

_createResizingConfig() {
const config: any = this.option('direction') === 'vertical' ? this._getVerticalResizingRule() : this._getHorizontalResizingRule();
private createResizingConfig() {
const config: any = this.option('direction') === 'vertical' ? this.getVerticalResizingRule() : this.getHorizontalResizingRule();

if (!this.invoke('isGroupedByDate')) {
config.stepPrecision = 'strict';
Expand All @@ -289,14 +289,14 @@ export class Appointment extends DOMComponent<AppointmentProperties> {
return config;
}

_renderResizable() {
private renderResizable() {
if (this.option('allowResize')) {
// @ts-expect-error
this._createComponent(
this.$element(),
Resizable,
extend(
this._createResizingConfig(),
this.createResizingConfig(),
this.option('resizableConfig'),
),
);
Expand Down
2 changes: 1 addition & 1 deletion packages/devextreme/js/__internal/scheduler/m_scheduler.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -400,7 +400,7 @@ class Scheduler extends SchedulerOptionsBaseWidget {
break;
case 'onAppointmentContextMenu':
this._appointments.option('onItemContextMenu', this._createActionByOption(name));
this.appointmentTooltip._options.onItemContextMenu = this._createActionByOption(name);
this.appointmentTooltip.options.onItemContextMenu = this._createActionByOption(name);
break;
case 'noDataText':
case 'allowMultipleCellSelection':
Expand Down
24 changes: 12 additions & 12 deletions packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_desktop_tooltip_strategy.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,24 +9,24 @@ const MAX_TOOLTIP_HEIGHT = 200;

export class DesktopTooltipStrategy extends TooltipStrategyBase {
protected override prepareBeforeVisibleChanged(dataList) {
this._tooltip.option('position', {
this.tooltip.option('position', {
my: 'bottom',
at: 'top',
boundary: this.getBoundary(dataList),
offset: this._extraOptions.offset,
offset: this.extraOptions.offset,
collision: 'fit flipfit',
});
}

private getBoundary(dataList) {
return this._options.isAppointmentInAllDayPanel(dataList[0].appointment) ? this._options.container : this._options.getScrollableContainer();
return this.options.isAppointmentInAllDayPanel(dataList[0].appointment) ? this.options.container : this.options.getScrollableContainer();
}

protected override onShown() {
super.onShown();
if (this._extraOptions.isButtonClick) {
this._list.focus();
this._list.option('focusedElement', null);
if (this.extraOptions.isButtonClick) {
this.list.focus();
this.list.option('focusedElement', null);
}
}

Expand All @@ -43,14 +43,14 @@ export class DesktopTooltipStrategy extends TooltipStrategyBase {
protected override createTooltip(target, dataList) {
const tooltipElement = this.createTooltipElement(APPOINTMENT_TOOLTIP_WRAPPER_CLASS);

const tooltip = this._options.createComponent(tooltipElement, Tooltip, {
const tooltip = this.options.createComponent(tooltipElement, Tooltip, {
target,
maxHeight: MAX_TOOLTIP_HEIGHT,
rtlEnabled: this._extraOptions.rtlEnabled,
rtlEnabled: this.extraOptions.rtlEnabled,
onShown: this.onShown.bind(this),
contentTemplate: this.getContentTemplate(dataList),
wrapperAttr: { class: APPOINTMENT_TOOLTIP_WRAPPER_CLASS },
_loopFocus: this._extraOptions._loopFocus,
_loopFocus: this.extraOptions._loopFocus,
});

tooltip.setAria({
Expand All @@ -62,11 +62,11 @@ export class DesktopTooltipStrategy extends TooltipStrategyBase {
}

protected override onListRender(e) {
return this._extraOptions.dragBehavior && this._extraOptions.dragBehavior(e);
return this.extraOptions.dragBehavior && this.extraOptions.dragBehavior(e);
}

protected override onListItemContextMenu(e) {
const contextMenuEventArgs = this._options.createEventArgs(e);
this._options.onItemContextMenu(contextMenuEventArgs);
const contextMenuEventArgs = this.options.createEventArgs(e);
this.options.onItemContextMenu(contextMenuEventArgs);
}
}
12 changes: 6 additions & 6 deletions packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_mobile_tooltip_strategy.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,16 +71,16 @@ export class MobileTooltipStrategy extends TooltipStrategyBase {
private setTooltipConfig(): void {
const isTabletWidth = getWidth(getWindow()) > 700;

const listHeight = getOuterHeight(this._list.$element().find(CLASS.scrollableContent));
this._tooltip.option(
const listHeight = getOuterHeight(this.list.$element().find(CLASS.scrollableContent));
this.tooltip.option(
isTabletWidth
? createTabletDeviceConfig(listHeight)
: createPhoneDeviceConfig(listHeight),
);
}

private async _onShowing(): Promise<void> {
this._tooltip.option('height', MAX_HEIGHT.DEFAULT);
private async onShowingHandler(): Promise<void> {
this.tooltip.option('height', MAX_HEIGHT.DEFAULT);
/*
NOTE: there are two setTooltipConfig calls to reduce blinking of overlay.
The first one sets initial sizes, the second updates them after rendering async templates
Expand All @@ -94,12 +94,12 @@ export class MobileTooltipStrategy extends TooltipStrategyBase {
protected override createTooltip(target, dataList) {
const element = this.createTooltipElement(CLASS.slidePanel);

return this._options.createComponent(element, Overlay, {
return this.options.createComponent(element, Overlay, {
target: getWindow(),
hideOnOutsideClick: true,
animation: animationConfig,

onShowing: () => this._onShowing(),
onShowing: () => this.onShowingHandler(),
onShown: this.onShown.bind(this),
contentTemplate: this.getContentTemplate(dataList),
wrapperAttr: { class: CLASS.slidePanel },
Expand Down
Loading
Loading