Skip to content

Commit 2b3195f

Browse files
author
pipeline
committed
v20.2.39 is released
1 parent 01c4322 commit 2b3195f

File tree

725 files changed

+4678
-2856
lines changed

Some content is hidden

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

725 files changed

+4678
-2856
lines changed

controls/base/CHANGELOG.md

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

99
#### Bug Fixes
1010

11+
- `#I372767`, `#I370308` - The empty space issue in `Treeview` component while dragging the element has been resolved.
12+
13+
### Common
14+
15+
#### Bug Fixes
16+
1117
- `#I383984` - The issue with the "Unwanted swipe event trigger in Firefox browser" has been resolved.
1218

1319
## 20.2.36 (2022-06-30)

controls/base/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-base",
3-
"version": "20.2.36",
3+
"version": "20.2.38",
44
"description": "A common package of Essential JS 2 base libraries, methods and class definitions",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

controls/base/src/draggable.ts

Lines changed: 60 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -781,23 +781,31 @@ export class Draggable extends Base<HTMLElement> implements INotifyPropertyChang
781781
draEleTop -= this.parentScrollY;
782782
draEleLeft -= this.parentScrollX;
783783
}
784-
if (this.helperElement.classList.contains('e-treeview')) {
785-
let body = document.body;
786-
let html = document.documentElement;
787-
let tempHeight = Math.max( body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight );
788-
let tempWidth = Math.max( body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth );
789-
if (draEleTop > tempHeight) {
790-
draEleTop = tempHeight;
791-
}
792-
if (draEleLeft > tempWidth) {
793-
draEleLeft = tempWidth;
794-
}
795-
}
796784
let dragValue: DragPosition = this.getProcessedPositionValue({ top: draEleTop + 'px', left: draEleLeft + 'px' });
797785
setStyleAttribute(helperElement, this.getDragPosition(dragValue));
798-
if (!this.elementInViewport(helperElement) && this.enableAutoScroll) {
786+
if (!this.elementInViewport(helperElement) && this.enableAutoScroll && !this.helperElement.classList.contains('e-treeview')) {
799787
this.helperElement.scrollIntoView();
800788
}
789+
790+
let elements: NodeList | Element[] = document.querySelectorAll(':hover');
791+
if (this.enableAutoScroll && this.helperElement.classList.contains('e-treeview')) {
792+
if (elements.length === 0) {
793+
elements = this.getPathElements(evt);
794+
}
795+
/* tslint:disable no-any */
796+
let scrollParent: any = this.getScrollParent(elements, false);
797+
if (this.elementInViewport(this.helperElement)) {
798+
this.getScrollPosition(scrollParent, draEleTop);
799+
}
800+
else if (!this.elementInViewport(this.helperElement)) {
801+
elements = [].slice.call(document.querySelectorAll(':hover'));
802+
if (elements.length === 0) {
803+
elements = this.getPathElements(evt);
804+
}
805+
scrollParent = this.getScrollParent(elements, true);
806+
this.getScrollPosition(scrollParent, draEleTop);
807+
}
808+
}
801809
this.dragProcessStarted = true;
802810
this.prevLeft = left;
803811
this.prevTop = top;
@@ -806,6 +814,45 @@ export class Draggable extends Base<HTMLElement> implements INotifyPropertyChang
806814
this.pageX = pagex;
807815
this.pageY = pagey;
808816
}
817+
/* tslint:disable no-any */
818+
private getScrollParent(node: any, reverse: boolean): any {
819+
/* tslint:disable no-any */
820+
const nodeEl: any = reverse ? node.reverse() : node;
821+
let hasScroll: string;
822+
for (let i: number = nodeEl.length - 1; i >= 0; i--) {
823+
hasScroll = window.getComputedStyle(nodeEl[i])['overflow-y'];
824+
if ((hasScroll === 'auto' || hasScroll === 'scroll')
825+
&& nodeEl[i].scrollHeight > nodeEl[i].clientHeight) {
826+
return nodeEl[i];
827+
}
828+
}
829+
hasScroll = window.getComputedStyle(document.scrollingElement)['overflow-y'];
830+
if (hasScroll === 'visible') {
831+
(document.scrollingElement as HTMLElement).style.overflow = 'auto';
832+
return document.scrollingElement;
833+
}
834+
}
835+
private getScrollPosition(nodeEle: HTMLElement, draEleTop: number): void {
836+
if (nodeEle && nodeEle === document.scrollingElement) {
837+
if ((nodeEle.clientHeight - nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight) < draEleTop
838+
&& nodeEle.getBoundingClientRect().height > draEleTop) {
839+
nodeEle.scrollTop += this.helperElement.clientHeight;
840+
}else if (nodeEle.scrollHeight - nodeEle.clientHeight > draEleTop) {
841+
nodeEle.scrollTop -= this.helperElement.clientHeight;
842+
}
843+
}else if (nodeEle && nodeEle !== document.scrollingElement) {
844+
if ((nodeEle.clientHeight + nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight) < draEleTop) {
845+
nodeEle.scrollTop += this.helperElement.clientHeight;
846+
}else if (nodeEle.getBoundingClientRect().top > (draEleTop - this.helperElement.clientHeight)) {
847+
nodeEle.scrollTop -= this.helperElement.clientHeight;
848+
}
849+
}
850+
}
851+
private getPathElements(evt: MouseEvent & TouchEvent): Element[] {
852+
const elementTop: number = evt.clientX > 0 ? evt.clientX : 0;
853+
const elementLeft: number = evt.clientY > 0 ? evt.clientY : 0;
854+
return document.elementsFromPoint(elementTop, elementLeft);
855+
}
809856
private triggerOutFunction(evt: MouseEvent & TouchEvent, eleObj: DropObject): void {
810857
this.hoverObject.instance.intOut(evt, eleObj.target);
811858
this.hoverObject.instance.dragData[this.scope] = null;

controls/base/themestudio/styles/buttons/button/_fluent-definition.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ $btn-bigger-icon-width: 2em !default;
4646
$btn-bigger-small-icon-width: 2em !default;
4747
$btn-round-icon-line-height: 1.5em !default;
4848
$btn-small-round-icon-line-height: 1 !default;
49-
$btn-bigger-round-icon-line-height: 0 !default;
50-
$btn-bigger-small-round-icon-line-height: 0 !default;
49+
$btn-bigger-round-icon-line-height: 1.5em !default;
50+
$btn-bigger-small-round-icon-line-height: 1.5em !default;
5151
$btn-text-line-height: 1.572em !default;
5252
$btn-bigger-text-line-height: 1.5em !default;
5353
$btn-small-text-line-height: 1.5em !default;

controls/base/themestudio/styles/pivotview/pivotfieldlist/_fusionnew-definition.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ $field-list-back-margin: 5px !default;
7171
$field-list-sort-wrapper-padding-size: 10px !default;
7272
$field-list-border: $content-bg-color-alt3 !default;
7373
$field-list-calc-expand-icon-padding: 8px !default;
74-
$field-list-search-padding-size: 10px $field-list-header-padding-size !default;
74+
$field-list-search-padding-size: 10px $field-list-title-padding-size !default;
7575
$field-list-search-popup-table-height: 392px !default;
7676
$field-list-search-popup-axis-content-height: 162px !default;
7777
$field-list-search-popup-container-bigger-height: 575px !default;

controls/base/themestudio/styles/pivotview/pivotfieldlist/_material3-definition.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,8 @@ $field-list-back-margin: 5px !default;
7171
$field-list-sort-wrapper-padding-size: 10px !default;
7272
$field-list-border: $content-bg-color-alt3 !default;
7373
$field-list-calc-expand-icon-padding: 8px !default;
74-
$field-list-search-padding-size: 10px $field-list-header-padding-size !default;
74+
$field-list-search-padding-size: 10px $field-list-title-padding-size !default;
75+
$field-list-member-prompt-padding-size: 25px 12px !default;
7576
$field-list-search-popup-table-height: 392px !default;
7677
$field-list-search-popup-axis-content-height: 162px !default;
7778
$field-list-search-popup-container-bigger-height: 565px !default;

controls/buttons/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-buttons",
3-
"version": "20.2.36",
3+
"version": "20.2.38",
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/styles/button/_fluent-definition.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ $btn-bigger-icon-width: 2em !default;
4646
$btn-bigger-small-icon-width: 2em !default;
4747
$btn-round-icon-line-height: 1.5em !default;
4848
$btn-small-round-icon-line-height: 1 !default;
49-
$btn-bigger-round-icon-line-height: 0 !default;
50-
$btn-bigger-small-round-icon-line-height: 0 !default;
49+
$btn-bigger-round-icon-line-height: 1.5em !default;
50+
$btn-bigger-small-round-icon-line-height: 1.5em !default;
5151
$btn-text-line-height: 1.572em !default;
5252
$btn-bigger-text-line-height: 1.5em !default;
5353
$btn-small-text-line-height: 1.5em !default;

controls/buttons/themestudio/styles/buttons/button/_fluent-definition.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ $btn-bigger-icon-width: 2em !default;
4646
$btn-bigger-small-icon-width: 2em !default;
4747
$btn-round-icon-line-height: 1.5em !default;
4848
$btn-small-round-icon-line-height: 1 !default;
49-
$btn-bigger-round-icon-line-height: 0 !default;
50-
$btn-bigger-small-round-icon-line-height: 0 !default;
49+
$btn-bigger-round-icon-line-height: 1.5em !default;
50+
$btn-bigger-small-round-icon-line-height: 1.5em !default;
5151
$btn-text-line-height: 1.572em !default;
5252
$btn-bigger-text-line-height: 1.5em !default;
5353
$btn-small-text-line-height: 1.5em !default;
Binary file not shown.

controls/charts/CHANGELOG.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
## [Unreleased]
44

5-
## 20.2.38 (2022-07-12)
5+
## 20.2.39 (2022-07-19)
66

77
### Chart
88

controls/diagrams/CHANGELOG.md

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

33
## [Unreleased]
44

5+
## 20.2.39 (2022-07-19)
6+
7+
- `FB36050` - Now, oldValue & newValue argument of property change event updated properly while change order for nodes.
8+
59
## 20.2.38 (2022-07-12)
610

711
### Diagram

controls/diagrams/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-diagrams",
3-
"version": "20.2.36",
3+
"version": "20.2.38",
44
"description": "Feature-rich diagram control to create diagrams like flow charts, organizational charts, mind maps, and BPMN diagrams. Its rich feature set includes built-in shapes, editing, serializing, exporting, printing, overview, data binding, and automatic layouts.",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

controls/diagrams/spec/diagram/diagram/pagesettings.spec.ts

Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2636,4 +2636,116 @@ describe('Connector gets crossed each other issue', () => {
26362636
done();
26372637
});
26382638

2639+
});
2640+
2641+
describe('Property Change event Order commands issue', () => {
2642+
let diagram: Diagram;
2643+
let ele: HTMLElement;
2644+
2645+
beforeAll(() => {
2646+
2647+
ele = createElement('div', { id: 'diagramorder' });
2648+
document.body.appendChild(ele);
2649+
2650+
let node: NodeModel = {
2651+
id: 'node1', width: 100, height: 100, offsetX: 100, offsetY: 100, annotations: [ { content: 'Node1'}],
2652+
style: { fill: 'red'}
2653+
};
2654+
let node2: NodeModel = {
2655+
id: 'node2', width: 100, height: 100, offsetX: 125, offsetY: 125, annotations: [ { content: 'Node2'}],
2656+
style: { fill: 'blue'}
2657+
};
2658+
let node3: NodeModel = {
2659+
id: 'node3', width: 100, height: 100, offsetX: 150, offsetY: 150, annotations: [ { content: 'Node3'}],
2660+
style: { fill: 'green'}
2661+
};
2662+
let node4: NodeModel = {
2663+
id: 'node4', width: 100, height: 100, offsetX: 175, offsetY: 175, annotations: [ { content: 'Node4'}],
2664+
style: { fill: 'yellow'}
2665+
};
2666+
let node5: NodeModel = {
2667+
id: 'node5', width: 100, height: 100, offsetX: 200, offsetY: 200, annotations: [ { content: 'Node5'}],
2668+
style: { fill: 'magenta'}
2669+
};
2670+
diagram = new Diagram({
2671+
width: '1000px', height: '800px', nodes: [node, node2, node3, node4, node5],
2672+
2673+
});
2674+
2675+
2676+
diagram.appendTo('#diagramorder');
2677+
2678+
});
2679+
afterAll(() => {
2680+
diagram.destroy();
2681+
ele.remove();
2682+
});
2683+
it('Check whether Only ZIndex values updated in propertyChange event newValue argument - bringToFront', function (done) {
2684+
diagram.select([diagram.nodes[0]]);
2685+
diagram.propertyChange = (args: IPropertyChangeEventArgs) => {
2686+
if(args.newValue && (args.newValue as any).zIndex !== undefined ) {
2687+
expect((args.newValue as any).zIndex === 4).toBe(true);
2688+
expect((args.oldValue as any).zIndex === 0).toBe(true);
2689+
}
2690+
}
2691+
diagram.bringToFront();
2692+
done();
2693+
});
2694+
2695+
});
2696+
2697+
describe('Property Change event Order commands issue', () => {
2698+
let diagram: Diagram;
2699+
let ele: HTMLElement;
2700+
2701+
beforeAll(() => {
2702+
2703+
ele = createElement('div', { id: 'diagramorder' });
2704+
document.body.appendChild(ele);
2705+
2706+
let node: NodeModel = {
2707+
id: 'node1', width: 100, height: 100, offsetX: 100, offsetY: 100, annotations: [ { content: 'Node1'}],
2708+
style: { fill: 'red'}
2709+
};
2710+
let node2: NodeModel = {
2711+
id: 'node2', width: 100, height: 100, offsetX: 125, offsetY: 125, annotations: [ { content: 'Node2'}],
2712+
style: { fill: 'blue'}
2713+
};
2714+
let node3: NodeModel = {
2715+
id: 'node3', width: 100, height: 100, offsetX: 150, offsetY: 150, annotations: [ { content: 'Node3'}],
2716+
style: { fill: 'green'}
2717+
};
2718+
let node4: NodeModel = {
2719+
id: 'node4', width: 100, height: 100, offsetX: 175, offsetY: 175, annotations: [ { content: 'Node4'}],
2720+
style: { fill: 'yellow'}
2721+
};
2722+
let node5: NodeModel = {
2723+
id: 'node5', width: 100, height: 100, offsetX: 200, offsetY: 200, annotations: [ { content: 'Node5'}],
2724+
style: { fill: 'magenta'}
2725+
};
2726+
diagram = new Diagram({
2727+
width: '1000px', height: '800px', nodes: [node, node2, node3, node4, node5],
2728+
2729+
});
2730+
2731+
2732+
diagram.appendTo('#diagramorder');
2733+
2734+
});
2735+
afterAll(() => {
2736+
diagram.destroy();
2737+
ele.remove();
2738+
});
2739+
it('Check whether Only ZIndex values updated in propertyChange event newValue argument - SendToBack', function (done) {
2740+
diagram.select([diagram.nodes[4]]);
2741+
diagram.propertyChange = (args: IPropertyChangeEventArgs) => {
2742+
if(args.newValue && (args.newValue as any).zIndex !== undefined ) {
2743+
expect((args.newValue as any).zIndex === 0).toBe(true);
2744+
expect((args.oldValue as any).zIndex === 4).toBe(true);
2745+
}
2746+
}
2747+
diagram.sendToBack();
2748+
done();
2749+
});
2750+
26392751
});

