@leanix/components 0.4.343 → 0.4.344

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 (5) hide show
  1. package/esm2022/lib/core-ui/components/content-panel/content-panel.component.mjs +10 -4
  2. package/fesm2022/leanix-components.mjs +8 -2
  3. package/fesm2022/leanix-components.mjs.map +1 -1
  4. package/lib/core-ui/components/content-panel/content-panel.component.d.ts +3 -1
  5. package/package.json +1 -1
package/esm2022/lib/core-ui/components/content-panel/content-panel.component.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { CommonModule } from '@angular/common';
2
- import { Component, EventEmitter, Input, Output } from '@angular/core';
2
+ import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
3
3
  import { ButtonComponent } from '../../../core-ui/components/button/button.component';
4
4
  import * as i0 from "@angular/core";
5
5
  export class ContentPanelComponent {
@@ -10,15 +10,21 @@ export class ContentPanelComponent {
10
10
  onClose() {
11
11
  this.contentPanelClose.emit();
12
12
  }
13
+ scrollToTop() {
14
+ this.body.nativeElement.scrollTo({ top: 0, behavior: 'smooth' });
15
+ }
13
16
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ContentPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
14
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ContentPanelComponent, isStandalone: true, selector: "lx-content-panel", inputs: { title: "title" }, outputs: { contentPanelClose: "contentPanelClose" }, ngImport: i0, template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\">\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\">\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }] }); }
17
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ContentPanelComponent, isStandalone: true, selector: "lx-content-panel", inputs: { title: "title" }, outputs: { contentPanelClose: "contentPanelClose" }, viewQueries: [{ propertyName: "body", first: true, predicate: ["body"], descendants: true }], ngImport: i0, template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\" #header>\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\" #body>\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }] }); }
15
18
  }
16
19
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ContentPanelComponent, decorators: [{
17
20
  type: Component,
18
- args: [{ selector: 'lx-content-panel', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\">\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\">\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"] }]
21
+ args: [{ selector: 'lx-content-panel', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\" #header>\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\" #body>\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"] }]
19
22
  }], propDecorators: { title: [{
20
23
  type: Input
21
24
  }], contentPanelClose: [{
22
25
  type: Output
26
+ }], body: [{
27
+ type: ViewChild,
28
+ args: ['body']
23
29
  }] } });
