v20.4.42 is released

Author: pipeline

controls/base/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ## [Unreleased]
 
+## 20.4.42 (2023-01-04)
+
+### Common
+
+#### Bug Fixes
+
+- `I427250` - Resolved window undefined in server side rendering with React next JS.
+
 ## 20.4.38 (2022-12-21)
 
 ### Common

controls/base/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-base",
-	"version": "20.4.38",
+	"version": "20.4.40",
 	"description": "A common package of Essential JS 2 base libraries, methods and class definitions",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/base/spec/intl/date-parser.spec.ts

@@ -867,7 +867,7 @@ describe('DateParser', () => {
             });
             it('year only format input returns correct year value',()=>{
                 let tFormatter: Date = DateParser.dateParser('en', { format:'yy',calendar:'islamic' }, cldrData)('40');
-                let iFormatter: Date = DateParser.dateParser('en', { format:'y',calendar:'islamic' }, cldrData)('1443');
+                let iFormatter: Date = DateParser.dateParser('en', { format:'y',calendar:'islamic' }, cldrData)('1444');
                 expect(iFormatter.getFullYear()).toBe(new Date().getFullYear());
             });
             it('full  skeletom eleton returns proper value',()=>{

controls/base/src/browser.ts

@@ -146,8 +146,8 @@ export class Browser {
      */
 
     private static getValue(key: string, regX: RegExp): Object {
-        const browserDetails: {} = window.browserDetails;
-        if (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1 && Browser.isTouch === true) {
+        const browserDetails: {} = typeof window !== 'undefined' ? window.browserDetails : {};
+        if (typeof navigator !== 'undefined' && navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1 && Browser.isTouch === true) {
             browserDetails['isIos'] = true;
             browserDetails['isDevice'] = true;
             browserDetails['isTouch'] = true;

controls/base/src/component.ts

@@ -313,7 +313,7 @@ export abstract class Component<ElementType extends HTMLElement> extends Base<El
         // tslint:disable-next-line:no-function-constructor-with-string-args
         onIntlChange.on('notifyExternalChange', this.detectFunction, this, this.randomId);
         // Based on the considered control list we have count the instance
-        if (!validateLicense()) {
+        if (typeof window !== "undefined" && typeof document !== "undefined" && !validateLicense()) {
             if (componentList.indexOf(this.getModuleName()) !== -1) {
                 instancecount = instancecount + 1;
                 if (instancecount > 5) {

controls/buttons/CHANGELOG.md

@@ -2,14 +2,22 @@
 
 ## [Unreleased]
 
-## 20.4.40 (2022-12-28)
+## 20.4.42 (2023-01-04)
+
+### Checkbox
+
+#### Bug Fixes
+
+- `#I427235` - The issue `cssClass` property not updated properly while string with a white space in the end of the property in checkbox has been fixed.
 
 ### Chips
 
 #### Bug Fixes
 
 - `#I422262` - Added the aria-disabled attribute to the disabled Chip items.
 
+## 20.4.40 (2022-12-28)
+
 ## 20.3.47 (2022-09-29)
 
 ### Floating Action Button `Preview`

controls/buttons/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-buttons",
-	"version": "18.46.0",
+	"version": "20.4.40",
 	"description": "A package of feature-rich Essential JS 2 components such as Button, CheckBox, RadioButton and Switch.",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/buttons/src/button/button.ts

@@ -171,7 +171,7 @@ export class Button extends Component<HTMLButtonElement> implements INotifyPrope
 
     private initialize(): void {
         if (this.cssClass) {
-            addClass([this.element], this.cssClass.split(' '));
+            addClass([this.element], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
         if (this.isPrimary) {
             this.element.classList.add(cssClassName.PRIMARY);
@@ -355,7 +355,7 @@ export class Button extends Component<HTMLButtonElement> implements INotifyPrope
                     removeClass([this.element], oldProp.cssClass.split(' '));
                 }
                 if (newProp.cssClass) {
-                    addClass([this.element], newProp.cssClass.split(' '));
+                    addClass([this.element], newProp.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                 }
                 break;
             case 'enableRtl':

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

@@ -351,7 +351,7 @@ export class CheckBox extends Component<HTMLInputElement> implements INotifyProp
             wrapper.classList.add(RTL);
         }
         if (this.cssClass) {
-            addClass([wrapper], this.cssClass.split(' '));
+            addClass([wrapper], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
         wrapper.appendChild(label);
         label.appendChild(this.element);
@@ -438,7 +438,7 @@ export class CheckBox extends Component<HTMLInputElement> implements INotifyProp
                     removeClass([wrapper], oldProp.cssClass.split(' '));
                 }
                 if (newProp.cssClass) {
-                    addClass([wrapper], newProp.cssClass.split(' '));
+                    addClass([wrapper], newProp.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                 }
                 break;
             case 'enableRtl':

controls/buttons/src/chips/chip-list.ts

@@ -451,7 +451,7 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
 
     private setAttributes(): void {
         if (this.type === 'chip') {
-            this.enabled ? this.element.tabIndex = 0 : this.element.setAttribute('aria-disabled', 'true');
+            if(this.enabled) this.element.tabIndex = 0;
             this.element.setAttribute('role', 'option');
         } else {
             this.element.classList.add(classNames.chipSet);
@@ -497,8 +497,10 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
                 if (fieldsData.value) {
                     wrapper.setAttribute('data-value', fieldsData.value.toString());
                 }
-                if (!fieldsData.enabled) {
+                if (fieldsData.enabled) { wrapper.setAttribute('aria-disabled', 'false'); }
+                else {
                     wrapper.removeAttribute('tabindex');
+                    wrapper.setAttribute('aria-disabled', 'true');
                 }
                 append(chipArray, wrapper);
                 chipListArray.push(wrapper);
@@ -570,9 +572,11 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
     /**
      * A function that finds chip based on given input.
      *
-     * @param  {number | HTMLElement } fields - We can pass index number or element of chip.
      * {% codeBlock src='chips/find/index.md' %}{% endcodeBlock %}
      * 
+     * @param  {number | HTMLElement } fields - We can pass index number or element of chip.
+     * 
+     * @returns {void}
      */
 
     public find(fields: number | HTMLElement): ChipDataArgs {
@@ -595,10 +599,12 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
     /**
      * Allows adding the chip item(s) by passing a single or array of string, number, or ChipModel values.
      *
+     * {% codeBlock src='chips/add/index.md' %}{% endcodeBlock %}
+     * 
      * @param  {string[] | number[] | ChipModel[] | string | number | ChipModel} chipsData - We can pass array of string or
      *  array of number or array of chip model or string data or number data or chip model.
-     * {% codeBlock src='chips/add/index.md' %}{% endcodeBlock %}
      * 
+     * @returns {void}
      * @deprecated
      */
 
@@ -614,10 +620,12 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
     /**
      * Allows selecting the chip item(s) by passing a single or array of string, number, or ChipModel values.
      *
+     * {% codeBlock src='chips/select/index.md' %}{% endcodeBlock %}
+     * 
      * @param  {number | number[] | HTMLElement | HTMLElement[]} fields - We can pass number or array of number
      *  or chip element or array of chip element.
-     * {% codeBlock src='chips/select/index.md' %}{% endcodeBlock %}
      * 
+     * @returns {void}
      */
 
     public select(fields: number | number[] | HTMLElement | HTMLElement[] | string[], selectionType?: selectionType): void {
@@ -686,10 +694,12 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
     /**
      * Allows removing the chip item(s) by passing a single or array of string, number, or ChipModel values.
      *
+     * {% codeBlock src='chips/remove/index.md' %}{% endcodeBlock %}
+     * 
      * @param  {number | number[] | HTMLElement | HTMLElement[]} fields - We can pass number or array of number
      *  or chip element or array of chip element.
-     * {% codeBlock src='chips/remove/index.md' %}{% endcodeBlock %}
      * 
+     * @returns {void}
      */
 
     public remove(fields: number | number[] | HTMLElement | HTMLElement[]): void {
@@ -714,8 +724,10 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
 
     /**
      * Returns the selected chip(s) data.
+     * 
      * {% codeBlock src='chips/getSelectedChips/index.md' %}{% endcodeBlock %}
      * 
+     * @returns {void}
      */
 
     public getSelectedChips(): SelectedItem | SelectedItems {
@@ -906,8 +918,10 @@ export class ChipList extends Component<HTMLElement> implements INotifyPropertyC
 
     /**
      * Removes the component from the DOM and detaches all its related event handlers. Also, it removes the attributes and classes.
+     * 
      * {% codeBlock src='chips/destroy/index.md' %}{% endcodeBlock %}
      * 
+     * @returns {void}
      */
 
     public destroy(): void {

controls/buttons/src/radio-button/radio-button.ts

@@ -302,7 +302,7 @@ export class RadioButton extends Component<HTMLInputElement> implements INotifyP
             label.classList.add(RTL);
         }
         if (this.cssClass) {
-            addClass([wrapper], this.cssClass.split(' '));
+            addClass([wrapper], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
         if (this.label) {
             this.setText(this.label);
@@ -360,7 +360,7 @@ export class RadioButton extends Component<HTMLInputElement> implements INotifyP
                     removeClass([wrap], oldProp.cssClass.split(' '));
                 }
                 if (newProp.cssClass) {
-                    addClass([wrap], newProp.cssClass.split(' '));
+                    addClass([wrap], newProp.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                 }
                 break;
             case 'enableRtl':
@@ -462,7 +462,7 @@ export class RadioButton extends Component<HTMLInputElement> implements INotifyP
                 if (ATTRIBUTES.indexOf(key) > -1) {
                     const wrapper: Element = this.element.parentElement;
                     if (key === 'class') {
-                        addClass([wrapper], this.htmlAttributes[`${key}`].split(' '));
+                        addClass([wrapper], this.htmlAttributes[`${key}`].replace(/\s+/g, ' ').trim().split(' '));
                     } else if (key === 'title' || key === 'style') {
                         wrapper.setAttribute(key, this.htmlAttributes[`${key}`]);
                     } else {

controls/buttons/src/switch/switch.ts

@@ -243,7 +243,7 @@ export class Switch extends Component<HTMLInputElement> implements INotifyProper
             wrapper.classList.add(RTL);
         }
         if (this.cssClass) {
-            addClass([wrapper], this.cssClass.split(' '));
+            addClass([wrapper], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
     }
     /**
@@ -298,7 +298,7 @@ export class Switch extends Component<HTMLInputElement> implements INotifyProper
                     removeClass([wrapper], oldProp.cssClass.split(' '));
                 }
                 if (newProp.cssClass) {
-                    addClass([wrapper], newProp.cssClass.split(' '));
+                    addClass([wrapper], newProp.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                 }
                 break;
             }

controls/calendars/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-calendars",
-	"version": "18.30.7",
+	"version": "20.4.40",
 	"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/daterangepicker/daterangepicker.ts

@@ -1355,7 +1355,7 @@ export class DateRangePicker extends CalendarBase {
         this.createControl();
         this.bindCalendarEvents();
         this.updateRange((this.isMobile ? [this.calendarElement] : [this.leftCalendar, this.rightCalendar]));
-        if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue)) {
+        if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue) && !isNullOrUndefined(this.renderDayCell)) {
             this.disabledDateRender();
         }
         this.updateHeader();
@@ -2316,7 +2316,9 @@ export class DateRangePicker extends CalendarBase {
                 if (!this.isMobile) {
                     this.removeClassDisabled();
                 }
+                if (!isNullOrUndefined(this.renderDayCell)) {
                 this.disabledDateRender();
+                }
                 this.trigger('select', this.rangeArgs(event));
             } else if (+date < +this.startValue) {
                 this.removeClassDisabled();
@@ -3858,7 +3860,7 @@ export class DateRangePicker extends CalendarBase {
             this.clearRange();
 
         }
-        if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue) && !isDisabled) {
+        if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue) && !isDisabled && !isNullOrUndefined(this.renderDayCell)) {
             this.disabledDateRender();
         }
         this.errorClass();
@@ -4329,7 +4331,9 @@ export class DateRangePicker extends CalendarBase {
         if (!isNullOrUndefined(this.startValue) && !isNullOrUndefined(this.endValue)) {
             range = (Math.round(Math.abs((this.removeTimeValueFromDate(this.startValue).getTime() -
             this.removeTimeValueFromDate(this.endValue).getTime()) / (1000 * 60 * 60 * 24))) + 1);
-            this.disabledDateRender();
+            if (!isNullOrUndefined(this.renderDayCell)) {
+                this.disabledDateRender();
+            }
             if (!isNullOrUndefined(this.disabledDayCnt)) {
                 range = range - this.disabledDayCnt;
                 this.disabledDayCnt = null;

controls/calendars/themestudio/styles/documenteditor/document-editor/_theme.scss

@@ -3,6 +3,19 @@
     .e-de-background {
         background-color: $de-background;
     }
+    .e-de-column-label {
+        font-size: $de-border-dlg-settinglabels-fontsize;
+        font-weight: $de-border-dlg-border-label-fontweight;
+        padding-left: 20px;
+        padding-right: 20px;
+    }
+    
+    .e-de-column-label.e-de-rtl {
+        font-size: $de-border-dlg-settinglabels-fontsize;
+        font-weight: $de-border-dlg-border-label-fontweight;
+        padding-left: 50px;
+        padding-right: 50px;
+    }
     .e-de-ff-sub-header {
         display: block;
         font-size: 12px;

controls/calendars/themestudio/styles/documenteditor/document-editor/icons/_bootstrap-dark.scss

@@ -651,16 +651,4 @@
   .e-de-preset-container.e-de-rtl {
     width: 85px;
   }
-
-  .e-column-label {
-    margin-left: 0;
-    padding-left: 20px;
-    padding-right: 20px;
-  }
-
-  .e-column-label.e-de-rtl {
-    margin-right: 0;
-    padding-left: 50px;
-    padding-right: 50px;
-  }
 }

controls/calendars/themestudio/styles/documenteditor/document-editor/icons/_bootstrap.scss

@@ -651,16 +651,4 @@
   .e-de-preset-container.e-de-rtl {
     width: 85px;
   }
-
-  .e-column-label {
-    margin-left: 0;
-    padding-left: 20px;
-    padding-right: 20px;
-  }
-
-  .e-column-label.e-de-rtl {
-    margin-right: 0;
-    padding-left: 50px;
-    padding-right: 50px;
-  }
 }

controls/calendars/themestudio/styles/documenteditor/document-editor/icons/_bootstrap4.scss

@@ -636,16 +636,4 @@
   .e-de-preset-container.e-de-rtl {
     width: 85px;
   }
-
-  .e-column-label {
-    margin-left: 0;
-    padding-left: 20px;
-    padding-right: 20px;
-  }
-
-  .e-column-label.e-de-rtl {
-    margin-right: 0;
-    padding-left: 50px;
-    padding-right: 50px;
-  }
 }

controls/calendars/themestudio/styles/documenteditor/document-editor/icons/_bootstrap5.scss

@@ -686,16 +686,4 @@
   .e-de-preset-container.e-de-rtl {
     width: 85px;
   }
-
-  .e-column-label {
-    margin-left: 0;
-    padding-left: 20px;
-    padding-right: 20px;
-  }
-
-  .e-column-label.e-de-rtl {
-    margin-right: 0;
-    padding-left: 50px;
-    padding-right: 50px;
-  }
 }