controls/diagrams/src/diagram/interaction/command-manager.ts

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2840,13 +2840,20 @@ export class CommandHandler {
28402840
}
28412841
}
28422842

2843-
private triggerOrderCommand(oldObj : NodeModel | ConnectorModel, newObj : NodeModel | ConnectorModel, obj: NodeModel | ConnectorModel){
2843+
private triggerOrderCommand(oldObj: NodeModel | ConnectorModel, newObj: NodeModel | ConnectorModel, obj: NodeModel | ConnectorModel) {
28442844
let clonedObject = cloneObject(oldObj);
2845+
// EJ2-61653 - Added below code to get only changed values (zIndex) and passed as an argument to property change event
2846+
const oldValue: NodeModel | ConnectorModel = {
2847+
zIndex: (clonedObject as NodeModel | ConnectorModel).zIndex
2848+
};
2849+
const newValue: NodeModel | ConnectorModel = {
2850+
zIndex: newObj.zIndex
2851+
};
28452852
let arg: IPropertyChangeEventArgs = {
2846-
element: obj, cause: this.diagram.diagramActions,
2847-
oldValue: clonedObject, newValue: newObj
2848-
};
2849-
this.diagram.triggerEvent(DiagramEvent.propertyChange, arg)
2853+
element: obj, cause: this.diagram.diagramActions,
2854+
oldValue: oldValue, newValue: newValue
2855+
};
2856+
this.diagram.triggerEvent(DiagramEvent.propertyChange, arg)
28502857
}
28512858

