Skip to content

Commit 9d84c0a

Browse files
author
pipeline
committed
v27.1.51 is released
1 parent 9596931 commit 9d84c0a

File tree

560 files changed

+55901
-486
lines changed

Some content is hidden

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

560 files changed

+55901
-486
lines changed

controls/barcodegenerator/CHANGELOG.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
## [Unreleased]
44

5-
## 27.1.50 (2024-09-24)
5+
## 27.1.51 (2024-09-30)
66

77
### Barcode
88

controls/buttons/CHANGELOG.md

+14
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,20 @@
22

33
## [Unreleased]
44

5+
## 27.1.51 (2024-09-30)
6+
7+
### Checkbox
8+
9+
#### Bug Fixes
10+
11+
- `#I909049` - The issue with "Need to set the aria-label attribute for the checkbox input element and not to the wrapper element" has been resolved.
12+
13+
### RadioButton
14+
15+
#### Bug Fixes
16+
17+
- The issue with "Background color issue for disabled unselect radio button in bootstrap5 theme" has been resolved.
18+
519
## 26.1.35 (2024-06-11)
620

721
### Floating Action Button

controls/buttons/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-buttons",
3-
"version": "18.64.1",
3+
"version": "27.1.50",
44
"description": "A package of feature-rich Essential JS 2 components such as Button, CheckBox, RadioButton and Switch.",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

controls/buttons/spec/check-box.spec.ts

+5
Original file line numberDiff line numberDiff line change
@@ -555,6 +555,11 @@ describe('CheckBox', () => {
555555
expect(element.parentElement.parentElement.getAttribute("data-containerid").indexOf("error-agreement")).toEqual(0);
556556
expect(element.parentElement.parentElement.getAttribute("test").indexOf("test")).toEqual(0);
557557
});
558+
559+
it('EJ2-909049 - Need to set the aria-label attribute for the checkbox input element and not to the wrapper element in core.', function () {
560+
checkbox = new CheckBox({ htmlAttributes: { 'aria-label': 'checkbox aria label' } }, '#checkbox');
561+
expect(checkbox.element.ariaLabel).toContain('checkbox aria label');
562+
});
558563

559564
});
560565

controls/buttons/src/check-box/check-box.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ const RIPPLECHECK: string = 'e-ripple-check';
2222
const RIPPLEINDETERMINATE: string = 'e-ripple-stop';
2323
const RTL: string = 'e-rtl';
2424
const WRAPPER: string = 'e-checkbox-wrapper';
25-
const containerAttr: string[] = ['title', 'class', 'style', 'disabled', 'readonly', 'name', 'value', 'id', 'tabindex'];
25+
const containerAttr: string[] = ['title', 'class', 'style', 'disabled', 'readonly', 'name', 'value', 'id', 'tabindex', 'aria-label'];
2626

2727
/**
2828
* The CheckBox is a graphical user interface element that allows you to select one or more options from the choices.

controls/buttons/styles/check-box/_theme.scss

+7
Original file line numberDiff line numberDiff line change
@@ -212,6 +212,13 @@
212212
}
213213
}
214214
}
215+
216+
&:hover .e-checkbox:focus + .e-frame.e-check {
217+
@if $theme-name == 'fluent2-highcontrast' {
218+
background-color: $primary-border-color-hover !important; /* stylelint-disable-line declaration-no-important */
219+
border-color: $primary-border-color-hover !important; /* stylelint-disable-line declaration-no-important */
220+
}
221+
}
215222
}
216223
}
217224
}

controls/buttons/styles/chips/_fluent2-definition.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -529,7 +529,7 @@ $chip-outline-warning-avatar-pressed-bg-color: $chip-outline-warning-pressed-bg-
529529
$chip-outline-warning-avatar-disabled-bg-color: $chip-outline-warning-disabled-bg-color !default;
530530
$chip-outline-warning-font-color: $warning-bg-color !default;
531531
$chip-outline-warning-hover-font-color: $warning-bg-color-hover !default;
532-
$chip-outline-warning-focus-font-color: $success-text !default;
532+
$chip-outline-warning-focus-font-color: $warning-bg-color-hover !default;
533533
$chip-outline-warning-active-font-color: $warning-bg-color-selected !default;
534534
$chip-outline-warning-focus-active-font-color: $warning-bg-color-focus !default;
535535
$chip-outline-warning-pressed-font-color: $warning-bg-color-pressed !default;