24
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGVudC1wYW5lbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvc3JjL2xpYi9jb3JlLXVpL2NvbXBvbmVudHMvY29udGVudC1wYW5lbC9jb250ZW50LXBhbmVsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9zcmMvbGliL2NvcmUtdWkvY29tcG9uZW50cy9jb250ZW50LXBhbmVsL2NvbnRlbnQtcGFuZWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFEQUFxRCxDQUFDOztBQVN0RixNQUFNLE9BQU8scUJBQXFCO0lBUGxDO1FBUUUsY0FBUyxHQUFHLGNBQWMsQ0FBQztRQUdqQixzQkFBaUIsR0FBRyxJQUFJLFlBQVksRUFBUSxDQUFDO0tBS3hEO0lBSEMsT0FBTztRQUNMLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUNoQyxDQUFDOzhHQVJVLHFCQUFxQjtrR0FBckIscUJBQXFCLDZKQ1hsQywrYUFhQSxxWEROWSxZQUFZLCtCQUFFLGVBQWU7OzJGQUk1QixxQkFBcUI7a0JBUGpDLFNBQVM7K0JBQ0Usa0JBQWtCLGNBQ2hCLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxlQUFlLENBQUM7OEJBTy9CLEtBQUs7c0JBQWIsS0FBSztnQkFDSSxpQkFBaUI7c0JBQTFCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gJy4uLy4uLy4uL2NvcmUtdWkvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2x4LWNvbnRlbnQtcGFuZWwnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBCdXR0b25Db21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vY29udGVudC1wYW5lbC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2NvbnRlbnQtcGFuZWwuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBDb250ZW50UGFuZWxDb21wb25lbnQge1xuICBiYXNlQ2xhc3MgPSAnY29udGVudFBhbmVsJztcblxuICBASW5wdXQoKSB0aXRsZT86IHN0cmluZztcbiAgQE91dHB1dCgpIGNvbnRlbnRQYW5lbENsb3NlID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuXG4gIG9uQ2xvc2UoKTogdm9pZCB7XG4gICAgdGhpcy5jb250ZW50UGFuZWxDbG9zZS5lbWl0KCk7XG4gIH1cbn1cbiIsIjxkaXYgW2NsYXNzXT1cImJhc2VDbGFzc1wiPlxuICA8ZGl2IGNsYXNzPVwie3sgYmFzZUNsYXNzIH19SGVhZGVyXCI+XG4gICAgQGlmICh0aXRsZSkge1xuICAgICAgPGRpdiBjbGFzcz1cInt7IGJhc2VDbGFzcyB9fVRpdGxlXCI+e3sgdGl0bGUgfX08L2Rpdj5cbiAgICB9XG4gICAgPGJ1dHRvbiBseC1idXR0b24gW3NxdWFyZV09XCJ0cnVlXCIgY2xhc3M9XCJ7eyBiYXNlQ2xhc3MgfX1DbG9zZUJ1dHRvblwiIGNvbG9yPVwibGlnaHRcIiBtb2RlPVwic29saWRcIiAoY2xpY2spPVwib25DbG9zZSgpXCI+XG4gICAgICA8aSBjbGFzcz1cImZhciBmYS10aW1lc1wiPjwvaT5cbiAgICA8L2J1dHRvbj5cbiAgPC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJ7eyBiYXNlQ2xhc3MgfX1Cb2R5XCI+XG4gICAgPG5nLWNvbnRlbnQgLz5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
30
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGVudC1wYW5lbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvc3JjL2xpYi9jb3JlLXVpL2NvbXBvbmVudHMvY29udGVudC1wYW5lbC9jb250ZW50LXBhbmVsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9zcmMvbGliL2NvcmUtdWkvY29tcG9uZW50cy9jb250ZW50LXBhbmVsL2NvbnRlbnQtcGFuZWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzlGLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxREFBcUQsQ0FBQzs7QUFTdEYsTUFBTSxPQUFPLHFCQUFxQjtJQVBsQztRQVFFLGNBQVMsR0FBRyxjQUFjLENBQUM7UUFHakIsc0JBQWlCLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztLQVV4RDtJQVBDLE9BQU87UUFDTCxJQUFJLENBQUMsaUJBQWlCLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDaEMsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxRQUFRLENBQUMsRUFBRSxHQUFHLEVBQUUsQ0FBQyxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUsQ0FBQyxDQUFDO0lBQ25FLENBQUM7OEdBYlUscUJBQXFCO2tHQUFyQixxQkFBcUIsMlBDWGxDLDZiQWFBLHFYRE5ZLFlBQVksK0JBQUUsZUFBZTs7MkZBSTVCLHFCQUFxQjtrQkFQakMsU0FBUzsrQkFDRSxrQkFBa0IsY0FDaEIsSUFBSSxXQUNQLENBQUMsWUFBWSxFQUFFLGVBQWUsQ0FBQzs4QkFPL0IsS0FBSztzQkFBYixLQUFLO2dCQUNJLGlCQUFpQjtzQkFBMUIsTUFBTTtnQkFDWSxJQUFJO3NCQUF0QixTQUFTO3VCQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQnV0dG9uQ29tcG9uZW50IH0gZnJvbSAnLi4vLi4vLi4vY29yZS11aS9jb21wb25lbnRzL2J1dHRvbi9idXR0b24uY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbHgtY29udGVudC1wYW5lbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEJ1dHRvbkNvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9jb250ZW50LXBhbmVsLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vY29udGVudC1wYW5lbC5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIENvbnRlbnRQYW5lbENvbXBvbmVudCB7XG4gIGJhc2VDbGFzcyA9ICdjb250ZW50UGFuZWwnO1xuXG4gIEBJbnB1dCgpIHRpdGxlPzogc3RyaW5nO1xuICBAT3V0cHV0KCkgY29udGVudFBhbmVsQ2xvc2UgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG4gIEBWaWV3Q2hpbGQoJ2JvZHknKSBib2R5ITogRWxlbWVudFJlZjtcblxuICBvbkNsb3NlKCk6IHZvaWQge1xuICAgIHRoaXMuY29udGVudFBhbmVsQ2xvc2UuZW1pdCgpO1xuICB9XG5cbiAgc2Nyb2xsVG9Ub3AoKTogdm9pZCB7XG4gICAgdGhpcy5ib2R5Lm5hdGl2ZUVsZW1lbnQuc2Nyb2xsVG8oeyB0b3A6IDAsIGJlaGF2aW9yOiAnc21vb3RoJyB9KTtcbiAgfVxufVxuIiwiPGRpdiBbY2xhc3NdPVwiYmFzZUNsYXNzXCI+XG4gIDxkaXYgY2xhc3M9XCJ7eyBiYXNlQ2xhc3MgfX1IZWFkZXJcIiAjaGVhZGVyPlxuICAgIEBpZiAodGl0bGUpIHtcbiAgICAgIDxkaXYgY2xhc3M9XCJ7eyBiYXNlQ2xhc3MgfX1UaXRsZVwiPnt7IHRpdGxlIH19PC9kaXY+XG4gICAgfVxuICAgIDxidXR0b24gbHgtYnV0dG9uIFtzcXVhcmVdPVwidHJ1ZVwiIGNsYXNzPVwie3sgYmFzZUNsYXNzIH19Q2xvc2VCdXR0b25cIiBjb2xvcj1cImxpZ2h0XCIgbW9kZT1cInNvbGlkXCIgKGNsaWNrKT1cIm9uQ2xvc2UoKVwiPlxuICAgICAgPGkgY2xhc3M9XCJmYXIgZmEtdGltZXNcIj48L2k+XG4gICAgPC9idXR0b24+XG4gIDwvZGl2PlxuICA8ZGl2IGNsYXNzPVwie3sgYmFzZUNsYXNzIH19Qm9keVwiICNib2R5PlxuICAgIDxuZy1jb250ZW50IC8+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=
package/fesm2022/leanix-components.mjs CHANGED
@@ -2204,16 +2204,22 @@ class ContentPanelComponent {
2204
2204
  onClose() {
2205
2205
  this.contentPanelClose.emit();
2206
2206
  }
2207
+ scrollToTop() {
2208
+ this.body.nativeElement.scrollTo({ top: 0, behavior: 'smooth' });
2209
+ }
2207
2210
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ContentPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2208
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ContentPanelComponent, isStandalone: true, selector: "lx-content-panel", inputs: { title: "title" }, outputs: { contentPanelClose: "contentPanelClose" }, ngImport: i0, template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\">\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\">\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }] }); }
2211
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ContentPanelComponent, isStandalone: true, selector: "lx-content-panel", inputs: { title: "title" }, outputs: { contentPanelClose: "contentPanelClose" }, viewQueries: [{ propertyName: "body", first: true, predicate: ["body"], descendants: true }], ngImport: i0, template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\" #header>\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\" #body>\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }] }); }
2209
2212
  }
