@syncfusion/ej2-layouts 28.1.33 → 28.2.4

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 (20) hide show
  1. package/README.md +1 -1
  2. package/dist/ej2-layouts.min.js +2 -2
  3. package/dist/ej2-layouts.umd.min.js +2 -2
  4. package/dist/ej2-layouts.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-layouts.es2015.js +14 -8
  6. package/dist/es6/ej2-layouts.es2015.js.map +1 -1
  7. package/dist/es6/ej2-layouts.es5.js +14 -8
  8. package/dist/es6/ej2-layouts.es5.js.map +1 -1
  9. package/dist/global/ej2-layouts.min.js +2 -2
  10. package/dist/global/ej2-layouts.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +6 -6
  13. package/src/dashboard-layout/dashboard-layout.d.ts +4 -0
  14. package/src/dashboard-layout/dashboard-layout.js +14 -8
  15. package/styles/avatar/tailwind3.css +1 -1
  16. package/styles/card/tailwind3.css +2 -2
  17. package/styles/dashboard-layout/tailwind3.css +1 -1
  18. package/styles/splitter/tailwind3.css +1 -1
  19. package/styles/tailwind3-lite.css +5 -5
  20. package/styles/tailwind3.css +5 -5
package/dist/global/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /*!
2
2
  * filename: index.d.ts
3
- * version : 28.1.33
3
+ * version : 28.2.4
4
4
  * Copyright Syncfusion Inc. 2001 - 2024. All rights reserved.
5
5
  * Use of this code is subject to the terms of our license.
6
6
  * A copy of the current license can be obtained at any time by e-mailing
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "_from": "@syncfusion/ej2-layouts@*",
3
- "_id": "@syncfusion/ej2-layouts@21.4.6",
3
+ "_id": "@syncfusion/ej2-layouts@28.2.3",
4
4
  "_inBundle": false,
5
- "_integrity": "sha512-92StvO4fbRN6YGb4IgUyal1wHizH99XJ0dhLLZzVr+d/X0VpBPE2xuwK1IZ7n42WjaHZCic3hCVOQRMJ+a6HJQ==",
5
+ "_integrity": "sha512-P+LsAf5zfQ+8Ky+n654yJQ2sJ9W53TLqXxFKijrzEKD2WjwpM/QAZ16MyP7VbP5fLIzMzltzZeivsU8+m7+EAw==",
6
6
  "_location": "/@syncfusion/ej2-layouts",
7
7
  "_phantomChildren": {},
8
8
  "_requested": {
@@ -26,8 +26,8 @@
26
26
  "/@syncfusion/ej2-react-layouts",
27
27
  "/@syncfusion/ej2-vue-layouts"
28
28
  ],
29
- "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-release/@syncfusion/ej2-layouts/-/ej2-layouts-21.4.6.tgz",
30
- "_shasum": "49561da959d8e856a733b0aee27efda61bd976b2",
29
+ "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-layouts/-/ej2-layouts-28.2.3.tgz",
30
+ "_shasum": "16816c6b4e4e620a3f0fd0cb8cb7c4d4e1dfd6ff",
31
31
  "_spec": "@syncfusion/ej2-layouts@*",
32
32
  "_where": "/jenkins/workspace/elease-automation_release_28.1.1/packages/included",
33
33
  "author": {
@@ -35,7 +35,7 @@
35
35
  },
36
36
  "bundleDependencies": false,
37
37
  "dependencies": {
38
- "@syncfusion/ej2-base": "~28.1.33"
38
+ "@syncfusion/ej2-base": "~28.2.3"
39
39
  },
40
40
  "deprecated": false,
41
41
  "description": "A package of Essential JS 2 layout pure CSS components such as card and avatar. The card is used as small container to show content in specific structure, whereas the avatars are icons, initials or figures representing particular person.",
@@ -75,7 +75,7 @@
75
75
  "url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/layouts"
76
76
  },
77
77
  "typings": "index.d.ts",
78
- "version": "28.1.33",
78
+ "version": "28.2.4",
79
79
  "sideEffects": false,
80
80
  "homepage": "https://www.syncfusion.com/javascript-ui-controls"
81
81
  }
package/src/dashboard-layout/dashboard-layout.d.ts CHANGED
@@ -477,6 +477,10 @@ export declare class DashboardLayout extends Component<HTMLElement> implements I
477
477
  protected getPanelBase(args: HTMLElement | DragEventArgs | string): HTMLElement;
478
478
  protected getPanel(row: number, column: number, excludeItems: HTMLElement[] | HTMLElement): PanelModel;
479
479
  protected setHolderPosition(args: DragEventArgs): void;
480
+ protected calculateShadowElementSize(sizeX: number, sizeY: number): {
481
+ width: string;
482
+ height: string;
483
+ };
480
484
  protected getCellInstance(idValue: string): PanelModel;
481
485
  /**
482
486
  * Allows to add a panel to the Dashboardlayout.
package/src/dashboard-layout/dashboard-layout.js CHANGED
@@ -2184,16 +2184,17 @@ var DashboardLayout = /** @class */ (function (_super) {
2184
2184
  this.updateRowsHeight(eleRowValue, eleSizeY, eleSizeY);
2185
2185
  this.updateDragArea();
2186
2186
  this.shadowEle = document.createElement('div');
2187
- this.shadowEle.classList.add('e-holder');
2188
- this.shadowEle.classList.add('e-holder-transition');
2187
+ this.shadowEle.classList.add('e-holder', 'e-holder-transition');
2189
2188
  setStyle(this.shadowEle, { 'position': 'absolute' });
2190
2189
  addClass([this.element], [preventSelect]);
2191
2190
  addClass([args.element], [dragging]);
2192
2191
  this.element.appendChild(this.shadowEle);
2193
2192
  this.renderReactTemplates();
2194
2193
  this.shadowEle = document.querySelector('.e-holder');
2195
- this.shadowEle.style.height = (this.getCellInstance(args.element.id).sizeY * this.cellSize[1]) + 'px';
2196
- this.shadowEle.style.width = (this.getCellInstance(args.element.id).sizeX * this.cellSize[0]) + 'px';
2194
+ var panelValues = this.getCellInstance(args.element.id);
2195
+ var shadowSize = this.calculateShadowElementSize(panelValues.sizeX, panelValues.sizeY);
2196
+ this.shadowEle.style.height = shadowSize.height;
2197
+ this.shadowEle.style.width = shadowSize.width;
2197
2198
  var panelInstance = this.getCellInstance(args.element.id);
2198
2199
  this.setPanelPosition(this.shadowEle, panelInstance.row, panelInstance.col);
2199
2200
  }
@@ -2329,12 +2330,17 @@ var DashboardLayout = /** @class */ (function (_super) {
2329
2330
  var heightValue = this.getCellSize()[1];
2330
2331
  var top = row === 0 ? 0 : (((row) * (heightValue + this.cellSpacing[1])));
2331
2332
  var left = col === 0 ? 0 : (((col) * (widthValue + this.cellSpacing[0])));
2332
- var cellSizeOne = this.getCellSize()[1];
2333
- var cellSizeZero = this.getCellSize()[0];
2334
2333
  this.elementRef.top = this.shadowEle.style.top = top + 'px';
2335
2334
  this.elementRef.left = this.shadowEle.style.left = left + 'px';
2336
- this.elementRef.height = this.shadowEle.style.height = ((sizeY * cellSizeOne) + ((sizeY - 1) * this.cellSpacing[1])) + 'px';
2337
- this.elementRef.width = this.shadowEle.style.width = ((sizeX * cellSizeZero) + ((sizeX - 1) * this.cellSpacing[0])) + 'px';
2335
+ var shadowSize = this.calculateShadowElementSize(sizeX, sizeY);
2336
+ this.elementRef.height = this.shadowEle.style.height = shadowSize.height;
2337
+ this.elementRef.width = this.shadowEle.style.width = shadowSize.width;
2338
+ };
2339
+ DashboardLayout.prototype.calculateShadowElementSize = function (sizeX, sizeY) {
2340
+ return {
2341
+ width: (sizeX * this.cellSize[0]) + ((sizeX - 1) * this.cellSpacing[0]) + 'px',
2342
+ height: (sizeY * this.cellSize[1]) + ((sizeY - 1) * this.cellSpacing[1]) + 'px'
2343
+ };
2338
2344
  };
2339
2345
  DashboardLayout.prototype.getCellInstance = function (idValue) {
2340
2346
  var currentCellInstance;
package/styles/avatar/tailwind3.css CHANGED
@@ -17,7 +17,7 @@
17
17
  display: -webkit-inline-box;
18
18
  display: -ms-inline-flexbox;
19
19
  display: inline-flex;
20
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
20
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
21
21
  font-size: 24px;
22
22
  font-weight: 400;
23
23
  height: 40px;
package/styles/card/tailwind3.css CHANGED
@@ -13,7 +13,7 @@
13
13
  -webkit-box-direction: normal;
14
14
  -ms-flex-direction: column;
15
15
  flex-direction: column;
16
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
16
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
17
17
  font-size: 15px;
18
18
  -webkit-box-pack: center;
19
19
  -ms-flex-pack: center;
@@ -326,7 +326,7 @@
326
326
  }
327
327
  .e-card .e-card-actions .e-card-btn,
328
328
  .e-card .e-card-actions a {
329
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
329
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
330
330
  font-size: 14px;
331
331
  line-height: 30px;
332
332
  margin: 0 0 0 8px;
package/styles/dashboard-layout/tailwind3.css CHANGED
@@ -126,7 +126,7 @@
126
126
  .e-dashboardlayout.e-control .e-panel .e-panel-header {
127
127
  border-bottom: 1px solid var(--color-sf-border-light);
128
128
  color: var(--color-sf-content-text-color);
129
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
129
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
130
130
  font-size: 16px;
131
131
  font-weight: 400;
132
132
  height: 38px;
package/styles/splitter/tailwind3.css CHANGED
@@ -28,7 +28,7 @@
28
28
  -webkit-box-flex: 1;
29
29
  -ms-flex: 1 1 auto;
30
30
  flex: 1 1 auto;
31
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
31
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
32
32
  font-size: 14px;
33
33
  font-weight: 400;
34
34
  }
package/styles/tailwind3-lite.css CHANGED
@@ -17,7 +17,7 @@
17
17
  display: -webkit-inline-box;
18
18
  display: -ms-inline-flexbox;
19
19
  display: inline-flex;
20
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
20
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
21
21
  font-size: 24px;
22
22
  font-weight: 400;
23
23
  height: 40px;
@@ -75,7 +75,7 @@
75
75
  -webkit-box-direction: normal;
76
76
  -ms-flex-direction: column;
77
77
  flex-direction: column;
78
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
78
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
79
79
  font-size: 15px;
80
80
  -webkit-box-pack: center;
81
81
  -ms-flex-pack: center;
@@ -388,7 +388,7 @@
388
388
  }
389
389
  .e-card .e-card-actions .e-card-btn,
390
390
  .e-card .e-card-actions a {
391
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
391
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
392
392
  font-size: 14px;
393
393
  line-height: 30px;
394
394
  margin: 0 0 0 8px;
@@ -508,7 +508,7 @@
508
508
  -webkit-box-flex: 1;
509
509
  -ms-flex: 1 1 auto;
510
510
  flex: 1 1 auto;
511
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
511
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
512
512
  font-size: 14px;
513
513
  font-weight: 400;
514
514
  }
@@ -1110,7 +1110,7 @@
1110
1110
  .e-dashboardlayout.e-control .e-panel .e-panel-header {
1111
1111
  border-bottom: 1px solid var(--color-sf-border-light);
1112
1112
  color: var(--color-sf-content-text-color);
1113
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
1113
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
1114
1114
  font-size: 16px;
1115
1115
  font-weight: 400;
1116
1116
  height: 38px;
package/styles/tailwind3.css CHANGED
@@ -17,7 +17,7 @@
17
17
  display: -webkit-inline-box;
18
18
  display: -ms-inline-flexbox;
19
19
  display: inline-flex;
20
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
20
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
21
21
  font-size: 24px;
22
22
  font-weight: 400;
23
23
  height: 40px;
@@ -75,7 +75,7 @@
75
75
  -webkit-box-direction: normal;
76
76
  -ms-flex-direction: column;
77
77
  flex-direction: column;
78
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
78
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
79
79
  font-size: 15px;
80
80
  -webkit-box-pack: center;
81
81
  -ms-flex-pack: center;
@@ -388,7 +388,7 @@
388
388
  }
389
389
  .e-card .e-card-actions .e-card-btn,
390
390
  .e-card .e-card-actions a {
391
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
391
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
392
392
  font-size: 14px;
393
393
  line-height: 30px;
394
394
  margin: 0 0 0 8px;
@@ -637,7 +637,7 @@
637
637
  -webkit-box-flex: 1;
638
638
  -ms-flex: 1 1 auto;
639
639
  flex: 1 1 auto;
640
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
640
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
641
641
  font-size: 14px;
642
642
  font-weight: 400;
643
643
  }
@@ -1279,7 +1279,7 @@
1279
1279
  .e-dashboardlayout.e-control .e-panel .e-panel-header {
1280
1280
  border-bottom: 1px solid var(--color-sf-border-light);
1281
1281
  color: var(--color-sf-content-text-color);
1282
- font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
1282
+ font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
1283
1283
  font-size: 16px;
1284
1284
  font-weight: 400;
1285
1285
  height: 38px;