@syncfusion/ej2-schedule 19.4.40 → 19.4.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/CHANGELOG.md +20 -1
  2. package/dist/ej2-schedule.umd.min.js +2 -2
  3. package/dist/ej2-schedule.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-schedule.es2015.js +59 -43
  5. package/dist/es6/ej2-schedule.es2015.js.map +1 -1
  6. package/dist/es6/ej2-schedule.es5.js +59 -43
  7. package/dist/es6/ej2-schedule.es5.js.map +1 -1
  8. package/dist/global/ej2-schedule.min.js +2 -2
  9. package/dist/global/ej2-schedule.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +13 -13
  12. package/src/schedule/actions/drag.js +1 -1
  13. package/src/schedule/actions/resize.js +44 -37
  14. package/src/schedule/base/css-constant.d.ts +6 -0
  15. package/src/schedule/base/css-constant.js +6 -0
  16. package/src/schedule/event-renderer/month.js +2 -1
  17. package/src/schedule/renderer/header-renderer.js +1 -1
  18. package/src/schedule/renderer/view-base.js +5 -3
  19. package/styles/bootstrap-dark.css +4 -0
  20. package/styles/bootstrap.css +4 -0
  21. package/styles/bootstrap4.css +4 -0
  22. package/styles/bootstrap5-dark.css +4 -0
  23. package/styles/bootstrap5.css +4 -0
  24. package/styles/fabric-dark.css +4 -0
  25. package/styles/fabric.css +4 -0
  26. package/styles/highcontrast-light.css +4 -0
  27. package/styles/highcontrast.css +4 -0
  28. package/styles/material-dark.css +4 -0
  29. package/styles/material.css +4 -0
  30. package/styles/schedule/_layout.scss +4 -0
  31. package/styles/schedule/bootstrap-dark.css +4 -0
  32. package/styles/schedule/bootstrap.css +4 -0
  33. package/styles/schedule/bootstrap4.css +4 -0
  34. package/styles/schedule/bootstrap5-dark.css +4 -0
  35. package/styles/schedule/bootstrap5.css +4 -0
  36. package/styles/schedule/fabric-dark.css +4 -0
  37. package/styles/schedule/fabric.css +4 -0
  38. package/styles/schedule/highcontrast-light.css +4 -0
  39. package/styles/schedule/highcontrast.css +4 -0
  40. package/styles/schedule/material-dark.css +4 -0
  41. package/styles/schedule/material.css +4 -0
  42. package/styles/schedule/tailwind-dark.css +4 -0
  43. package/styles/schedule/tailwind.css +4 -0
  44. package/styles/tailwind-dark.css +4 -0
  45. package/styles/tailwind.css +4 -0
@@ -514,6 +514,12 @@ const DATE_HEADER_CONTAINER_CLASS = 'e-date-header-container';
514
514
  /** @private */
515
515
  const HEADER_CELLS_CLASS = 'e-header-cells';
516
516
  /** @private */
517
+ const HEADER_WEEK_CELLS_CLASS = 'e-header-week-cell';
518
+ /** @private */
519
+ const HEADER_MONTH_CELLS_CLASS = 'e-header-month-cell';
520
+ /** @private */
521
+ const HEADER_YEAR_CELLS_CLASS = 'e-header-year-cell';
522
+ /** @private */
517
523
  const WORKDAY_CLASS = 'e-work-days';
518
524
  /** @private */
519
525
  const OTHERMONTH_CLASS = 'e-other-month';
