Skip to content

Commit 49a98fb

Browse files
author
pipeline
committed
v32.2.5 is released
1 parent f0450dc commit 49a98fb

File tree

125 files changed

+2796
-669
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

125 files changed

+2796
-669
lines changed

‎controls/barcodegenerator/CHANGELOG.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
## [Unreleased]
44

5+
## 32.2.5 (2026-02-17)
6+
57
### Barcode
68

79
#### Bug Fixes

‎controls/base/styles/definition/_material3-dark.scss‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -814,3 +814,20 @@ $information-font-color: $info !default;
814814

815815
$frozen-shadow: rgba(0, 0, 0, .25) !default;
816816
$frozen-shadow-2: rgba(0, 0, 0, .25) !default;
817+
818+
// grid components
819+
$table-bg-color: $content-bg-color !default;
820+
$table-header-bg-color:$surface !default;
821+
$table-content-bg-color:$transparent !default;
822+
$content-header-bg-color: $surface !default;
823+
$table-header-text-color: $content-text-color !default;
824+
$table-header-icon-color: $icon-color !default;
825+
$content-header-text-color: $content-text-color !default;
826+
$content-header-icon-color: $icon-color !default;
827+
$table-header-border: $border-light !default;
828+
$table-border: $border-light !default;
829+
830+
//Dropdown list
831+
$flyout-header-bg-color: $flyout-bg-color !default;
832+
$flyout-header-text-color: rgba($content-text-color) !default;
833+
$flyout-header-icon-color: rgba($icon-color) !default;

‎controls/base/styles/definition/_material3.scss‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -302,6 +302,23 @@ $tooltip-bg-color: $inverse-surface !default;
302302
$tooltip-border: $inverse-surface !default;
303303
$tooltip-text-color: $inverse-on-surface !default;
304304

305+
// grid components
306+
$table-bg-color: $content-bg-color !default;
307+
$table-header-bg-color:$surface !default;
308+
$table-content-bg-color:$transparent !default;
309+
$content-header-bg-color: $surface !default;
310+
$table-header-text-color: $content-text-color !default;
311+
$table-header-icon-color: $icon-color !default;
312+
$content-header-text-color: $content-text-color !default;
313+
$content-header-icon-color: $icon-color !default;
314+
$table-header-border: $border-light !default;
315+
$table-border: $border-light !default;
316+
317+
//Dropdown list
318+
$flyout-header-bg-color: $flyout-bg-color !default;
319+
$flyout-header-text-color: rgba($content-text-color) !default;
320+
$flyout-header-icon-color: rgba($icon-color) !default;
321+
305322
$shadow: 0 .8px 16px rgba($black, .15) !default;
306323
$shadow-sm: $level1 !default;
307324
$shadow-md: $level2 !default;

‎controls/blockeditor/CHANGELOG.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
## [Unreleased]
44

5+
## 32.2.5 (2026-02-17)
6+
57
### Block Editor
68

79
#### Bug Fixes

‎controls/calendars/CHANGELOG.md‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,38 @@
22

33
## [Unreleased]
44

5+
## 32.2.5 (2026-02-17)
6+
7+
### DatePicker
8+
9+
#### Bug Fixes
10+
11+
- `#I805840`, `#I801368` - Resolved an issue where datepicker appeared beneath Angular `dialogs` in Angular 21.
12+
13+
### DateRangePicker
14+
15+
#### Bug Fixes
16+
17+
- `#I805840`, `#I801368` - Resolved an issue where daterangepicker appeared beneath Angular `dialogs` in Angular 21.
18+
19+
### TimePicker
20+
21+
#### Bug Fixes
22+
23+
- `#I805840`, `#I801368` - Resolved an issue where timepicker appeared beneath Angular `dialogs` in Angular 21.
24+
25+
### DateTimePicker
26+
27+
#### Bug Fixes
28+
29+
- `#I805840`, `#I801368` - Resolved an issue where datetimepicker appeared beneath Angular `dialogs` in Angular 21.
30+
31+
### Calendar
32+
33+
#### Bug Fixes
34+
35+
- `#I802045` - Fixed an issue where the Calendar is not behaving as expected when placed within a ContextMenu.
36+
537
## 32.1.19 (2025-12-16)
638