2210
2213
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ContentPanelComponent, decorators: [{
2211
2214
  type: Component,
2212
- args: [{ selector: 'lx-content-panel', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\">\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\">\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"] }]
2215
+ args: [{ selector: 'lx-content-panel', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div [class]=\"baseClass\">\n <div class=\"{{ baseClass }}Header\" #header>\n @if (title) {\n <div class=\"{{ baseClass }}Title\">{{ title }}</div>\n }\n <button lx-button [square]=\"true\" class=\"{{ baseClass }}CloseButton\" color=\"light\" mode=\"solid\" (click)=\"onClose()\">\n <i class=\"far fa-times\"></i>\n </button>\n </div>\n <div class=\"{{ baseClass }}Body\" #body>\n <ng-content />\n </div>\n</div>\n", styles: [":host .contentPanel{background-color:#fff;padding:16px;display:flex;flex-direction:column;max-height:100%}:host .contentPanelHeader{margin-bottom:16px;display:flex;justify-content:space-between}:host .contentPanelTitle{font-weight:700;font-size:20px;line-height:24px}:host .contentPanelBody{flex:1;overflow-y:auto}\n"] }]
2213
2216
  }], propDecorators: { title: [{
2214
2217
  type: Input
2215
2218
  }], contentPanelClose: [{
2216
2219
  type: Output
2220
+ }], body: [{
2221
+ type: ViewChild,
2222
+ args: ['body']
2217
2223
  }] } });
2218
2224
 
2219
2225
  class SkeletonComponent {