Skip to content

Commit dd78e7c

Browse files
author
pipeline
committed
v20.4.52 is released
1 parent 8a7fdb6 commit dd78e7c

File tree

311 files changed

+9738
-343912
lines changed

Some content is hidden

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

311 files changed

+9738
-343912
lines changed

controls/base/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-base",
3-
"version": "20.4.48",
3+
"version": "20.4.51",
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/spec/intl/number-formatter.spec.ts

+18-1
Original file line numberDiff line numberDiff line change
@@ -968,5 +968,22 @@ describe('Number formatter', () => {
968968
expect(result).toBe('¤#,##0.00');
969969
});
970970
});
971+
972+
describe('Custom pivot table format', () => {
973+
it('Number with above 5 lacks values', () => {
974+
let result: Function = NumberFormat.numberFormatter('en-US', { format: '#,###,,;(#,###,,)' }, cldrData);
975+
expect(result(500000)).toBe('1');
976+
expect(result(1500000)).toBe('2');
977+
});
978+
it('Number with below 5 lacks values', () => {
979+
let result: Function = NumberFormat.numberFormatter('en-US', { format: '#,###,,;(#,###,,)' }, cldrData);
980+
expect(result(100000)).toBe('');
981+
});
982+
it('Negative Number with above 5 lacks values', () => {
983+
let result: Function = NumberFormat.numberFormatter('en-US', { format: '#,###,,;(#,###,,)' }, cldrData);
984+
expect(result(-500000)).toBe('(1)');
985+
expect(result(-1500000)).toBe('(2)');
986+
});
987+
});
971988

972-
});
989+
});

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": "20.4.48",
3+
"version": "20.4.51",
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/styles/daterangepicker/_layout.scss

+1
Original file line numberDiff line numberDiff line change
@@ -218,6 +218,7 @@
218218
overflow: $range-visibility-hidden;
219219
padding: $range-list-item-padding;
220220
white-space: $range-text-nowrap;
221+
text-overflow: $range-text-overflow;
221222
}
222223
#{if(&, '&', '*')} .e-list-parent {
223224
margin: $range-value-zero;

controls/calendars/themestudio/styles/calendars/daterangepicker/_layout.scss

+1
Original file line numberDiff line numberDiff line change
@@ -218,6 +218,7 @@
218218
overflow: $range-visibility-hidden;
219219
padding: $range-list-item-padding;
220220
white-space: $range-text-nowrap;
221+
text-overflow: $range-text-overflow;
221222
}
222223
#{if(&, '&', '*')} .e-list-parent {
223224
margin: $range-value-zero;

controls/calendars/themestudio/styles/grids/grid/_theme.scss

+2-1
Original file line numberDiff line numberDiff line change
@@ -549,7 +549,8 @@
549549
}
550550
}
551551

552-
.e-ftrchk.e-chkfocus {
552+
.e-ftrchk.e-chkfocus,
553+
li.e-cclist.e-colfocus {
553554
background-color: $grid-hover-bg-color;
554555
}
555556
}
Binary file not shown.

controls/charts/CHANGELOG.md

+10
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,16 @@
22

33
## [Unreleased]
44

5+
## 20.4.52 (2023-02-28)
6+
7+
### Chart
8+
9+
#### Bug Fixes
10+
11+
- `#F180554` - Fixed console error thrown when using the destroy method.
12+
- `#I437308` - Resolved accessibility issues in chart.
13+
- `#I436273` - Fixed issue with chart going out when zooming without clip rect in path.
14+
515
## 20.4.51 (2023-02-21)
616

717
### Chart

controls/charts/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-charts",
3-
"version": "20.4.49",
3+
"version": "20.4.51",
44
"description": "Feature-rich chart control with built-in support for over 25 chart types, technical indictors, trendline, zooming, tooltip, selection, crosshair and trackball.",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

