@progress/kendo-angular-layout 6.4.2-dev.202201251524 → 6.5.0-dev.202202140804

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 (73) hide show
  1. package/dist/cdn/js/kendo-angular-layout.js +2 -2
  2. package/dist/cdn/main.js +1 -1
  3. package/dist/es/common/util.js +4 -0
  4. package/dist/es/expansionpanel/expansionpanel.component.js +1 -0
  5. package/dist/es/gridlayout.module.js +31 -0
  6. package/dist/es/layout.module.js +5 -1
  7. package/dist/es/layouts/grid-layout.component.js +155 -0
  8. package/dist/es/layouts/gridlayout-item.component.js +52 -0
  9. package/dist/es/layouts/models/gridlayout-gap-settings.js +4 -0
  10. package/dist/es/layouts/models/gridlayout-row-col-size.js +4 -0
  11. package/dist/es/layouts/models/layout-align-settings.js +4 -0
  12. package/dist/es/layouts/models/layout-horizontal-align.js +4 -0
  13. package/dist/es/layouts/models/layout-vertical-align.js +4 -0
  14. package/dist/es/layouts/models.js +4 -0
  15. package/dist/es/layouts/stack-layout.component.js +171 -0
  16. package/dist/es/layouts/util.js +102 -0
  17. package/dist/es/main.js +7 -0
  18. package/dist/es/package-metadata.js +1 -1
  19. package/dist/es/stacklayout.module.js +29 -0
  20. package/dist/es2015/common/orientation.d.ts +1 -1
  21. package/dist/es2015/common/util.d.ts +4 -0
  22. package/dist/es2015/common/util.js +4 -0
  23. package/dist/es2015/expansionpanel/expansionpanel.component.js +1 -0
  24. package/dist/es2015/gridlayout.module.d.ts +10 -0
  25. package/dist/es2015/gridlayout.module.js +30 -0
  26. package/dist/es2015/index.metadata.json +1 -1
  27. package/dist/es2015/layout.module.js +5 -1
  28. package/dist/es2015/layouts/grid-layout.component.d.ts +63 -0
  29. package/dist/es2015/layouts/grid-layout.component.js +144 -0
  30. package/dist/es2015/layouts/gridlayout-item.component.d.ts +33 -0
  31. package/dist/es2015/layouts/gridlayout-item.component.js +53 -0
  32. package/dist/es2015/layouts/models/gridlayout-gap-settings.d.ts +17 -0
  33. package/dist/es2015/layouts/models/gridlayout-gap-settings.js +4 -0
  34. package/dist/es2015/layouts/models/gridlayout-row-col-size.d.ts +22 -0
  35. package/dist/es2015/layouts/models/gridlayout-row-col-size.js +4 -0
  36. package/dist/es2015/layouts/models/layout-align-settings.d.ts +18 -0
  37. package/dist/es2015/layouts/models/layout-align-settings.js +4 -0
  38. package/dist/es2015/layouts/models/layout-horizontal-align.d.ts +8 -0
  39. package/dist/es2015/layouts/models/layout-horizontal-align.js +4 -0
  40. package/dist/es2015/layouts/models/layout-vertical-align.d.ts +8 -0
  41. package/dist/es2015/layouts/models/layout-vertical-align.js +4 -0
  42. package/dist/es2015/layouts/models.d.ts +10 -0
  43. package/dist/es2015/layouts/models.js +4 -0
  44. package/dist/es2015/layouts/stack-layout.component.d.ts +47 -0
  45. package/dist/es2015/layouts/stack-layout.component.js +152 -0
  46. package/dist/es2015/layouts/util.d.ts +42 -0
  47. package/dist/es2015/layouts/util.js +101 -0
  48. package/dist/es2015/main.d.ts +7 -0
  49. package/dist/es2015/main.js +7 -0
  50. package/dist/es2015/package-metadata.js +1 -1
  51. package/dist/es2015/stacklayout.module.d.ts +10 -0
  52. package/dist/es2015/stacklayout.module.js +28 -0
  53. package/dist/fesm2015/index.js +469 -4
  54. package/dist/fesm5/index.js +501 -4
  55. package/dist/npm/common/util.js +4 -0
  56. package/dist/npm/expansionpanel/expansionpanel.component.js +1 -0
  57. package/dist/npm/gridlayout.module.js +33 -0
  58. package/dist/npm/layout.module.js +5 -1
  59. package/dist/npm/layouts/grid-layout.component.js +157 -0
  60. package/dist/npm/layouts/gridlayout-item.component.js +54 -0
  61. package/dist/npm/layouts/models/gridlayout-gap-settings.js +6 -0
  62. package/dist/npm/layouts/models/gridlayout-row-col-size.js +6 -0
  63. package/dist/npm/layouts/models/layout-align-settings.js +6 -0
  64. package/dist/npm/layouts/models/layout-horizontal-align.js +6 -0
  65. package/dist/npm/layouts/models/layout-vertical-align.js +6 -0
  66. package/dist/npm/layouts/models.js +6 -0
  67. package/dist/npm/layouts/stack-layout.component.js +173 -0
  68. package/dist/npm/layouts/util.js +104 -0
  69. package/dist/npm/main.js +12 -0
  70. package/dist/npm/package-metadata.js +1 -1
  71. package/dist/npm/stacklayout.module.js +31 -0
  72. package/dist/systemjs/kendo-angular-layout.js +1 -1
  73. package/package.json +10 -8
