v22.2.12 is released

Author: pipeline

controls/base/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ## [Unreleased]
 
+## 22.2.12 (2023-09-05)
+
+### Common
+
+#### Bug Fixes
+
+- Resolved the issue with offline material theme have google fonts.
+
 ## 22.2.10 (2023-08-22)
 
 ### Common

controls/base/styles/_material-dark-definition.scss

@@ -3,7 +3,7 @@
 
 @if not variable-exists('is-roboto-loaded') {
   //sass-lint:disable no-url-protocols,no-url-domains
-  @import url('https://fonts.googleapis.com/css?family=Roboto:400,500');// stylelint-disable-line no-invalid-position-at-import-rule
+  @import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700');// stylelint-disable-line no-invalid-position-at-import-rule
 }
 
 $is-roboto-loaded: 'true' !default;

controls/calendars/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 ## [Unreleased]
 
+## 22.2.12 (2023-09-05)
+
+### DatePicker
+
+#### Bug Fixes
+
+- `#I491906` - Fixed an issue where the values were not being cleared or changed while the popup was open and the user focus out.
+
+### DateRangePicker
+
+#### Bug Fixes
+
+- `#I491906` - Fixed an issue where the values were not being cleared or changed while the popup was open and the user focus out.
+
+### DateTimePicker
+
+#### Bug Fixes
+
+- `#I491906` - Fixed an issue where the values were not being cleared or changed while the popup was open and the user focus out.
+
 ## 22.2.11 (2023-08-29)
 
 ### DateRangePicker

controls/calendars/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-calendars",
-	"version": "22.2.10",
+	"version": "22.2.11",
 	"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.",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/calendars/src/datepicker/datepicker.ts