controls/charts/src/accumulation-chart/accumulation.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -837,6 +837,7 @@ export class AccumulationChart extends Component<HTMLElement> implements INotify
837837
if (this.element.className.indexOf('e-accumulationchart') === -1) {
838838
this.element.classList.add('e-accumulationchart');
839839
}
840+
this.element.setAttribute('role', 'chart');
840841
this.element.setAttribute('tabindex', '0');
841842
this.element.setAttribute('aria-label', this.title);
842843
this.element.setAttribute('class', this.element.getAttribute('class') + ' e-accumulationchart-focused');
@@ -1940,7 +1941,8 @@ export class AccumulationChart extends Component<HTMLElement> implements INotify
19401941
super.destroy();
19411942
this.element.classList.remove('e-accumulationchart');
19421943
this.element.classList.remove('e-accumulationchart-focused');
1943-
document.getElementById(this.element.id + 'Keyboard_accumulationchart_focus').remove();
1944+
let element: HTMLElement = document.getElementById(this.element.id + 'Keyboard_accumulationchart_focus');
1945+
if (element) { element.remove(); }
19441946
this.removeSvg();
19451947
this.svgObject = null;
19461948
}

controls/charts/src/accumulation-chart/renderer/funnel-series.ts

+1
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,7 @@ export class FunnelSeries extends TriangularBase {
114114
point.midAngle = 0;
115115
options.d = direction;
116116
const element: Element = chart.renderer.drawPath(options);
117+
element.setAttribute('role', 'data');
117118
element.setAttribute('tabindex', point.index === 0 ? '0' : '');
118119
element.setAttribute('aria-label', (point.x + ':' + point.y + '%. ' + series.name));
119120
appendChildElement(false, seriesGroup, element, redraw);

controls/charts/src/accumulation-chart/renderer/pie-series.ts

+2
Original file line numberDiff line numberDiff line change
@@ -38,13 +38,15 @@ export class PieSeries extends PieBase {
3838
point.symbolLocation = degreeToLocation(point.midAngle, (this.radius + this.innerRadius) / 2, this.center);
3939
if (!redraw) {
4040
const element: Element = chart.renderer.drawPath(option);
41+
element.setAttribute('role', 'data');
4142
element.setAttribute('tabindex', point.index === 0 ? '0' : '');
4243
element.setAttribute('aria-label', (point.x + ': ' + point.y + '%. ' + series.name));
4344
seriesGroup.appendChild(element);
4445
point.degree = degree;
4546
point.start = start;
4647
} else {
4748
const element: Element = chart.renderer.drawPath(option);
49+
element.setAttribute('role', 'data');
4850
element.setAttribute('tabindex', point.index === 0 ? '0' : '');
4951
element.setAttribute('aria-label', (point.x + ': ' + point.y + '%. ' + series.name));
5052
seriesGroup.appendChild(element);

controls/charts/src/accumulation-chart/renderer/pyramid-series.ts

+1
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,7 @@ export class PyramidSeries extends TriangularBase {
150150
options.d = this.getSegmentData(point, series, chart);
151151
point.midAngle = 0;
152152
const element: Element = chart.renderer.drawPath(options);
153+
element.setAttribute('role', 'data');
153154
element.setAttribute('tabindex', point.index === 0 ? '0' : '');
154155
element.setAttribute('aria-label', (point.x + ': ' + point.y + '%. ' + series.name));
155156
appendChildElement(false, seriesGroup, element, redraw);

controls/charts/src/bullet-chart/renderer/scale-render.ts

+2
Original file line numberDiff line numberDiff line change
@@ -216,6 +216,7 @@ export class ScaleGroup {
216216
const svgRect: Element = this.bulletChart.renderer.drawRectangle(featureBarOptions);
217217
svgRect.setAttribute('class', this.bulletChart.svgObject.id + '_FeatureMeasure');
218218
svgRect.id = this.bulletChart.svgObject.id + '_FeatureMeasure_' + i;
219+
svgRect.setAttribute('role', 'data');
219220
svgRect.setAttribute('aria-label', (this.bulletChart.title + ', value: ' + this.bulletChart.dataSource[i as number].value + ', target: ' + this.bulletChart.dataSource[i as number].target));
220221
return svgRect;
221222
}
@@ -231,6 +232,7 @@ export class ScaleGroup {
231232
const svgRect: Element = this.bulletChart.renderer.drawRectangle(featureBarOptions);
232233
svgRect.setAttribute('class', this.bulletChart.svgObject.id + '_FeatureMeasure');
233234
svgRect.id = this.bulletChart.svgObject.id + '_FeatureMeasure_' + i;
235+
svgRect.setAttribute('role', 'data');
234236
svgRect.setAttribute('aria-label', (this.bulletChart.title + ', value: ' + this.bulletChart.dataSource[i as number].value + ', target: ' + this.bulletChart.dataSource[i as number].target));
235237
return svgRect;
236238
}

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

+5-2
Original file line numberDiff line numberDiff line change
@@ -1392,8 +1392,11 @@ export class CartesianAxisLayoutPanel {
13921392
}
13931393
break;
13941394
case 'Shift':
1395-
if ((i === 0 || (isInverse && i === len - 1)) && options.x < rect.x) {
1396-
intervalLength -= (rect.x - options.x); options.x = pointX = !isHorizontalAngle ? rect.x + padding : rect.x;
1395+
if ((i === 0 || (isInverse && i === len - 1)) && options.x < rect.x) {
1396+
intervalLength -= (rect.x - options.x);
1397+
if (!(anchor === 'start' && options.x > 0)) {
1398+
options.x = pointX = !isHorizontalAngle ? rect.x + padding : rect.x;
1399+
}
13971400
} else if ((i === len - 1 || (isInverse && i === 0)) && ((options.x + width) > rect.x + rect.width)) {
13981401
if (elementSize.width > intervalLength && axis.labelIntersectAction === 'Trim') {
13991402
intervalLength -= (options.x + width - (rect.x + rect.width));

controls/charts/src/chart/chart.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -1679,6 +1679,7 @@ export class Chart extends Component<HTMLElement> implements INotifyPropertyChan
16791679
if (this.tooltipModule) {
16801680
this.tooltipModule.previousPoints = [];
16811681
}
1682+
this.element.setAttribute('role', 'chart');
16821683
this.element.setAttribute('tabindex', '0');
16831684
this.element.setAttribute('aria-label', this.description || this.title);
16841685
this.element.setAttribute('class', this.element.getAttribute('class') + ' e-chart-focused');
@@ -2689,7 +2690,8 @@ export class Chart extends Component<HTMLElement> implements INotifyPropertyChan
26892690
this.dataLabelCollections = null;
26902691
this.dataLabelElements = null;
26912692
this.yAxisElements = null;
2692-
document.getElementById(this.element.id + 'Keyboard_chart_focus').remove();
2693+
let element: HTMLElement = document.getElementById(this.element.id + 'Keyboard_chart_focus');
2694+
if (element) { element.remove(); }
26932695
/**
26942696
* To fix react timeout destroy issue.
26952697
*/

controls/charts/src/chart/series/candle-series.ts

+1
Original file line numberDiff line numberDiff line change
@@ -169,6 +169,7 @@ export class CandleSeries extends ColumnBase {
169169
const previousDirection: string = element ? element.getAttribute('d') : null;
170170
const candleElement: HTMLElement =
171171
series.chart.renderer.drawPath(options, new Int32Array([series.clipRect.x, series.clipRect.y])) as HTMLElement;
172+
candleElement.setAttribute('role', 'data');
172173
candleElement.setAttribute('aria-label', point.x.toString() + ':' + point.high.toString()
173174
+ ':' + point.low.toString() + ':' + point.close.toString() + ':' + point.open.toString());
174175
if (!series.chart.enableCanvas) {

controls/charts/src/chart/series/chart-series.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -2177,8 +2177,8 @@ export class Series extends SeriesBase {
21772177
let markerWidth: number;
21782178
let options: CircleOption | RectOption;
21792179
if (this.type === 'Scatter' || this.drawType === 'Scatter') {
2180-
markerHeight = (chart.primaryYAxis.maximum || chart.primaryXAxis.maximum) ? 0 : (this.marker.height + explodeValue) / 2;
2181-
markerWidth = (chart.primaryYAxis.maximum || chart.primaryXAxis.maximum) ? 0 : (this.marker.width + explodeValue) / 2;
2180+
markerHeight = (this.marker.height + explodeValue) / 2;
2181+
markerWidth = (this.marker.width + explodeValue) / 2;
21822182
} else {
21832183
markerHeight = 0;
21842184
markerWidth = 0;
@@ -2208,6 +2208,7 @@ export class Series extends SeriesBase {
22082208
'clip-path': 'url(#' + elementId + '_ChartSeriesClipRect_' + index + ')'
22092209
});
22102210
if (this.seriesElement) {
2211+
this.seriesElement.setAttribute('role', 'series');
22112212
this.seriesElement.setAttribute('aria-label', (this.name + ',' + this.type + ' series with ' + this.points.length + ' data points'));
22122213
this.seriesElement.setAttribute('aria-hidden', 'false');
22132214
}

controls/charts/src/chart/series/column-base.ts

+2
Original file line numberDiff line numberDiff line change
@@ -268,9 +268,11 @@ export class ColumnBase {
268268
) as HTMLElement;
269269
switch (series.seriesType) {
270270
case 'XY':
271+
element.setAttribute('role', 'data');
271272
element.setAttribute('aria-label', point.x + ':' + point.yValue + ', ' + series.name);
272273
break;
273274
case 'HighLow':
275+
element.setAttribute('role', 'data');
274276
element.setAttribute('aria-label', point.x + ':' + point.high + ', ' + point.low + ', ' + series.name);
275277
break;
276278
}

controls/charts/src/chart/series/hilo-open-close-series.ts

+1
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,7 @@ export class HiloOpenCloseSeries extends ColumnBase {
132132
pathAnimation(getElement(options.id), direction, series.chart.redraw);
133133
const element: HTMLElement =
134134
series.chart.renderer.drawPath(options, new Int32Array([series.clipRect.x, series.clipRect.y])) as HTMLElement;
135+
element.setAttribute('role', 'data');
135136
element.setAttribute('aria-label', point.x.toString() + ':' + point.high.toString()
136137
+ ':' + point.low.toString() + ':' + point.close.toString() + ':' + point.open.toString());
137138
if (!series.chart.enableCanvas) {

controls/charts/src/chart/series/marker-explode.ts

+1
Original file line numberDiff line numberDiff line change
@@ -230,6 +230,7 @@ export class MarkerExplode extends ChartData {
230230
seletionElem.hasAttribute('class') && (className === seletionElem.getAttribute('class'))) {
231231
symbol.classList.add(className);
232232
}
233+
symbol.setAttribute('role', 'data');
233234
symbol.setAttribute('clip-path', element.getAttribute('clip-path'));
234235
symbol.setAttribute('transform', element.getAttribute('transform'));
235236
this.chart.svgObject.appendChild(symbol);

controls/charts/src/chart/series/marker.ts

+4-1
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,10 @@ export class Marker extends MarkerExplode {
141141
imageURL, shapeOption,
142142
point.x.toString() + ':' + y.toString(), this.chart.renderer, series.clipRect
143143
);
144-
if (markerElement) { markerElement.setAttribute('aria-label', (point.x + ': ' + point.y + ', ' + series.name)); }
144+
if (markerElement) {
145+
markerElement.setAttribute('role', 'data');
146+
markerElement.setAttribute('aria-label', (point.x + ': ' + point.y + ', ' + series.name));
147+
}
145148
appendChildElement(
146149
this.chart.enableCanvas, parentElement, markerElement, redraw, true, circlePath + 'x', circlePath + 'y',
147150
previousLocation, previousPath, false, false, null, series.chart.duration

controls/charts/src/chart/user-interaction/zooming-toolkit.ts

+5
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@ export class Toolkit {
6868
this.elementOpacity = !this.chart.zoomModule.isZoomed && this.chart.zoomSettings.showToolbar ? '0.2' : '1';
6969
childElement.setAttribute('opacity', this.elementOpacity);
7070
childElement.id = this.elementId + '_Zooming_Pan';
71+
childElement.setAttribute('role', 'button');
7172
childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Pan'));
7273
this.panElements = childElement;
7374
childElement.appendChild(render.drawRectangle(
@@ -96,6 +97,7 @@ export class Toolkit {
9697
direction += '5.943-2.651,5.943-5.943S13.395,0,10.103,0S4.16,2.651,4.16,5.943c0,1.508,0.503,2.834,1.417,3.885l-0.274,0.228H4.571';
9798
direction = direction + 'L0.001,14.629L0.001,14.629z M5.943,5.943c0-2.285,1.828-4.114,4.114-4.114s4.114,1.828,4.114,';
9899
childElement.id = this.elementId + '_Zooming_Zoom';
100+
childElement.setAttribute('role', 'button');
99101
childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Zoom'));
100102
this.zoomElements = childElement;
101103
this.selectedID = this.chart.zoomModule.isPanning ? this.chart.element.id + '_Zooming_Pan_1' : this.elementId + '_Zooming_Zoom_1';
@@ -122,6 +124,7 @@ export class Toolkit {
122124
direction += '14.628l0,0L1.372,16l4.571-4.572v-0.685l0.228-0.275c1.052,0.868,2.423,1.417,3.885,1.417c3.291,0,5.943-2.651,';
123125
direction += '5.943-5.943C16,2.651,13.395,0,10.103,0z M10.058,10.058c-2.286,0-4.114-1.828-4.114-4.114c0-2.286,1.828-4.114,';
124126
childElement.id = this.elementId + '_Zooming_ZoomIn';
127+
childElement.setAttribute('role', 'button');
125128
childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('ZoomIn'));
126129
const polygonDirection: string = '12.749,5.466 10.749,5.466 10.749,3.466 9.749,3.466 9.749,5.466 7.749,5.466 7.749,6.466';
127130
childElement.appendChild(render.drawRectangle(
@@ -156,6 +159,7 @@ export class Toolkit {
156159
direction += '1.422c3.289,0,5.955-2.666,5.955-5.955S13.333,0,10.044,0S4.089,2.667,4.134,5.911c0,1.466,0.533,2.844,';
157160
direction += '1.422,3.866l-0.266,0.266H4.578L0,14.622L0,14.622z M5.911,5.911c0-2.311,1.822-4.133,4.133-4.133s4.133,1.822,4.133,';
158161
childElement.id = this.elementId + '_Zooming_ZoomOut';
162+
childElement.setAttribute('role', 'button');
159163
childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('ZoomOut'));
160164
childElement.appendChild(render.drawRectangle(
161165
new RectOption(this.elementId + '_Zooming_ZoomOut_1', 'transparent', {}, 1, this.iconRect)
@@ -185,6 +189,7 @@ export class Toolkit {
185189
direction += '1.016l1.055,1.178C6.581,3.328,7.272,3.125,8,3.125C10.4,3.125,12.363,5.319,12.364,8L12.364,8z M11.091,';
186190
direction += '13.484l-1.055-1.178C9.419,12.672,8.728,12.875,8,12.875c-2.4,0-4.364-2.194-4.364-4.875h2.182L2.909,4.75L0,8h2.182c0,';
187191
childElement.id = this.elementId + '_Zooming_Reset';
192+
childElement.setAttribute('role', 'button');
188193
childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Reset'));
189194
//This is for low oppacity to RESET button
190195
this.elementOpacity = !chart.zoomModule.isZoomed && chart.zoomSettings.showToolbar ? '0.2' : '1';

controls/charts/src/range-navigator/renderer/slider.ts

+1
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,7 @@ export class RangeSlider {
9090
option.id = this.elementId + '_SelectedArea';
9191
option.fill = disabledColor || style.selectedRegionColor || range.themeStyle.selectedRegionColor;
9292
this.selectedElement = renderer.drawRectangle(option) as Element;
93+
this.selectedElement.setAttribute('role', 'region');
9394
this.selectedElement.setAttribute('aria-label', 'Range Slider with ' + range.rangeSlider.points.length + ' data points');
9495
(this.selectedElement as HTMLElement).style.cursor = '-webkit-grab';
9596
this.leftSlider = renderer.createGroup({

controls/charts/src/smithchart/series/marker.ts

+1
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@ export class Marker {
101101
markerEle = smithchart.renderer.drawPath(pathOptions) as SVGPathElement;
102102
break;
103103
}
104+
markerEle.setAttribute('role', 'data');
104105
markerEle.setAttribute('aria-label', 'x: ' + (location.x) + ', ' + 'y: ' + (location.y));
105106
return markerEle;
106107
}

controls/charts/src/smithchart/smithchart.ts

+1
Original file line numberDiff line numberDiff line change
@@ -488,6 +488,7 @@ export class Smithchart extends Component<HTMLElement> implements INotifyPropert
488488
}
489489
private initPrivateVariable(): void {
490490
this.animateSeries = true;
491+
this.element.setAttribute('role', 'chart');
491492
this.element.setAttribute('aria-label', this.title.description || this.title.text);
492493
this.element.setAttribute('tabindex', '0');
493494
}

0 commit comments

Comments
 (0)