@@ -84,4 +84,8 @@ export var getStylingClasses = function (componentType, stylingOption, previousV
84
84
  * @hidden
85
85
  */
86
86
  export var mapShapeToRounded = function (shape) { return SHAPE_TO_ROUNDED[shape] || null; };
87
+ /**
88
+ * @hidden
89
+ */
90
+ export var isNumber = function (value) { return typeof value === 'number' && isFinite(value); };
87
91
  export { ɵ0 };
@@ -166,6 +166,7 @@ var ExpansionPanelComponent = /** @class */ (function () {
166
166
  };
167
167
  ExpansionPanelComponent.prototype.ngOnInit = function () {
168
168
  var _this = this;
169
+ this.renderer.removeAttribute(this.hostElement.nativeElement, 'title');
169
170
  this.subscriptions = this.localizationService.changes.subscribe(function (_a) {
170
171
  var rtl = _a.rtl;
171
172
  _this.direction = rtl ? 'rtl' : 'ltr';
@@ -0,0 +1,31 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import * as tslib_1 from "tslib";
6
+ import { NgModule } from '@angular/core';
7
+ import { CommonModule } from '@angular/common';
8
+ import { GridLayoutComponent } from './layouts/grid-layout.component';
9
+ import { GridLayoutItemComponent } from './layouts/gridlayout-item.component';
10
+ var exportedModules = [
11
+ GridLayoutComponent,
12
+ GridLayoutItemComponent
13
+ ];
14
+ var declarations = exportedModules.slice();
15
+ /**
16
+ * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
17
+ * definition for the GridLayout component.
18
+ */
19
+ var GridLayoutModule = /** @class */ (function () {
20
+ function GridLayoutModule() {
21
+ }
22
+ GridLayoutModule = tslib_1.__decorate([
23
+ NgModule({
24
+ declarations: [declarations],
25
+ exports: [exportedModules],
26
+ imports: [CommonModule]
27
+ })
28
+ ], GridLayoutModule);
29
+ return GridLayoutModule;
30
+ }());
31
+ export { GridLayoutModule };
@@ -13,6 +13,8 @@ import { SplitterModule } from './splitter.module';
13
13
  import { StepperModule } from './stepper.module';
14
14
  import { TabStripModule } from './tabstrip.module';
15
15
  import { TileLayoutModule } from './tilelayout.module';
16
+ import { StackLayoutModule } from './stacklayout.module';
17
+ import { GridLayoutModule } from './gridlayout.module';
16
18
  /**
17
19
  * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
18
20
  * definition for the Layout components.
@@ -58,7 +60,9 @@ var LayoutModule = /** @class */ (function () {
58
60
  SplitterModule,
59
61
  StepperModule,
60
62
  TabStripModule,
61
- TileLayoutModule
63
+ TileLayoutModule,
64
+ StackLayoutModule,
65
+ GridLayoutModule
62
66
  ]
63
67
  })
64
68
  ], LayoutModule);
@@ -0,0 +1,155 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import * as tslib_1 from "tslib";
6
+ import { Component, HostBinding, Input, Renderer2, ElementRef, isDevMode } from '@angular/core';
7
+ import { validatePackage } from '@progress/kendo-licensing';
8
+ import { packageMetadata } from '../package-metadata';
9
+ import { ALIGN_PREFIX, generateGapStyle, generateGridStyle, GRID_JUSTIFY_PREFIX, normalizeGap, VERTICAL_SUFFIX, validateGridLayoutRowsCols } from './util';
10
+ import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
11
+ import { isPresent } from '../common/util';
12
+ import { isChanged } from '@progress/kendo-angular-common';
13
+ /**
14
+ * Represents the [Kendo UI GridLayout component for Angular]({% slug overview_gridlayout %}).
15
+ */
16
+ var GridLayoutComponent = /** @class */ (function () {
17
+ function GridLayoutComponent(renderer, element, localization) {
18
+ this.renderer = renderer;
19
+ this.element = element;
20
+ this.localization = localization;
21
+ this.hostClass = true;
22
+ /**
23
+ * Specifies the gaps between the elements. The default value is `0`
24
+ * ([see example]({% slug layout_gridlayout %}#toc-gaps)).
25
+ */
26
+ this.gap = 0;
27
+ this._align = {
28
+ horizontal: 'stretch',
29
+ vertical: 'stretch'
30
+ };
31
+ validatePackage(packageMetadata);
32
+ }
33
+ Object.defineProperty(GridLayoutComponent.prototype, "dir", {
34
+ get: function () {
35
+ return this.direction;
36
+ },
37
+ enumerable: true,
38
+ configurable: true
39
+ });
40
+ Object.defineProperty(GridLayoutComponent.prototype, "align", {
41
+ get: function () {
42
+ return this._align;
43
+ },
44
+ /**
45
+ * Specifies the horizontal and vertical alignment of the inner GridLayout elements
46
+ * ([see example]({% slug layout_gridlayout %}#toc-alignment)).
47
+ */
48
+ set: function (align) {
49
+ this._align = Object.assign({}, this._align, align);
50
+ this.handleAlignClasses();
51
+ },
52
+ enumerable: true,
53
+ configurable: true
54
+ });
55
+ GridLayoutComponent.prototype.ngAfterViewInit = function () {
56
+ this.handleAlignClasses();
57
+ this.handleGridTemplateStyling('rows');
58
+ this.handleGridTemplateStyling('cols');
59
+ this.setGap();
60
+ };
61
+ GridLayoutComponent.prototype.ngOnChanges = function (changes) {
62
+ if (isChanged('gap', changes)) {
63
+ this.setGap();
64
+ }
65
+ if (isChanged('rows', changes)) {
66
+ this.handleGridTemplateStyling('rows');
67
+ }
68
+ if (isChanged('cols', changes)) {
69
+ this.handleGridTemplateStyling('cols');
70
+ }
71
+ };
72
+ GridLayoutComponent.prototype.handleAlignClasses = function () {
73
+ var elem = this.element.nativeElement;
74
+ if (isPresent(this.justifyClass)) {
75
+ this.renderer.removeClass(elem, this.justifyClass);
76
+ }
77
+ if (isPresent(this.alignClass)) {
78
+ this.renderer.removeClass(elem, this.alignClass);
79
+ }
80
+ this.justifyClass = GRID_JUSTIFY_PREFIX + "-" + this.align.horizontal;
81
+ this.alignClass = ALIGN_PREFIX + "-" + VERTICAL_SUFFIX[this.align.vertical];
82
+ this.renderer.addClass(elem, this.justifyClass);
83
+ this.renderer.addClass(elem, this.alignClass);
84
+ };
85
+ GridLayoutComponent.prototype.setGap = function () {
86
+ var parsedGap = normalizeGap(this.gap);
87
+ var gapStyle = generateGapStyle(parsedGap);
88
+ this.renderer.setStyle(this.element.nativeElement, 'gap', gapStyle);
89
+ };
90
+ GridLayoutComponent.prototype.handleGridTemplateStyling = function (type) {
91
+ if (!isPresent(this[type])) {
92
+ return;
93
+ }
94
+ var isValid = validateGridLayoutRowsCols(this[type]);
95
+ if (!isValid && isDevMode()) {
96
+ var valueType = type === 'rows' ? 'GridLayoutRowSize' : 'GridLayoutColSize';
97
+ throw new Error("The provided " + type + " value contains invalid elements. The array supports values of type number, string or " + valueType + ".");
98
+ }
99
+ var gridTemplateStyle = type === 'rows' ? 'grid-template-rows' : 'grid-template-columns';
100
+ var gridStyle = generateGridStyle(this[type], type);
101
+ this.renderer.setStyle(this.element.nativeElement, gridTemplateStyle, gridStyle.join(' '));
102
+ };
103
+ Object.defineProperty(GridLayoutComponent.prototype, "direction", {
104
+ get: function () {
105
+ return this.localization.rtl ? 'rtl' : 'ltr';
106
+ },
107
+ enumerable: true,
108
+ configurable: true
109
+ });
110
+ tslib_1.__decorate([
111
+ HostBinding('class.k-grid-layout'),
112
+ tslib_1.__metadata("design:type", Boolean)
113
+ ], GridLayoutComponent.prototype, "hostClass", void 0);
114
+ tslib_1.__decorate([
115
+ HostBinding('attr.dir'),
116
+ tslib_1.__metadata("design:type", String),
117
+ tslib_1.__metadata("design:paramtypes", [])
118
+ ], GridLayoutComponent.prototype, "dir", null);
119
+ tslib_1.__decorate([
120
+ Input(),
121
+ tslib_1.__metadata("design:type", Array)
122
+ ], GridLayoutComponent.prototype, "rows", void 0);
123
+ tslib_1.__decorate([
124
+ Input(),
125
+ tslib_1.__metadata("design:type", Array)
126
+ ], GridLayoutComponent.prototype, "cols", void 0);
127
+ tslib_1.__decorate([
128
+ Input(),
129
+ tslib_1.__metadata("design:type", Object)
130
+ ], GridLayoutComponent.prototype, "gap", void 0);
131
+ tslib_1.__decorate([
132
+ Input(),
133
+ tslib_1.__metadata("design:type", Object),
134
+ tslib_1.__metadata("design:paramtypes", [Object])
135
+ ], GridLayoutComponent.prototype, "align", null);
136
+ GridLayoutComponent = tslib_1.__decorate([
137
+ Component({
138
+ exportAs: 'kendoGridLayout',
139
+ selector: 'kendo-gridlayout',
140
+ providers: [
141
+ LocalizationService,
142
+ {
143
+ provide: L10N_PREFIX,
144
+ useValue: 'kendo.gridlayout'
145
+ }
146
+ ],
147
+ template: "\n <ng-content></ng-content>\n "
148
+ }),
149
+ tslib_1.__metadata("design:paramtypes", [Renderer2,
150
+ ElementRef,
151
+ LocalizationService])
152
+ ], GridLayoutComponent);
153
+ return GridLayoutComponent;
154
+ }());
155
+ export { GridLayoutComponent };
@@ -0,0 +1,52 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import * as tslib_1 from "tslib";
6
+ import { Component, Input, Renderer2, ElementRef } from '@angular/core';
7
+ var GridLayoutItemComponent = /** @class */ (function () {
8
+ function GridLayoutItemComponent(renderer, element) {
9
+ this.renderer = renderer;
10
+ this.element = element;
11
+ }
12
+ GridLayoutItemComponent.prototype.ngOnInit = function () {
13
+ this.setItemStyle();
14
+ };
15
+ GridLayoutItemComponent.prototype.ngOnChanges = function () {
16
+ this.setItemStyle();
17
+ };
18
+ GridLayoutItemComponent.prototype.setItemStyle = function () {
19
+ var row = this.row || 'auto';
20
+ var col = this.col || 'auto';
21
+ var rowSpan = this.rowSpan ? "span " + this.rowSpan : 'auto';
22
+ var colSpan = this.colSpan ? "span " + this.colSpan : 'auto';
23
+ var gridAreaStyle = row + " / " + col + " / " + rowSpan + " / " + colSpan;
24
+ this.renderer.setStyle(this.element.nativeElement, 'grid-area', gridAreaStyle);
25
+ };
26
+ tslib_1.__decorate([
27
+ Input(),
28
+ tslib_1.__metadata("design:type", Number)
29
+ ], GridLayoutItemComponent.prototype, "row", void 0);
30
+ tslib_1.__decorate([
31
+ Input(),
32
+ tslib_1.__metadata("design:type", Number)
33
+ ], GridLayoutItemComponent.prototype, "col", void 0);
34
+ tslib_1.__decorate([
35
+ Input(),
36
+ tslib_1.__metadata("design:type", Number)
37
+ ], GridLayoutItemComponent.prototype, "rowSpan", void 0);
38
+ tslib_1.__decorate([
39
+ Input(),
40
+ tslib_1.__metadata("design:type", Number)
41
+ ], GridLayoutItemComponent.prototype, "colSpan", void 0);
42
+ GridLayoutItemComponent = tslib_1.__decorate([
43
+ Component({
44
+ selector: 'kendo-gridlayout-item',
45
+ template: "\n <ng-content></ng-content>\n "
46
+ }),
47
+ tslib_1.__metadata("design:paramtypes", [Renderer2,
48
+ ElementRef])
49
+ ], GridLayoutItemComponent);
50
+ return GridLayoutItemComponent;
51
+ }());
52
+ export { GridLayoutItemComponent };
@@ -0,0 +1,4 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
@@ -0,0 +1,4 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
@@ -0,0 +1,4 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
@@ -0,0 +1,4 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
@@ -0,0 +1,4 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
@@ -0,0 +1,4 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
@@ -0,0 +1,171 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import * as tslib_1 from "tslib";
6
+ import { Component, HostBinding, Input, Renderer2, ElementRef } from '@angular/core';
7
+ import { VERTICAL_SUFFIX, ALIGN_PREFIX, JUSTIFY_PREFIX } from './util';
8
+ import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
9
+ import { isNumber, isPresent } from '../common/util';
10
+ import { validatePackage } from '@progress/kendo-licensing';
11
+ import { packageMetadata } from '../package-metadata';
12
+ import { isChanged } from '@progress/kendo-angular-common';
13
+ /**
14
+ * Represents the [Kendo UI StackLayout component for Angular]({% slug overview_stacklayout %}).
15
+ */
16
+ var StackLayoutComponent = /** @class */ (function () {
17
+ function StackLayoutComponent(renderer, element, localization) {
18
+ this.renderer = renderer;
19
+ this.element = element;
20
+ this.localization = localization;
21
+ this.hostClass = true;
22
+ /**
23
+ * Specifies the gap between the inner StackLayout elements. The default value is `0`
24
+ * ([see example]({% slug layout_stacklayout %}#toc-gaps)).
25
+ */
26
+ this.gap = 0;
27
+ /**
28
+ * Specifies the orientation of the StackLayout
29
+ * ([see example]({% slug layout_stacklayout %}#toc-orientation)).
30
+ *
31
+ * The possible values are:
32
+ * (Default) `horizontal`
33
+ * `vertical`
34
+ */
35
+ this.orientation = 'horizontal';
36
+ this._align = {
37
+ horizontal: 'stretch',
38
+ vertical: 'stretch'
39
+ };
40
+ validatePackage(packageMetadata);
41
+ }
42
+ Object.defineProperty(StackLayoutComponent.prototype, "horizontalClass", {
43
+ get: function () {
44
+ return this.orientation === 'horizontal';
45
+ },
46
+ enumerable: true,
47
+ configurable: true
48
+ });
49
+ Object.defineProperty(StackLayoutComponent.prototype, "verticalClass", {
50
+ get: function () {
51
+ return this.orientation === 'vertical';
52
+ },
53
+ enumerable: true,
54
+ configurable: true
55
+ });
56
+ Object.defineProperty(StackLayoutComponent.prototype, "dir", {
57
+ get: function () {
58
+ return this.direction;
59
+ },
60
+ enumerable: true,
61
+ configurable: true
62
+ });
63
+ Object.defineProperty(StackLayoutComponent.prototype, "align", {
64
+ get: function () {
65
+ return this._align;
66
+ },
67
+ /**
68
+ * Specifies the horizontal and vertical alignment of the inner StackLayout elements
69
+ * ([see example]({% slug layout_stacklayout %}#toc-alignment)).
70
+ */
71
+ set: function (align) {
72
+ this._align = Object.assign({}, this._align, align);
73
+ this.handleAlignClasses();
74
+ },
75
+ enumerable: true,
76
+ configurable: true
77
+ });
78
+ StackLayoutComponent.prototype.ngAfterViewInit = function () {
79
+ this.handleAlignClasses();
80
+ this.setGap();
81
+ };
82
+ StackLayoutComponent.prototype.ngOnChanges = function (changes) {
83
+ if (isChanged('gap', changes)) {
84
+ this.setGap();
85
+ }
86
+ if (isChanged('orientation', changes)) {
87
+ this.handleAlignClasses();
88
+ }
89
+ };
90
+ StackLayoutComponent.prototype.handleAlignClasses = function () {
91
+ var elem = this.element.nativeElement;
92
+ if (isPresent(this.justifyClass)) {
93
+ this.renderer.removeClass(elem, this.justifyClass);
94
+ }
95
+ if (isPresent(this.alignClass)) {
96
+ this.renderer.removeClass(elem, this.alignClass);
97
+ }
98
+ if (this.orientation === 'horizontal') {
99
+ this.justifyClass = JUSTIFY_PREFIX + "-" + this.align.horizontal;
100
+ this.alignClass = ALIGN_PREFIX + "-" + VERTICAL_SUFFIX[this.align.vertical];
101
+ }
102
+ else {
103
+ this.justifyClass = JUSTIFY_PREFIX + "-" + VERTICAL_SUFFIX[this.align.vertical];
104
+ this.alignClass = ALIGN_PREFIX + "-" + this.align.horizontal;
105
+ }
106
+ this.renderer.addClass(elem, this.justifyClass);
107
+ this.renderer.addClass(elem, this.alignClass);
108
+ };
109
+ StackLayoutComponent.prototype.setGap = function () {
110
+ var parsedGap = isNumber(this.gap) ? this.gap + "px" : this.gap;
111
+ this.renderer.setStyle(this.element.nativeElement, 'gap', parsedGap);
112
+ };
113
+ Object.defineProperty(StackLayoutComponent.prototype, "direction", {
114
+ get: function () {
115
+ return this.localization.rtl ? 'rtl' : 'ltr';
116
+ },
117
+ enumerable: true,
118
+ configurable: true
119
+ });
120
+ tslib_1.__decorate([
121
+ HostBinding('class.k-stack-layout'),
122
+ tslib_1.__metadata("design:type", Boolean)
123
+ ], StackLayoutComponent.prototype, "hostClass", void 0);
124
+ tslib_1.__decorate([
125
+ HostBinding('class.k-hstack'),
126
+ tslib_1.__metadata("design:type", Boolean),
127
+ tslib_1.__metadata("design:paramtypes", [])
128
+ ], StackLayoutComponent.prototype, "horizontalClass", null);
129
+ tslib_1.__decorate([
130
+ HostBinding('class.k-vstack'),
131
+ tslib_1.__metadata("design:type", Boolean),
132
+ tslib_1.__metadata("design:paramtypes", [])
133
+ ], StackLayoutComponent.prototype, "verticalClass", null);
134
+ tslib_1.__decorate([
135
+ HostBinding('attr.dir'),
136
+ tslib_1.__metadata("design:type", String),
137
+ tslib_1.__metadata("design:paramtypes", [])
138
+ ], StackLayoutComponent.prototype, "dir", null);
139
+ tslib_1.__decorate([
140
+ Input(),
141
+ tslib_1.__metadata("design:type", Object),
142
+ tslib_1.__metadata("design:paramtypes", [Object])
143
+ ], StackLayoutComponent.prototype, "align", null);
144
+ tslib_1.__decorate([
145
+ Input(),
146
+ tslib_1.__metadata("design:type", Object)
147
+ ], StackLayoutComponent.prototype, "gap", void 0);
148
+ tslib_1.__decorate([
149
+ Input(),
150
+ tslib_1.__metadata("design:type", String)
151
+ ], StackLayoutComponent.prototype, "orientation", void 0);
152
+ StackLayoutComponent = tslib_1.__decorate([
153
+ Component({
154
+ exportAs: 'kendoStackLayout',
155
+ selector: 'kendo-stacklayout',
156
+ providers: [
157
+ LocalizationService,
158
+ {
159
+ provide: L10N_PREFIX,
160
+ useValue: 'kendo.stacklayout'
161
+ }
162
+ ],
163
+ template: "\n <ng-content></ng-content>\n "
164
+ }),
165
+ tslib_1.__metadata("design:paramtypes", [Renderer2,
166
+ ElementRef,
167
+ LocalizationService])
168
+ ], StackLayoutComponent);
169
+ return StackLayoutComponent;
170
+ }());
171
+ export { StackLayoutComponent };
@@ -0,0 +1,102 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ /**
6
+ * @hidden
7
+ */
8
+ export var VERTICAL_SUFFIX = {
9
+ top: 'start',
10
+ middle: 'center',
11
+ bottom: 'end',
12
+ stretch: 'stretch'
13
+ };
14
+ /**
15
+ * @hidden
16
+ */
17
+ export var JUSTIFY_PREFIX = "k-justify-content";
18
+ /**
19
+ * @hidden
20
+ */
21
+ export var GRID_JUSTIFY_PREFIX = "k-justify-items";
22
+ /**
23
+ * @hidden
24
+ */
25
+ export var ALIGN_PREFIX = "k-align-items";
26
+ /**
27
+ * @hidden
28
+ */
29
+ export var normalizeGap = function (gap) {
30
+ if (typeof gap === 'number' || typeof gap === 'string') {
31
+ return { cols: gap, rows: gap };
32
+ }
33
+ else {
34
+ var parsedGap = {};
35
+ parsedGap.rows = gap.rows ? gap.rows : 0;
36
+ parsedGap.cols = gap.cols ? gap.cols : 0;
37
+ return parsedGap;
38
+ }
39
+ };
40
+ /**
41
+ * @hidden
42
+ */
43
+ export var generateGapStyle = function (gap) {
44
+ if (gap.rows === gap.cols) {
45
+ return typeof gap.rows === 'number' ? gap.rows + "px" : gap.rows;
46
+ }
47
+ else {
48
+ var rowStyle = "" + (typeof gap.rows === 'number' ? gap.rows + 'px' : gap.rows);
49
+ var colStyle = "" + (typeof gap.cols === 'number' ? gap.cols + 'px' : gap.cols);
50
+ return rowStyle + " " + colStyle;
51
+ }
52
+ };
53
+ /**
54
+ * @hidden
55
+ */
56
+ export var generateGridStyle = function (items, itemType) {
57
+ var styling = [];
58
+ items.forEach(function (item) {
59
+ if (typeof item === 'number') {
60
+ styling.push(item + "px");
61
+ }
62
+ else if (typeof item === 'string') {
63
+ styling.push(item);
64
+ }
65
+ else {
66
+ if (itemType === 'rows') {
67
+ var rowHeight = item.height;
68
+ if (rowHeight) {
69
+ styling.push(typeof rowHeight === 'number' ? rowHeight + "px" : rowHeight);
70
+ }
71
+ else {
72
+ styling.push('0px');
73
+ }
74
+ }
75
+ else {
76
+ var colWidth = item.width;
77
+ if (colWidth) {
78
+ styling.push(typeof colWidth === 'number' ? colWidth + "px" : colWidth);
79
+ }
80
+ else {
81
+ styling.push('0px');
82
+ }
83
+ }
84
+ }
85
+ });
86
+ return styling;
87
+ };
88
+ /**
89
+ * @hidden
90
+ */
91
+ export var validateGridLayoutRowsCols = function (arr) {
92
+ for (var _i = 0, arr_1 = arr; _i < arr_1.length; _i++) {
93
+ var el = arr_1[_i];
94
+ var isNum = typeof el === 'number';
95
+ var isStr = typeof el === 'string';
96
+ var isObject = typeof el === 'object' && el !== null;
97
+ if (!isNum && !isStr && !isObject) {
98
+ return false;
99
+ }
100
+ }
101
+ return true;
102
+ };
package/dist/es/main.js CHANGED
@@ -63,3 +63,10 @@ export { StepperModule } from './stepper.module';
63
63
  export { TabStripModule } from './tabstrip.module';
64
64
  export { ExpansionPanelModule } from './expansionpanel.module';
65
65
  export { TileLayoutModule } from './tilelayout.module';
66
+ export { StackLayoutModule } from './stacklayout.module';
67
+ export { GridLayoutModule } from './gridlayout.module';
68
+ // StackLayout exports
69
+ export { StackLayoutComponent } from './layouts/stack-layout.component';
70
+ // GridLayout exports
71
+ export { GridLayoutComponent } from './layouts/grid-layout.component';
72
+ export { GridLayoutItemComponent } from './layouts/gridlayout-item.component';
@@ -9,7 +9,7 @@ export var packageMetadata = {
9
9
  name: '@progress/kendo-angular-layout',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1643124181,
12
+ publishDate: 1644825801,
13
13
  version: '',
14
14
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
15
15
  };
@@ -0,0 +1,29 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import * as tslib_1 from "tslib";
6
+ import { NgModule } from '@angular/core';
7
+ import { CommonModule } from '@angular/common';
8
+ import { StackLayoutComponent } from './layouts/stack-layout.component';
9
+ var exportedModules = [
10
+ StackLayoutComponent
11
+ ];
12
+ var declarations = exportedModules.slice();
13
+ /**
14
+ * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
15
+ * definition for the StackLayout component.
16
+ */
17
+ var StackLayoutModule = /** @class */ (function () {
18
+ function StackLayoutModule() {
19
+ }
20
+ StackLayoutModule = tslib_1.__decorate([
21
+ NgModule({
22
+ declarations: [declarations],
23
+ exports: [exportedModules],
24
+ imports: [CommonModule]
25
+ })
26
+ ], StackLayoutModule);
27
+ return StackLayoutModule;
28
+ }());
29
+ export { StackLayoutModule };
@@ -3,6 +3,6 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  /**
6
- * Specifies the orientation of the items within the component.
6
+ * Specifies the orientation of layouts in different scenarios.
7
7
  */
8
8
  export declare type Orientation = 'horizontal' | 'vertical';
@@ -38,3 +38,7 @@ export declare const getStylingClasses: (componentType: any, stylingOption: stri
38
38
  * @hidden
39
39
  */
40
40
  export declare const mapShapeToRounded: (shape: AvatarShape) => AvatarRounded;
41
+ /**
42
+ * @hidden
43
+ */
44
+ export declare const isNumber: (value: string | number) => boolean;
@@ -80,4 +80,8 @@ export const getStylingClasses = (componentType, stylingOption, previousValue, n
80
80
  * @hidden
81
81
  */
82
82
  export const mapShapeToRounded = (shape) => SHAPE_TO_ROUNDED[shape] || null;
83
+ /**
84
+ * @hidden
85
+ */
86
+ export const isNumber = (value) => typeof value === 'number' && isFinite(value);
83
87
  export { ɵ0 };