28522859
private checkGroupNode(selectedNodeName: string, layerObject: string, nameTable: object): boolean {

controls/diagrams/themestudio/styles/buttons/button/_fluent-definition.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ $btn-bigger-icon-width: 2em !default;
4646
$btn-bigger-small-icon-width: 2em !default;
4747
$btn-round-icon-line-height: 1.5em !default;
4848
$btn-small-round-icon-line-height: 1 !default;
49-
$btn-bigger-round-icon-line-height: 0 !default;
50-
$btn-bigger-small-round-icon-line-height: 0 !default;
49+
$btn-bigger-round-icon-line-height: 1.5em !default;
50+
$btn-bigger-small-round-icon-line-height: 1.5em !default;
5151
$btn-text-line-height: 1.572em !default;
5252
$btn-bigger-text-line-height: 1.5em !default;
5353
$btn-small-text-line-height: 1.5em !default;

controls/diagrams/themestudio/styles/dropdowns/list-box/_layout.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -398,6 +398,15 @@
398398
}
399399
}
400400

401+
// Blazor listbox class
402+
.e-listboxtool-container .e-left {
403+
flex-direction: row-reverse;
404+
}
405+
406+
.e-listboxtool-wrapper .e-left {
407+
flex-direction: column-reverse;
408+
}
409+
401410
.e-rtl.e-listboxtool-wrapper,
402411
.e-rtl.e-listboxtool-container {
403412
&.e-right {

controls/diagrams/themestudio/styles/grids/grid/_bootstrap-dark-definition.scss

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -555,14 +555,14 @@ $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
555555
$grid-rtl-sort-num-left-align-margin: 8px -6px 0 0 !default;
556556
$grid-frozen-mac-scrollbar-background: rgba(0, 0, 0, .5) !default;
557557
$grid-rowcell-color: rgba($grid-content-font-color, $grid-conent-font-opacity) !default;
558-
$grid-reorderarrow-margin-top: -1.5px !default;
559-
$grid-reorderdownarrow-margin-top: $grid-reorderarrow-margin-top !default;
558+
$grid-reorderarrow-margin-top: -6.5px !default;
559+
$grid-reorderdownarrow-margin-top: 4px !default;
560560
$grid-reorder-arrow-top-margin: -1.5px !default;
561-
$grid-reorder-downarrow-top-margin: $grid-reorderarrow-margin-top !default;
561+
$grid-reorder-downarrow-top-margin: -1.5px !default;
562562
$grid-sortnumber-font-size: 9px !default;
563563
$grid-header-text-transform: none !default;
564564
$grid-bigger-toolbar-icon-size: 18px !default;
565-
$grid-reorderarrow-margin-left: 0 !default;
565+
$grid-reorderarrow-margin-left: -2.5px !default;
566566
$grid-column-chooser-cancel-icon-size: 11px !default;
567567

568568
// bootstrap5 support
@@ -577,7 +577,6 @@ $grid-bigger-sort-margin: -14px 3px !default;
577577
$grid-bigger-sort-right-margin: 0 2px 0 0 !default;
578578
$grid-skin: 'bootstrap' !default;
579579
$grid-biggerreorderarrow-font-size: $grid-reorderarrow-font-size !default;
580-
$grid-bigger-reorderarrow-margin-top: $grid-reorderarrow-margin-top !default;
581580
$grid-bigger-drag-count-padding: 3px 7px 4px !default;
582581
$grid-bigger-drag-count-top: -10px !default;
583582
$grid-bigger-check-select-all-font-size: $grid-bigger-header-icons-font-size !default;

0 commit comments

Comments
 (0)