controls/buttons/styles/radio-button/_bds-definition.scss

+1
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,7 @@ $radio-btn-check-transition: none !default;
5454
$radio-btn-disabled-border-color: $border !default;
5555
$radio-btn-disabled-checked-border-color: transparent !default;
5656
$radio-btn-disabled-background-color: $content-bg-color-alt3 !default;
57+
$radio-btn-disabled-not-checked-bg-color: transparent !default;
5758
$radio-btn-disabled-color: $border !default;
5859
$radio-btn-disabled-checked-color: $content-text-color-disabled !default;
5960
$radio-btn-font-color: $content-text-color !default;

controls/buttons/styles/radio-button/_bootstrap4-definition.scss

+1
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ $radio-btn-check-transition: none !default;
2121
$radio-btn-disabled-border-color: $gray-500 !default;
2222
$radio-btn-disabled-checked-border-color: transparent !default;
2323
$radio-btn-disabled-background-color: rgba($primary, .5) !default;
24+
$radio-btn-disabled-not-checked-bg-color: transparent !default;
2425
$radio-btn-disabled-color: $gray-200 !default;
2526
$radio-btn-disabled-checked-color: $white !default;
2627
$radio-btn-font-color: $gray-900 !default;

controls/buttons/styles/radio-button/_bootstrap5-definition.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ $radio-btn-check-transition: none !default;
5454
$radio-btn-disabled-border-color: $border-light !default;
5555
$radio-btn-disabled-checked-border-color: transparent !default;
5656
$radio-btn-disabled-background-color: $primary-light !default;
57-
$radio-btn-disabled-not-checked-bg-color: $primary-light !default;
57+
$radio-btn-disabled-not-checked-bg-color: transparent !default;
5858
$radio-btn-disabled-color: $content-text-color-disabled !default;
5959
$radio-btn-disabled-checked-color: $primary-text-color !default;
6060
$radio-btn-font-color: $content-text-color !default;

controls/buttons/styles/radio-button/_tailwind-definition.scss

+1
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,7 @@ $radio-btn-check-transition: none !default;
5454
$radio-btn-disabled-border-color: $border-light !default;
5555
$radio-btn-disabled-checked-border-color: transparent !default;
5656
$radio-btn-disabled-background-color: $primary-light !default;
57+
$radio-btn-disabled-not-checked-bg-color: transparent !default;
5758
$radio-btn-disabled-color: $content-text-color-disabled !default;
5859
$radio-btn-disabled-checked-color: $primary-text-color !default;
5960
$radio-btn-font-color: $content-text-color !default;

controls/buttons/styles/radio-button/_theme.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@
144144
}
145145