@@ -1337,7 +1343,7 @@ class HeaderRenderer {
1337
1343
  break;
1338
1344
  case 'e-today':
1339
1345
  currentTime = resetTime(this.parent.getCurrentTime());
1340
- if (this.parent.currentView === 'Agenda' || !this.parent.isSelectedDate(currentTime) ||
1346
+ if (this.parent.currentView === 'Agenda' || this.parent.currentView === 'MonthAgenda' || !this.parent.isSelectedDate(currentTime) ||
1341
1347
  this.parent.currentView === 'Month' && this.parent.activeViewOptions.displayDate && !this.hasSelectedDate() &&
1342
1348
  resetTime(this.parent.activeViewOptions.displayDate) !== currentTime || this.parent.currentView === 'Month' &&
1343
1349
  this.parent.activeViewOptions.numberOfWeeks > 0 && !this.hasSelectedDate()
@@ -7179,7 +7185,8 @@ class MonthEvent extends EventBase {
7179
7185
  setStyleAttribute(cell, { 'height': height + 'px' });
7180
7186
  });
7181
7187
  }
7182
- const cellDetail = this.workCells.slice(-1)[0].getBoundingClientRect();
7188
+ const cellDetail = this.workCells[this.parent.activeView.isTimelineView() ?
7189
+ 0 : this.workCells.length - 1].getBoundingClientRect();
7183
7190
  this.cellWidth = cellDetail.width;
7184
7191
  this.cellHeight = cellDetail.height;
7185
7192
  this.dateRender = dateRender;
@@ -18405,9 +18412,9 @@ class Resize extends ActionBase {
18405
18412
  bottom: resizeTarget.classList.contains(BOTTOM_RESIZE_HANDLER)
18406
18413
  };
18407
18414
  this.actionObj.groupIndex = this.parent.uiStateValues.isGroupAdaptive ? this.parent.uiStateValues.groupIndex : 0;
18408
- const workCell = this.parent.element.querySelector('.' + WORK_CELLS_CLASS);
18409
- this.actionObj.cellWidth = workCell.offsetWidth;
18410
- this.actionObj.cellHeight = workCell.offsetHeight;
18415
+ const workCell = this.parent.element.querySelector('.' + WORK_CELLS_CLASS).getBoundingClientRect();
18416
+ this.actionObj.cellWidth = workCell.width;
18417
+ this.actionObj.cellHeight = workCell.height;
18411
18418
  const hRows = this.parent.activeViewOptions.headerRows.map((row) => row.option);
18412
18419
  if (this.parent.activeView.isTimelineView() && hRows.length > 0 && ['Date', 'Hour'].indexOf(hRows.slice(-1)[0]) < 0) {
18413
18420
  const tr = this.parent.getContentTable().querySelector('tr');
@@ -18416,8 +18423,9 @@ class Resize extends ActionBase {
18416
18423
  for (const td of tdCollections) {
18417
18424
  noOfDays += parseInt(td.getAttribute('colspan'), 10);
18418
18425
  }
18419
- this.actionObj.cellWidth = tr.offsetWidth / noOfDays;
18420
- this.actionObj.cellHeight = tr.offsetHeight;
18426
+ const trRect = tr.getBoundingClientRect();
18427
+ this.actionObj.cellWidth = trRect.width / noOfDays;
18428
+ this.actionObj.cellHeight = trRect.height;
18421
18429
  }
18422
18430
  const pages = this.getPageCoordinates(e);
18423
18431
  this.actionObj.X = pages.pageX;
@@ -18662,12 +18670,12 @@ class Resize extends ActionBase {
18662
18670
  const eventEnd = new Date(this.actionObj.event[this.parent.eventFields.endTime].getTime());
18663
18671
  let resizeTime;
18664
18672
  let isDateHeader = false;
18673
+ let headerName = this.parent.currentView;
18665
18674
  const isTimeViews = ['TimelineDay', 'TimelineWeek', 'TimelineWorkWeek'].indexOf(this.parent.currentView) > -1;
18666
18675
  const isTimelineMonth = this.parent.currentView === 'TimelineMonth';
18667
18676
  const isWithoutScale = isTimelineMonth || isTimeViews && !this.parent.activeViewOptions.timeScale.enable;
18668
18677
  if (this.parent.activeView.isTimelineView()) {
18669
18678
  const tr = this.parent.getContentTable().querySelector('tr');
18670
- let headerName = this.parent.currentView;
18671
18679
  if (this.parent.activeViewOptions.headerRows.length > 0) {
18672
18680
  const rows = this.parent.activeViewOptions.headerRows.map((row) => row.option);
18673
18681
  headerName = rows.slice(-1)[0];
@@ -18679,6 +18687,11 @@ class Resize extends ActionBase {
18679
18687
  let cellIndex = 0;
18680
18688
  const tdCollections = [].slice.call(tr.children);
18681
18689
  let isLastCell = false;
18690
+ const pixelsPerMinute = this.actionObj.cellWidth / (this.parent.activeViewOptions.timeScale.interval /
18691
+ this.parent.activeViewOptions.timeScale.slotCount);
18692
+ let offset = parseFloat(this.parent.enableRtl ? this.actionObj.clone.style.right :
18693
+ this.actionObj.clone.style.left);
18694
+ offset = Math.round(offset / pixelsPerMinute) * pixelsPerMinute;
18682
18695
  if (['Year', 'Month', 'Week', 'Date'].indexOf(headerName) !== -1) {
18683
18696
  let noOfDays = 0;
18684
18697
  for (const td of tdCollections) {
@@ -18686,28 +18699,28 @@ class Resize extends ActionBase {
18686
18699
  }
18687
18700
  let offsetValue = this.parent.enableRtl ? parseInt(this.actionObj.clone.style.right, 10) :
18688
18701
  parseInt(this.actionObj.clone.style.left, 10);
18702
+ offsetValue = Math.round(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth;
18689
18703
  if (!isLeft) {
18690
- offsetValue += (this.actionObj.clone.offsetWidth - this.actionObj.cellWidth);
18704
+ offsetValue += (this.actionObj.clone.getBoundingClientRect().width - this.actionObj.cellWidth);
18691
18705
  }
18692
- cellIndex = Math.floor(offsetValue / Math.floor(tr.offsetWidth / noOfDays));
18706
+ cellIndex = Math.floor(offsetValue / Math.floor(tr.getBoundingClientRect().width / noOfDays));
18693
18707
  isDateHeader = isTimeViews && headerName === 'Date';
18694
- cellIndex = isLeft ? cellIndex : (isTimelineMonth || isDateHeader) ? cellIndex + 1 : cellIndex;
18708
+ cellIndex = isLeft ? cellIndex : isTimelineMonth ? cellIndex + 1 : cellIndex;
18695
18709
  isLastCell = cellIndex === tdCollections.length;
18696
18710
  cellIndex = (cellIndex < 0) ? 0 : (cellIndex >= noOfDays) ? noOfDays - 1 : cellIndex;
18697
18711
  }
18698
18712
  else {
18699
18713
  const cellWidth = this.actionObj.cellWidth;
18700
- cellIndex = isLeft ? Math.floor(this.actionObj.clone.offsetLeft / this.actionObj.cellWidth) :
18701
- Math.ceil((this.actionObj.clone.offsetLeft + (this.actionObj.clone.offsetWidth - cellWidth)) /
18702
- this.actionObj.cellWidth);
18714
+ cellIndex = isLeft ? Math.floor(offset / this.actionObj.cellWidth) :
18715
+ Math.ceil((offset + (this.actionObj.clone.getBoundingClientRect().width - cellWidth)) / this.actionObj.cellWidth);
18703
18716
  if (this.parent.enableRtl) {
18704
18717
  let cellOffsetWidth = 0;
18705
18718
  if (headerName === 'TimelineMonth' || (!this.parent.activeViewOptions.timeScale.enable &&
18706
18719
  !isTimelineMonth)) {
18707
18720
  cellOffsetWidth = this.actionObj.cellWidth;
18708
18721
  }
18709
- const offsetWidth = (Math.floor(parseInt(this.actionObj.clone.style.right, 10) / this.actionObj.cellWidth) *
18710
- this.actionObj.cellWidth) + (isLeft ? 0 : this.actionObj.clone.offsetWidth - cellOffsetWidth);
18722
+ const offsetWidth = (Math.floor(offset / this.actionObj.cellWidth) *
18723
+ this.actionObj.cellWidth) + (isLeft ? 0 : this.actionObj.clone.getBoundingClientRect().width - cellOffsetWidth);
18711
18724
  cellIndex = Math.floor(offsetWidth / this.actionObj.cellWidth);
18712
18725
  }
18713
18726
  isLastCell = cellIndex === tdCollections.length;
@@ -18725,13 +18738,11 @@ class Resize extends ActionBase {
18725
18738
  resizeTime = new Date(resizeDate.setHours(resizeTime.getHours(), resizeTime.getMinutes(), resizeTime.getSeconds()));
18726
18739
  }
18727
18740
  else {
18728
- let offsetValue = this.parent.enableRtl ? parseFloat(this.actionObj.clone.style.right) :
18729
- parseFloat(this.actionObj.clone.style.left);
18730
18741
  if (!isLeft) {
18731
- offsetValue += this.actionObj.clone.offsetWidth;
18742
+ offset += this.actionObj.clone.getBoundingClientRect().width;
18732
18743
  }
18733
18744
  let spanMinutes = Math.ceil((this.actionObj.slotInterval / this.actionObj.cellWidth) *
18734
- (offsetValue - Math.floor(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth));
18745
+ (offset - Math.floor(offset / this.actionObj.cellWidth) * this.actionObj.cellWidth));
18735
18746
  spanMinutes = (isLastCell || (!isLeft && spanMinutes === 0)) ? this.actionObj.slotInterval : spanMinutes;
18736
18747
  resizeTime = new Date(resizeDate.getTime());
18737
18748
  resizeTime.setMinutes(resizeTime.getMinutes() + spanMinutes);
@@ -18740,9 +18751,10 @@ class Resize extends ActionBase {
18740
18751
  }
18741
18752
  else {
18742
18753
  const cloneIndex = closest(this.actionObj.clone, 'td').cellIndex;
18743
- const originalWidth = Math.ceil((isLeft ? this.actionObj.element.offsetWidth : 0) / this.actionObj.cellWidth) *
18744
- this.actionObj.cellWidth;
18745
- const noOfDays = Math.ceil((this.actionObj.clone.offsetWidth - originalWidth) / this.actionObj.cellWidth);
18754
+ const originalWidth = Math.ceil((isLeft ? this.actionObj.element.getBoundingClientRect().width : 0) /
18755
+ this.actionObj.cellWidth) * this.actionObj.cellWidth;
18756
+ const noOfDays = Math.ceil((this.actionObj.clone.getBoundingClientRect().width - originalWidth) /
18757
+ this.actionObj.cellWidth);
18746
18758
  const tr = closest(this.actionObj.clone, 'tr');
18747
18759
  let dayIndex = isLeft ? cloneIndex - noOfDays : cloneIndex + noOfDays - 1;
18748
18760
  dayIndex = this.getIndex(dayIndex);
@@ -18762,8 +18774,8 @@ class Resize extends ActionBase {
18762
18774
  }
18763
18775
  else {
18764
18776
  const isTimeScaleViews = isTimeViews && this.parent.activeViewOptions.timeScale.enable;
18765
- let resizeEnd = ((!isTimeScaleViews || isDateHeader) && resizeTime.getHours() === 0 && resizeTime.getMinutes() === 0) ?
18766
- addDays(resizeTime, 1) : resizeTime;
18777
+ let resizeEnd = ((!isTimeScaleViews || isDateHeader || isTimeViews && ['Week', 'Month', 'Year'].indexOf(headerName) > -1)
18778
+ && resizeTime.getHours() === 0 && resizeTime.getMinutes() === 0) ? addDays(resizeTime, 1) : resizeTime;
18767
18779
  if (isWithoutScale && (resizeEnd.getTime() - eventStart.getTime()) <= 0) {
18768
18780
  resizeEnd = addDays(resetTime(eventStart), 1);
18769
18781
  }
@@ -18800,29 +18812,30 @@ class Resize extends ActionBase {
18800
18812
  const slotInterval = (this.actionObj.cellWidth / this.actionObj.slotInterval) * this.actionObj.interval;
18801
18813
  const pageWidth = isLeft ? (this.actionObj.X - this.actionObj.pageX) : (this.actionObj.pageX - this.actionObj.X);
18802
18814
  const targetWidth = isTimelineView ?
18803
- (this.actionObj.element.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth :
18804
- this.parent.currentView === 'Month' ? this.actionObj.element.offsetWidth :
18805
- Math.ceil(this.actionObj.element.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth;
18815
+ (this.actionObj.element.getBoundingClientRect().width / this.actionObj.cellWidth) * this.actionObj.cellWidth :
18816
+ this.parent.currentView === 'Month' ? this.actionObj.element.getBoundingClientRect().width :
18817
+ Math.ceil(this.actionObj.element.getBoundingClientRect().width / this.actionObj.cellWidth) * this.actionObj.cellWidth;
18806
18818
  let offsetWidth = targetWidth + (Math.ceil(pageWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth);
18819
+ const left = (this.parent.enableRtl) ? parseInt(this.actionObj.element.style.right, 10) : this.actionObj.clone.offsetLeft;
18807
18820
  if (isTimeViews) {
18808
- offsetWidth = targetWidth + (isLeft ? (Math.ceil(pageWidth / slotInterval) * slotInterval) :
18809
- (Math.floor(pageWidth / slotInterval) * slotInterval));
18821
+ offsetWidth = targetWidth + (Math.ceil(pageWidth / slotInterval) * slotInterval);
18822
+ offsetWidth = (Math.round((left + offsetWidth) / slotInterval) * slotInterval) - left;
18810
18823
  this.actionObj.event[this.parent.eventFields.isAllDay] = false;
18811
18824
  }
18812
18825
  let width = !isLeft && ((offsetWidth + this.actionObj.clone.offsetLeft > this.scrollArgs.width)) ?
18813
- this.actionObj.clone.offsetWidth : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
18826
+ this.actionObj.clone.getBoundingClientRect().width : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
18814
18827
  if (this.parent.enableRtl) {
18815
18828
  let rightValue = isTimelineView ? parseInt(this.actionObj.element.style.right, 10) :
18816
18829
  -(offsetWidth - this.actionObj.cellWidth);
18817
18830
  rightValue = isTimelineView ? rightValue : isLeft ? 0 : rightValue > 0 ? 0 : rightValue;
18818
18831
  if (isTimelineView && !isLeft) {
18819
- rightValue = Math.ceil((this.actionObj.element.offsetLeft + (this.actionObj.element.offsetWidth +
18832
+ rightValue = Math.ceil((this.actionObj.element.offsetLeft + (this.actionObj.element.getBoundingClientRect().width +
18820
18833
  (this.actionObj.pageX - this.actionObj.X))) / slotInterval) * slotInterval;
18821
18834
  rightValue = rightValue < 0 ? Math.abs(rightValue) : -rightValue;
18822
18835
  }
18823
18836
  rightValue = rightValue >= this.scrollArgs.width ? this.scrollArgs.width - this.actionObj.cellWidth : rightValue;
18824
18837
  styles.right = formatUnit(rightValue);
18825
- width = width + rightValue > this.scrollArgs.width ? this.actionObj.clone.offsetWidth : width;
18838
+ width = width + rightValue > this.scrollArgs.width ? this.actionObj.clone.getBoundingClientRect().width : width;
18826
18839
  }
18827
18840
  else {
18828
18841
  let offsetLeft = isLeft ? this.actionObj.element.offsetLeft - (this.actionObj.X - this.actionObj.pageX) :
@@ -18830,12 +18843,12 @@ class Resize extends ActionBase {
18830
18843
  if (isTimelineView) {
18831
18844
  offsetLeft = isLeft ? offsetLeft : parseInt(this.actionObj.clone.style.left, 10);
18832
18845
  if (this.parent.enableRtl) {
18833
- offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.actionObj.clone.offsetWidth) ?
18834
- parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
18846
+ offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.actionObj.clone.getBoundingClientRect().width)
18847
+ ? parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
18835
18848
  }
18836
18849
  else {
18837
- offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.actionObj.clone.offsetWidth &&
18838
- this.actionObj.clone.offsetWidth === this.actionObj.cellWidth) ?
18850
+ offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.actionObj.clone.getBoundingClientRect().width &&
18851
+ this.actionObj.clone.getBoundingClientRect().width === this.actionObj.cellWidth) ?
18839
18852
  parseInt(this.actionObj.clone.style.left, 10) : offsetLeft : offsetLeft;
18840
18853
  }
18841
18854
  }
@@ -18845,9 +18858,10 @@ class Resize extends ActionBase {
18845
18858
  Math.ceil(Math.abs(offsetLeft) / this.actionObj.cellWidth) * this.actionObj.cellWidth;
18846
18859
  if (offsetLeft < 0) {
18847
18860
  offsetLeft = 0;
18848
- width = this.actionObj.clone.offsetWidth;
18861
+ width = this.actionObj.clone.getBoundingClientRect().width;
18849
18862
  }
18850
- const cloneWidth = Math.ceil(this.actionObj.clone.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth;
18863
+ const cloneWidth = Math.ceil(this.actionObj.clone.getBoundingClientRect().width / this.actionObj.cellWidth) *
18864
+ this.actionObj.cellWidth;
18851
18865
  if (isLeft) {
18852
18866
  styles.left = formatUnit(isTimelineView ? offsetLeft : isLeft ? leftValue < 0 ? -offsetLeft :
18853
18867
  (Math.ceil((targetWidth - cloneWidth) / this.actionObj.cellWidth) * this.actionObj.cellWidth) : offsetLeft);
@@ -20413,7 +20427,7 @@ class DragAndDrop extends ActionBase {
20413
20427
  if (!isNullOrUndefined(targetDate)) {
20414
20428
  if (!this.parent.activeViewOptions.timeScale.enable || (this.parent.currentView === 'TimelineMonth')) {
20415
20429
  const eventSrt = eventObj[this.parent.eventFields.startTime];
20416
- eventStart = new Date(eventStart.setHours(eventSrt.getHours(), eventSrt.getMinutes(), eventSrt.getSeconds()));
20430
+ eventStart = new Date(targetDate.setHours(eventSrt.getHours(), eventSrt.getMinutes(), eventSrt.getSeconds()));
20417
20431
  }
20418
20432
  else {
20419
20433
  eventStart = targetDate;
@@ -21072,7 +21086,7 @@ class ViewBase {
21072
21086
  if (this.isTimelineView()) {
21073
21087
  const colElements = this.getColElements();
21074
21088
  const contentBody = this.element.querySelector('.' + CONTENT_TABLE_CLASS + ' tbody');
21075
- const colWidth = Math.ceil(contentBody.offsetWidth / (colElements.length / 2));
21089
+ const colWidth = (contentBody.getBoundingClientRect().width / (colElements.length / 2));
21076
21090
  colElements.forEach((col) => setStyleAttribute(col, { 'width': formatUnit(colWidth) }));
21077
21091
  if (content.offsetHeight !== content.clientHeight) {
21078
21092
  const resourceColumn = this.parent.element.querySelector('.' + RESOURCE_COLUMN_WRAP_CLASS);
@@ -21080,9 +21094,11 @@ class ViewBase {
21080
21094
  setStyleAttribute(resourceColumn, { 'height': formatUnit(content.clientHeight) });
21081
21095
  }
21082
21096
  }
21083
- const headerCellElements = [].slice.call(this.element.querySelectorAll('.' + HEADER_CELLS_CLASS));
21097
+ const cssClass = `.${HEADER_CELLS_CLASS},.${TIME_SLOT_CLASS},.${HEADER_WEEK_CELLS_CLASS},.${HEADER_MONTH_CELLS_CLASS},.${HEADER_YEAR_CELLS_CLASS}`;
21098
+ const headerCellElements = [].slice.call(this.element.querySelectorAll(cssClass));
21084
21099
  headerCellElements.forEach((ele) => {
21085
- const headerCellColSpan = parseInt(ele.getAttribute('colspan'), 10);
21100
+ const colSpan = isNullOrUndefined(ele.getAttribute('colspan')) ? '1' : ele.getAttribute('colspan');
21101
+ const headerCellColSpan = parseInt(colSpan, 10);
21086
21102
  setStyleAttribute(ele, { 'width': formatUnit(colWidth * headerCellColSpan) });
21087
21103
  });
21088
21104
  }