@@ -95,6 +95,7 @@ export class DatePicker extends Calendar implements IInput {
     protected touchStart: boolean;
     protected iconRight: boolean;
     protected isBlur: boolean = false;
+    private isKeyAction: boolean = false;
     /**
      * Specifies the width of the DatePicker component.
      *
@@ -773,6 +774,7 @@ export class DatePicker extends Calendar implements IInput {
         EventHandler.add(this.inputElement, 'mouseup', this.mouseUpHandler, this);
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
+        EventHandler.add(this.inputElement, 'keyup', this.keyupHandler, this);
         if (this.enableMask){
             EventHandler.add(this.inputElement, 'keydown', this.keydownHandler, this);
         }
@@ -832,6 +834,7 @@ export class DatePicker extends Calendar implements IInput {
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
         EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);
         EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);
+        EventHandler.remove(this.inputElement, 'keyup', this.keyupHandler);
         if (this.enableMask){
             EventHandler.remove(this.inputElement, 'keydown', this.keydownHandler);
         }
@@ -1523,13 +1526,17 @@ export class DatePicker extends Calendar implements IInput {
                 this.isInteracted = true;
             }
         }
+        this.isKeyAction = false;
     }
 
     protected navigatedEvent(): void {
         this.trigger('navigated', this.navigatedArgs);
     }
+    protected keyupHandler(e: KeyboardEventArgs): void {
+        this.isKeyAction = (this.inputElement.value !== this.previousElementValue) ? true : false;
+    }
     protected changeEvent(event?: MouseEvent | KeyboardEvent | Event): void {
-        if (!this.isIconClicked && !this.isBlur) {
+        if (!this.isIconClicked && !(this.isBlur || this.isKeyAction)) {
             this.selectCalendar(event);
         }
         if (((this.previousDate && this.previousDate.valueOf()) !== (this.value && this.value.valueOf()))) {
@@ -1549,6 +1556,7 @@ export class DatePicker extends Calendar implements IInput {
         else if (event) {
             this.hide(event);
         }
+        this.isKeyAction = false;
     }
 
     public requiredModules(): ModuleDeclaration[] {

controls/calendars/src/daterangepicker/daterangepicker.ts

@@ -256,6 +256,7 @@ export class DateRangePicker extends CalendarBase {
     protected touchRangeModule: Touch;
     protected touchRangeStart: boolean;
     protected iconRangeRight: string;
+    private isKeyPressed: boolean = false;
 
     /**
      * Gets or sets the start and end date of the Calendar.
@@ -1060,6 +1061,7 @@ export class DateRangePicker extends CalendarBase {
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
         EventHandler.add(this.inputElement, 'change', this.inputChangeHandler, this);
+        EventHandler.add(this.inputElement, 'keyup', this.keyupHandler, this);
         if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.add(this.inputWrapper.clearButton, 'mousedown', this.resetHandler, this);
         }
@@ -1087,6 +1089,7 @@ export class DateRangePicker extends CalendarBase {
         EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
         EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);
+        EventHandler.remove(this.inputElement, 'keyup', this.keyupHandler);
         if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.remove(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler);
         }
@@ -3236,6 +3239,9 @@ export class DateRangePicker extends CalendarBase {
             this.startButton.element.classList.add(ACTIVE);
         }
     }
+    private keyupHandler(e: KeyboardEventArgs): void {
+        this.isKeyPressed = (this.inputElement.value !== this.previousEleValue) ? true : false;
+    }
     private applyFunction(eve?: MouseEvent | KeyboardEventArgs): void {
         let isValueChanged: boolean = false;
         if (eve.type !== 'touchstart') {
@@ -3261,7 +3267,10 @@ export class DateRangePicker extends CalendarBase {
             this.previousStartValue = new Date(+this.startValue);
             this.previousEndValue = new Date(+this.endValue);
             this.previousEleValue = this.inputElement.value;
-            Input.setValue(this.rangeArgs(eve).text, this.inputElement, this.floatLabelType, this.showClearButton);
+            if(!this.isKeyPressed){
+                Input.setValue(this.rangeArgs(eve).text, this.inputElement, this.floatLabelType, this.showClearButton);
+            }
+            this.isKeyPressed = false;
             if (+this.initStartDate !== +this.startValue || +this.initEndDate !== +this.endValue) {
                 isValueChanged = true;
             }

controls/calendars/src/timepicker/timepicker.ts

@@ -1422,7 +1422,7 @@ export class TimePicker extends Component<HTMLElement> implements IInput {
     }
     private inputHandler(event: KeyboardEventArgs): void {
         if (!this.readonly && this.enabled) {
-            if (!((event.action == 'right' || event.action == 'left' || event.action == 'tab') || ((event.action == 'home' || event.action == 'end') && !this.isPopupOpen()))) {
+            if (!((event.action == 'right' || event.action == 'left' || event.action == 'tab') || ((event.action == 'home' || event.action == 'end'  || event.action == 'up' || event.action == 'down') && !this.isPopupOpen() && !this.enableMask))) {
                 event.preventDefault();
             }
             switch (event.action) {
@@ -2212,7 +2212,9 @@ export class TimePicker extends Component<HTMLElement> implements IInput {
         this.isNavigate = true;
         this.setHover(this.selectedElement, NAVIGATION);
         this.setActiveDescendant();
-        this.selectInputText();
+        if (this.enableMask) {
+            this.selectInputText();
+        }
         if (this.isPopupOpen() && this.selectedElement !== null && (!event || event.type !== 'click')) { this.setScrollPosition(); }
     }
     protected getCultureTimeObject(ld: Object, c: string): Object {

controls/charts/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ## [Unreleased]
 
+## 22.2.12 (2023-09-05)
+
+### Chart
+
+#### Bug Fixes
+
+- `#F184251` - Fixed an issue in axis label position when label position set to inside for bar series.
+
 ## 22.2.11 (2023-08-29)
 
 ### Accumulation chart

controls/charts/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-charts",
-	"version": "22.2.10",
+	"version": "22.2.11",
 	"description": "Feature-rich chart control with built-in support for over 25 chart types, technical indictors, trendline, zooming, tooltip, selection, crosshair and trackball.",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/charts/src/chart/axis/cartesian-panel.ts

@@ -873,15 +873,15 @@ export class CartesianAxisLayoutPanel {
             pointY = (valueToCoefficient(axis.visibleLabels[i as number].value, axis) * rect.height) + (chart.stockChart ? 7 : 0);
             pointY = Math.floor((pointY * -1) + (rect.y + rect.height));
             textHeight = ((elementSize.height / 8) * axis.visibleLabels[i as number].text.length / 2);
-            textPadding = ((elementSize.height / 4) * 3) + 3;
+            textPadding = chart.requireInvertedAxis ? 0 : ((elementSize.height / 4) * 3) + 3;
             intervalLength = rect.height / axis.visibleLabels.length;
             labelHeight = ((axis.labelIntersectAction === 'Trim' || axis.labelIntersectAction === 'Wrap') && angle !== 0 &&
                 elementSize.width > intervalLength) ? intervalLength : elementSize.width;
             pointY = (isAxisBreakLabel ? (axis.labelPosition === 'Inside' ? (pointY - (elementSize.height / 2) - textHeight + textPadding)
                 : (pointY - textHeight)) : (axis.labelPosition === 'Inside' ? pointY + textPadding :  pointY));
             if (axis.labelPosition === 'Inside' && ((i === 0 && !axis.isInversed) || (i === len - 1 && axis.isInversed))) {
                 if (chart.stockChart) { pointY -= (textPadding); }
-                else { pointY -= (textPadding - (axis.opposedPosition ? -padding : padding)); }
+                else { pointY -= (textPadding - (chart.requireInvertedAxis ? 0 : (axis.opposedPosition ? -padding : padding))); }
             }
             if (axis.majorGridLines.width > axis.majorTickLines.width) {
                 maxLineWidth = axis.majorGridLines.width;