146146
&::before {
147-
@if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
147+
@if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
148148
background-color: $radio-btn-disabled-not-checked-bg-color;
149149
}
150150
@else {

controls/calendars/CHANGELOG.md

+8
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,14 @@
22

33
## [Unreleased]
44

5+
## 27.1.51 (2024-09-30)
6+
7+
### DateTimePicker
8+
9+
#### Bug Fixes
10+
11+
- `#I628891` - Resolved the issue where the "DateTimePicker Mask" was not functioning correctly after deletion using the keyboard.
12+
513
## 27.1.50 (2024-09-24)
614

715
### DatePicker

controls/calendars/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-calendars",
3-
"version": "18.32.5",
3+
"version": "27.1.50",
44
"description": "A complete package of date or time components with built-in features such as date formatting, inline editing, multiple (range) selection, range restriction, month and year selection, strict mode, and globalization.",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

controls/calendars/spec/datetimepicker/datetimepicker.spec.ts

+201
Original file line numberDiff line numberDiff line change
@@ -4413,6 +4413,207 @@ describe('Masked date time code coverage improvements ', () => {
44134413
datetimepicker.destroy();
44144414
});
44154415
});
4416+
describe('Masked date time backspace with day ', () => {
4417+
let mouseEventArgs: any = {
4418+
preventDefault: function () { },
4419+
stopPropagation: (): void => { /** NO Code */ },
4420+
target: null,
4421+
e: {
4422+
key: "ARROWLEFT"
4423+
},
4424+
};
4425+
let date: DateTimePicker;
4426+
let datetimepicker: any;
4427+
beforeEach(() => {
4428+
let ele: HTMLElement = createElement('input', { id: 'date' });
4429+
document.body.appendChild(ele);
4430+
4431+
});
4432+
afterEach(() => {
4433+
if (date) {
4434+
date.destroy();
4435+
}
4436+
document.body.innerHTML = '';
4437+
});
4438+
it('backspace action for day', () => {
4439+
datetimepicker = new DateTimePicker({
4440+
format: 'dd/MM/yyyy hh:mm a',
4441+
enableMask: true,
4442+
});
4443+
let mask : MaskedDateTime = new MaskedDateTime(datetimepicker);
4444+
(<any>mask).parent = datetimepicker;
4445+
datetimepicker.appendTo('#date');
4446+
(<any>mask).createMask();
4447+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4448+
datetimepicker.inputHandler();
4449+
datetimepicker.element.value = '01/month/year hour:minute AM';
4450+
datetimepicker.element.selectionStart = 0;
4451+
mouseEventArgs.e.key = 'Backspace';
4452+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4453+
datetimepicker.destroy();
4454+
});
4455+
});
4456+
describe('Masked date time backspace with month ', () => {
4457+
let mouseEventArgs: any = {
4458+
preventDefault: function () { },
4459+
stopPropagation: (): void => { /** NO Code */ },
4460+
target: null,
4461+
e: {
4462+
key: "ARROWLEFT"
4463+
},
4464+
};
4465+
let date: DateTimePicker;
4466+
let datetimepicker: any;
4467+
beforeEach(() => {
4468+
let ele: HTMLElement = createElement('input', { id: 'date' });
4469+
document.body.appendChild(ele);
4470+
4471+
});
4472+
afterEach(() => {
4473+
if (date) {
4474+
date.destroy();
4475+
}
4476+
document.body.innerHTML = '';
4477+
});
4478+
it('backspace action for month', () => {
4479+
datetimepicker = new DateTimePicker({
4480+
format: 'MM/dd/yyyy hh:mm a',
4481+
enableMask: true,
4482+
});
4483+
let mask : MaskedDateTime = new MaskedDateTime(datetimepicker);
4484+
(<any>mask).parent = datetimepicker;
4485+
datetimepicker.appendTo('#date');
4486+
(<any>mask).createMask();
4487+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4488+
datetimepicker.inputHandler();
4489+
datetimepicker.element.value = '01/day/year hour:minute AM';
4490+
datetimepicker.element.selectionStart = 0;
4491+
mouseEventArgs.e.key = 'Backspace';
4492+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4493+
datetimepicker.destroy();
4494+
});
4495+
});
4496+
describe('Masked date time backspace with minute ', () => {
4497+
let mouseEventArgs: any = {
4498+
preventDefault: function () { },
4499+
stopPropagation: (): void => { /** NO Code */ },
4500+
target: null,
4501+
e: {
4502+
key: "ARROWLEFT"
4503+
},
4504+
};
4505+
let date: DateTimePicker;
4506+
let datetimepicker: any;
4507+
beforeEach(() => {
4508+
let ele: HTMLElement = createElement('input', { id: 'date' });
4509+
document.body.appendChild(ele);
4510+
4511+
});
4512+
afterEach(() => {
4513+
if (date) {
4514+
date.destroy();
4515+
}
4516+
document.body.innerHTML = '';
4517+
});
4518+
it('backspace action for minute', () => {
4519+
datetimepicker = new DateTimePicker({
4520+
format: 'mm:hh a MM/dd/yyyy',
4521+
enableMask: true,
4522+
});
4523+
let mask : MaskedDateTime = new MaskedDateTime(datetimepicker);
4524+
(<any>mask).parent = datetimepicker;
4525+
datetimepicker.appendTo('#date');
4526+
(<any>mask).createMask();
4527+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4528+
datetimepicker.inputHandler();
4529+
datetimepicker.element.value = '01:hour AM 01/month/year';
4530+
datetimepicker.element.selectionStart = 0;
4531+
mouseEventArgs.e.key = 'Backspace';
4532+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4533+
datetimepicker.destroy();
4534+
});
4535+
4536+
});
4537+
describe('Masked date time backspace with second ', () => {
4538+
let mouseEventArgs: any = {
4539+
preventDefault: function () { },
4540+
stopPropagation: (): void => { /** NO Code */ },
4541+
target: null,
4542+
e: {
4543+
key: "ARROWLEFT"
4544+
},
4545+
};
4546+
let date: DateTimePicker;
4547+
let datetimepicker: any;
4548+
beforeEach(() => {
4549+
let ele: HTMLElement = createElement('input', { id: 'date' });
4550+
document.body.appendChild(ele);
4551+
4552+
});
4553+
afterEach(() => {
4554+
if (date) {
4555+
date.destroy();
4556+
}
4557+
document.body.innerHTML = '';
4558+
});
4559+
it('backspace action for second', () => {
4560+
datetimepicker = new DateTimePicker({
4561+
format: 'ss:mm:hh a MM/dd/yyyy',
4562+
enableMask: true,
4563+
});
4564+
let mask : MaskedDateTime = new MaskedDateTime(datetimepicker);
4565+
(<any>mask).parent = datetimepicker;
4566+
datetimepicker.appendTo('#date');
4567+
(<any>mask).createMask();
4568+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4569+
datetimepicker.inputHandler();
4570+
datetimepicker.element.value = '01:minute:hour AM 01/month/year';
4571+
datetimepicker.element.selectionStart = 0;
4572+
mouseEventArgs.e.key = 'Backspace';
4573+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4574+
datetimepicker.destroy();
4575+
});
4576+
});
4577+
describe('Masked date time backspace with hour ', () => {
4578+
let mouseEventArgs: any = {
4579+
preventDefault: function () { },
4580+
stopPropagation: (): void => { /** NO Code */ },
4581+
target: null,
4582+
e: {
4583+
key: "ARROWLEFT"
4584+
},
4585+
};
4586+
let date: DateTimePicker;
4587+
let datetimepicker: any;
4588+
beforeEach(() => {
4589+
let ele: HTMLElement = createElement('input', { id: 'date' });
4590+
document.body.appendChild(ele);
4591+
4592+
});
4593+
afterEach(() => {
4594+
if (date) {
4595+
date.destroy();
4596+
}
4597+
document.body.innerHTML = '';
4598+
});
4599+
it('backspace action for hour', () => {
4600+
datetimepicker = new DateTimePicker({
4601+
format: 'hh:mm a MM/dd/yyyy',
4602+
enableMask: true,
4603+
});
4604+
let mask : MaskedDateTime = new MaskedDateTime(datetimepicker);
4605+
(<any>mask).parent = datetimepicker;
4606+
datetimepicker.appendTo('#date');
4607+
(<any>mask).createMask();
4608+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4609+
datetimepicker.inputHandler();
4610+
datetimepicker.element.value = '01:minute AM 01/month/year';
4611+
datetimepicker.element.selectionStart = 0;
4612+
mouseEventArgs.e.key = 'Backspace';
4613+
(<any>mask).maskKeydownHandler(mouseEventArgs);
4614+
datetimepicker.destroy();
4615+
});
4616+
});
44164617
describe('Time Restriction ', () => {
44174618
let mouseEventArgs: any = {
44184619
preventDefault: function () { },

controls/calendars/src/datepicker/datepicker.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -809,10 +809,11 @@ export class DatePicker extends Calendar implements IInput {
809809
case 'ArrowDown':
810810
case 'Home':
811811
case 'End':
812+
case 'Backspace':
812813
case 'Delete':
813814
if (this.enableMask && !this.popupObj && !this.readonly)
814815
{
815-
if (e.code !== 'Delete')
816+
if (e.code !== 'Delete' && e.code !== 'Backspace')
816817
{
817818
e.preventDefault();
818819
}

0 commit comments

Comments
 (0)