739
### DateRangePicker

‎controls/calendars/src/datepicker/datepicker.ts‎

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1422,13 +1422,14 @@ export class DatePicker extends Calendar implements IInput {
14221422
if (!isNullOrUndefined(this.cssClass)) {
14231423
this.popupWrapper.className += ' ' + this.cssClass;
14241424
}
1425+
const appendToElement: HTMLElement = this.getAppendToElement();
14251426
if (Browser.isDevice) {
14261427
this.modelHeader();
14271428
this.modal = this.createElement('div');
14281429
this.modal.className = '' + ROOT + ' e-date-modal';
1429-
document.body.className += ' ' + OVERFLOW;
1430+
appendToElement.className += ' ' + OVERFLOW;
14301431
this.modal.style.display = 'block';
1431-
document.body.appendChild(this.modal);
1432+
appendToElement.appendChild(this.modal);
14321433
}
14331434
//this.calendarElement represent the Calendar object from the Calendar class.
14341435
this.calendarElement.querySelector('table tbody').className = '';
@@ -1765,9 +1766,10 @@ export class DatePicker extends Calendar implements IInput {
17651766
this.previousDate = outOfRange;
17661767
this.createCalendar();
17671768
}
1769+
const appendToElement: HTMLElement = this.getAppendToElement();
17681770
if (Browser.isDevice) {
17691771
this.mobilePopupWrapper = this.createElement('div', { className: 'e-datepick-mob-popup-wrap'});
1770-
document.body.appendChild(this.mobilePopupWrapper);
1772+
appendToElement.appendChild(this.mobilePopupWrapper);
17711773
}
17721774
this.preventArgs = {
17731775
preventDefault: (): void => {
@@ -1776,7 +1778,7 @@ export class DatePicker extends Calendar implements IInput {
17761778
popup: this.popupObj,
17771779
event: e || null,
17781780
cancel: false,
1779-
appendTo: Browser.isDevice ? this.mobilePopupWrapper : document.body
1781+
appendTo: Browser.isDevice ? this.mobilePopupWrapper : appendToElement
17801782
};
17811783
const eventArgs: PopupObjectArgs = this.preventArgs;
17821784
this.trigger('open', eventArgs, (eventArgs: PopupObjectArgs) => {
@@ -1834,7 +1836,8 @@ export class DatePicker extends Calendar implements IInput {
18341836
cancel: false
18351837
};
18361838
removeClass(this.inputWrapper.buttons, ACTIVE);
1837-
removeClass([document.body], OVERFLOW);
1839+
const appendToElement: HTMLElement = this.getAppendToElement();
1840+
removeClass([appendToElement], OVERFLOW);
18381841
const eventArgs: PopupObjectArgs = this.preventArgs;
18391842
if (this.isCalendar()) {
18401843
this.trigger('close', eventArgs, (eventArgs: PopupObjectArgs) => {
@@ -2263,6 +2266,16 @@ export class DatePicker extends Calendar implements IInput {
22632266
protected getModuleName(): string {
22642267
return 'datepicker';
22652268
}
2269+
protected getAppendToElement(): HTMLElement {
2270+
if (this.isAngular) {
2271+
const cdkPane: HTMLElement = this.element.closest('.cdk-overlay-pane') as HTMLElement;
2272+
const popoverEl: HTMLElement = this.element.closest('[popover]') as HTMLElement;
2273+
if (cdkPane && popoverEl) {
2274+
return cdkPane;
2275+
}
2276+
}
2277+
return document.body;
2278+
}
22662279
private updateFloatLabelOverflowWidth(): void {
22672280
const container: HTMLElement = this.inputWrapper.container;
22682281
const label: HTMLElement = container.querySelector('.e-float-text.e-label-bottom');

‎controls/calendars/src/daterangepicker/daterangepicker.ts‎

Lines changed: 20 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3520,13 +3520,14 @@ export class DateRangePicker extends CalendarBase {
35203520
this.popupObj.hide();
35213521
this.popupWrapper = this.createElement('div', { id: this.element.id + '_popup', className: ROOT + ' ' + POPUP });
35223522
this.renderControl();
3523+
const appendToElement: HTMLElement = this.getAppendToElement();
35233524
this.openEventArgs = {
35243525
popup: this.popupObj || null,
35253526
cancel: false,
35263527
date: this.inputElement.value,
35273528
model: this,
35283529
event: event ? event : null,
3529-
appendTo: this.isMobile || Browser.isDevice ? this.mobileRangePopupWrap : document.body
3530+
appendTo: this.isMobile || Browser.isDevice ? this.mobileRangePopupWrap : appendToElement
35303531
};
35313532
const eventArgs: RangePopupEventArgs = this.openEventArgs;
35323533
this.trigger('open', eventArgs, (eventArgs: RangePopupEventArgs) => {
@@ -3607,9 +3608,10 @@ export class DateRangePicker extends CalendarBase {
36073608
if (!isNullOrUndefined(this.cssClass) && this.cssClass.trim() !== '') {
36083609
this.popupWrapper.className += ' ' + this.cssClass;
36093610
}
3611+
const appendToElement: HTMLElement = this.getAppendToElement();
36103612
if (this.isMobile && this.isCustomWindow) {
36113613
this.modal = this.createElement('div');
3612-
document.body.appendChild(this.modal);
3614+
appendToElement.appendChild(this.modal);
36133615
}
36143616
this.popupObj = new Popup(this.popupWrapper as HTMLElement, {
36153617
relateTo: this.isMobile && this.isCustomWindow ? document.body :
@@ -3742,7 +3744,7 @@ export class DateRangePicker extends CalendarBase {
37423744
}
37433745
if (this.isMobile && this.isCustomWindow) {
37443746
addClass([this.modal], [DEVICE, ROOT, 'e-range-modal']);
3745-
document.body.className += ' ' + OVERFLOW;
3747+
appendToElement.className += ' ' + OVERFLOW;
37463748
this.modal.style.display = 'block';
37473749
}
37483750
EventHandler.add(document, 'mousedown touchstart', this.documentHandler, this);
@@ -4577,6 +4579,16 @@ export class DateRangePicker extends CalendarBase {
45774579
protected getModuleName(): string {
45784580
return 'daterangepicker';
45794581
}
4582+
protected getAppendToElement(): HTMLElement {
4583+
if (this.isAngular) {
4584+
const cdkPane: HTMLElement = this.element.closest('.cdk-overlay-pane') as HTMLElement;
4585+
const popoverEl: HTMLElement = this.element.closest('[popover]') as HTMLElement;
4586+
if (cdkPane && popoverEl) {
4587+
return cdkPane;
4588+
}
4589+
}
4590+
return document.body;
4591+
}
45804592
private updateFloatLabelOverflowWidth(): void {
45814593
const container: HTMLElement = this.inputWrapper.container;
45824594
const label: HTMLElement = container.querySelector('.e-float-text.e-label-bottom');
@@ -4652,17 +4664,18 @@ export class DateRangePicker extends CalendarBase {
46524664
this.targetElement = element;
46534665
}
46544666
this.createPopup();
4667+
const appendToElement: HTMLElement = this.getAppendToElement();
46554668
if (this.isMobile || Browser.isDevice) {
46564669
this.mobileRangePopupWrap = this.createElement('div', { className: 'e-daterangepick-mob-popup-wrap'});
4657-
document.body.appendChild(this.mobileRangePopupWrap);
4670+
appendToElement.appendChild(this.mobileRangePopupWrap);
46584671
}
46594672
this.openEventArgs = {
46604673
popup: this.popupObj || null,
46614674
cancel: false,
46624675
date: this.inputElement.value,
46634676
model: this,
46644677
event: event ? event : null,
4665-
appendTo: this.isMobile || Browser.isDevice ? this.mobileRangePopupWrap : document.body
4678+
appendTo: this.isMobile || Browser.isDevice ? this.mobileRangePopupWrap : appendToElement
46664679
};
46674680
const eventArgs: RangePopupEventArgs = this.openEventArgs;
46684681
this.trigger('open', eventArgs, (eventArgs: RangePopupEventArgs) => {
@@ -4769,7 +4782,8 @@ export class DateRangePicker extends CalendarBase {
47694782
}
47704783
}
47714784
this.targetElement = null;
4772-
removeClass([document.body], OVERFLOW);
4785+
const appendToElement: HTMLElement = this.getAppendToElement();
4786+
removeClass([appendToElement], OVERFLOW);
47734787
EventHandler.remove(document, 'mousedown touchstart', this.documentHandler);
47744788
if (this.isMobile && this.modal) {
47754789
this.modal.style.display = 'none';

‎controls/calendars/src/datetimepicker/datetimepicker.ts‎

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1133,7 +1133,8 @@ export class DateTimePicker extends DatePicker {
11331133
this.listCreation();
11341134
append([this.listWrapper], this.dateTimeWrapper);
11351135
}
1136-
document.body.appendChild(this.dateTimeWrapper);
1136+
const appendToElement: HTMLElement = this.getAppendToElement();
1137+
appendToElement.appendChild(this.dateTimeWrapper);
11371138
this.addTimeSelection();
11381139
this.renderPopup();
11391140
this.setTimeScrollPosition();
@@ -1209,20 +1210,21 @@ export class DateTimePicker extends DatePicker {
12091210
}
12101211
private renderPopup(): void {
12111212
this.containerStyle = this.inputWrapper.container.getBoundingClientRect();
1213+
const appendToElement: HTMLElement = this.getAppendToElement();
12121214
if (Browser.isDevice) {
12131215
this.timeModal = createElement('div');
12141216
this.timeModal.className = '' + ROOT + ' e-time-modal';
1215-
document.body.className += ' ' + OVERFLOW;
1217+
appendToElement.className += ' ' + OVERFLOW;
12161218
this.timeModal.style.display = 'block';
1217-
document.body.appendChild(this.timeModal);
1219+
appendToElement.appendChild(this.timeModal);
12181220
}
12191221
if (Browser.isDevice){
12201222
this.modelWrapper = createElement('div', { className: 'e-datetime-mob-popup-wrap' });
12211223
this.modelWrapper.appendChild(this.dateTimeWrapper);
12221224
const dlgOverlay: HTMLElement = createElement('div', { className: 'e-dlg-overlay'});
12231225
dlgOverlay.style.zIndex = (this.zIndex - 1).toString();
12241226
this.modelWrapper.appendChild(dlgOverlay);
1225-
document.body.appendChild(this.modelWrapper);
1227+
appendToElement.appendChild(this.modelWrapper);
12261228
}
12271229
const offset: number = 4;
12281230
this.popupObject = new Popup(this.dateTimeWrapper as HTMLElement, {
@@ -1708,7 +1710,8 @@ export class DateTimePicker extends DatePicker {
17081710
super.hide(e);
17091711
} else if (this.isTimePopupOpen()) {
17101712
this.closePopup(e);
1711-
removeClass([document.body], OVERFLOW);
1713+
const appendToElement: HTMLElement = this.getAppendToElement();
1714+
removeClass([appendToElement], OVERFLOW);
17121715
if (Browser.isDevice && this.timeModal) {
17131716
this.timeModal.style.display = 'none';
17141717
this.timeModal.outerHTML = '';
@@ -2229,6 +2232,16 @@ export class DateTimePicker extends DatePicker {
22292232
protected getModuleName(): string {
22302233
return 'datetimepicker';
22312234
}
2235+
protected getAppendToElement(): HTMLElement {
2236+
if (this.isAngular) {
2237+
const cdkPane: HTMLElement = this.element.closest('.cdk-overlay-pane') as HTMLElement;
2238+
const popoverEl: HTMLElement = this.element.closest('[popover]') as HTMLElement;
2239+
if (cdkPane && popoverEl) {
2240+
return cdkPane;
2241+
}
2242+
}
2243+
return document.body;
2244+
}
22322245
protected restoreValue(): void {
22332246
this.previousDateTime = this.previousDate;
22342247
this.currentDate = this.value ? this.value : new Date();

‎controls/calendars/src/timepicker/timepicker.ts‎

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1550,8 +1550,8 @@ export class TimePicker extends Component<HTMLElement> implements IInput {
15501550
cancel: false,
15511551
name: 'open'
15521552
};
1553-
1554-
removeClass([document.body], OVERFLOW);
1553+
const appendToElement: HTMLElement = this.getAppendToElement();
1554+
removeClass([appendToElement], OVERFLOW);
15551555
this.trigger('close', args, (args: PopupEventArgs) => {
15561556
if (!args.cancel) {
15571557
const animModel: AnimationModel = {
@@ -2632,22 +2632,23 @@ export class TimePicker extends Component<HTMLElement> implements IInput {
26322632
return;
26332633
} else {
26342634
this.popupCreation();
2635+
const appendToElement: HTMLElement = this.getAppendToElement();
26352636
if (Browser.isDevice && this.listWrapper) {
26362637
this.modal = this.createElement('div');
26372638
this.modal.className = '' + ROOT + ' e-time-modal';
2638-
document.body.className += ' ' + OVERFLOW;
2639-
document.body.appendChild(this.modal);
2639+
appendToElement.className += ' ' + OVERFLOW;
2640+
appendToElement.appendChild(this.modal);
26402641
}
26412642
if (Browser.isDevice) {
26422643
this.mobileTimePopupWrap = this.createElement('div', { className: 'e-timepicker-mob-popup-wrap'});
2643-
document.body.appendChild(this.mobileTimePopupWrap);
2644+
appendToElement.appendChild(this.mobileTimePopupWrap);
26442645
}
26452646
this.openPopupEventArgs = {
26462647
popup: this.popupObj || null,
26472648
cancel: false,
26482649
event: event || null,
26492650
name: 'open',
2650-
appendTo: Browser.isDevice ? this.mobileTimePopupWrap : document.body
2651+
appendTo: Browser.isDevice ? this.mobileTimePopupWrap : appendToElement
26512652
};
26522653
const eventArgs: PopupEventArgs = this.openPopupEventArgs;
26532654
this.trigger('open', eventArgs, (eventArgs: PopupEventArgs) => {
@@ -2775,6 +2776,16 @@ export class TimePicker extends Component<HTMLElement> implements IInput {
27752776
protected getModuleName(): string {
27762777
return 'timepicker';
27772778
}
2779+
protected getAppendToElement(): HTMLElement {
2780+
if (this.isAngular) {
2781+
const cdkPane: HTMLElement = this.element.closest('.cdk-overlay-pane') as HTMLElement;
2782+
const popoverEl: HTMLElement = this.element.closest('[popover]') as HTMLElement;
2783+
if (cdkPane && popoverEl) {
2784+
return cdkPane;
2785+
}
2786+
}
2787+
return document.body;
2788+
}
27782789
private updateFloatLabelOverflowWidth(): void {
27792790
const container: HTMLElement = this.inputWrapper.container;
27802791
const label: HTMLElement = container.querySelector('.e-float-text.e-label-bottom');

‎controls/calendars/styles/datepicker/_material3-dark-definition.scss‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
@use 'ej2-base/styles/definition/material3-dark' as *;
22
@forward 'ej2-base/styles/definition/material3-dark';
3+
$datepicker-modal-header-bg-color: $flyout-bg-color !default;
4+
$datepicker-modal-header-text-color: rgba($content-text-color) !default;
35
$datepicker-icon-color: rgba($icon-color) !default;
46
$datepicker-active-icon-color: rgba($content-text-color-alt1) !default;
57
$datepicker-popup-box-shadow: $shadow-lg !default;
@@ -29,8 +31,8 @@ $datepicker-icon-border-radius: $radius-full !default;
2931
$datepicker-popup-border-radius: $radius-8 !default;
3032
$datepicker-box-sizing: border-box !default;
3133
$datepicker-othermonth-row: none !default;
32-
$datepicker-modal-header-bg: $flyout-bg-color !default;
33-
$datepicker-modal-header-color: rgba($content-text-color) !default;
34+
$datepicker-modal-header-bg: $datepicker-modal-header-bg-color !default;
35+
$datepicker-modal-header-color: $datepicker-modal-header-text-color !default;
3436
$datepicker-modal-header-display: block !default;
3537
$datepicker-calendar-tbody-landscape-height: 130px !default;
3638
$datepicker-clearicon: '\e7e7' !default;

0 commit comments

Comments
 (0)