@sarasanalytics-com/design-system 0.0.29 → 0.0.31
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.
- package/esm2022/lib/card/card-body/card-body.component.mjs +3 -3
- package/esm2022/lib/card/card.component.mjs +11 -3
- package/esm2022/lib/card/checkbox-card/checkbox-card.component.mjs +61 -0
- package/esm2022/lib/card-carousel/card-carousel.component.mjs +3 -3
- package/esm2022/lib/checkbox/checkbox.component.mjs +3 -3
- package/esm2022/lib/icon/icon.component.mjs +3 -3
- package/esm2022/lib/list/list.component.mjs +23 -0
- package/esm2022/lib/page-layout/page-layout.component.mjs +13 -5
- package/esm2022/lib/scrolling-cards/scrolling-cards.component.mjs +4 -4
- package/esm2022/public-api.mjs +3 -1
- package/fesm2022/sarasanalytics-com-design-system.mjs +117 -33
- package/fesm2022/sarasanalytics-com-design-system.mjs.map +1 -1
- package/lib/card/card-body/card-body.component.d.ts +1 -1
- package/lib/card/card.component.d.ts +3 -1
- package/lib/card/checkbox-card/checkbox-card.component.d.ts +17 -0
- package/lib/list/list.component.d.ts +10 -0
- package/lib/page-layout/page-layout.component.d.ts +3 -1
- package/package.json +2 -2
- package/public-api.d.ts +2 -0
- package/styles/styles.css +331 -0
|
@@ -2,10 +2,10 @@ import { Component } from '@angular/core';
|
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export class CardBodyComponent {
|
|
4
4
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CardBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CardBodyComponent, isStandalone: true, selector: "
|
|
5
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CardBodyComponent, isStandalone: true, selector: "sa-card-custom-body", ngImport: i0, template: "<div class=\"sa-card-body\"><ng-content></ng-content></div>", styles: [""] }); }
|
|
6
6
|
}
|
|
7
7
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CardBodyComponent, decorators: [{
|
|
8
8
|
type: Component,
|
|
9
|
-
args: [{ selector: '
|
|
9
|
+
args: [{ selector: 'sa-card-custom-body', standalone: true, imports: [], template: "<div class=\"sa-card-body\"><ng-content></ng-content></div>" }]
|
|
10
10
|
}] });
|
|
11
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
11
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FyZC1ib2R5LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvY2FyZC9jYXJkLWJvZHkvY2FyZC1ib2R5LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvY2FyZC9jYXJkLWJvZHkvY2FyZC1ib2R5LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBUzFDLE1BQU0sT0FBTyxpQkFBaUI7OEdBQWpCLGlCQUFpQjtrR0FBakIsaUJBQWlCLCtFQ1Q5Qiw2REFBeUQ7OzJGRFM1QyxpQkFBaUI7a0JBUDdCLFNBQVM7K0JBQ0UscUJBQXFCLGNBQ25CLElBQUksV0FDUCxFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NhLWNhcmQtY3VzdG9tLWJvZHknLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXSxcbiAgdGVtcGxhdGVVcmw6ICcuL2NhcmQtYm9keS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9jYXJkLWJvZHkuY29tcG9uZW50LmNzcydcbn0pXG5leHBvcnQgY2xhc3MgQ2FyZEJvZHlDb21wb25lbnQge1xuXG59XG4iLCI8ZGl2IGNsYXNzPVwic2EtY2FyZC1ib2R5XCI+PG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PjwvZGl2PiJdfQ==
|
|
@@ -10,6 +10,8 @@ export class CardComponent {
|
|
|
10
10
|
this.title = '';
|
|
11
11
|
this.showCardHeader = false;
|
|
12
12
|
this.showCardBody = false;
|
|
13
|
+
this.showHeaderBodyDivider = false;
|
|
14
|
+
this.showCustomCardBody = false;
|
|
13
15
|
this.customWrapperClass = '';
|
|
14
16
|
this.chip = null;
|
|
15
17
|
this.body = '';
|
|
@@ -28,11 +30,11 @@ export class CardComponent {
|
|
|
28
30
|
}
|
|
29
31
|
}
|
|
30
32
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: CardComponent, isStandalone: true, selector: "sa-card", inputs: { title: "title", showCardHeader: "showCardHeader", showCardBody: "showCardBody", customWrapperClass: "customWrapperClass", chip: "chip", body: "body", avatar: "avatar", image: "image", imageWidth: "imageWidth", avatarSize: "avatarSize", icon: "icon", iconSize: "iconSize", subtitle: "subtitle", logoIcon: "logoIcon", width: "width", column: "column" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"sa-card\" [ngStyle]=\"cardStyles\">\n <div class=\"sa-card-wrapper\" [ngClass]=\"[column ? 'column' : '', customWrapperClass]\">\n <div class=\"\" [ngClass]=\"avatar || image ? 'sa-card-img' : 'sa-card-icon'\">\n @if(avatar){\n <sa-avatar [imagePath]=\"avatar\" [size]=\"avatarSize\"></sa-avatar>\n <!-- <img [src]=\"avatar\" /> -->\n }@else if(image){\n <img [src]=\"image\" [width]=\"imageWidth\" />\n }@else if(icon){\n <sa-icon [icon]=\"icon\" [size]=\"iconSize\"></sa-icon>\n }@else{\n <ng-content select=\"sa-card-icon\"></ng-content>\n }\n @if(column){\n <ng-content select=\"sa-card-title-actions\"></ng-content>\n }\n </div>\n <div class=\"sa-card-container\" [ngClass]=\"showCardHeader ? 'sa-card-custom-container' : ''\">\n @if(showCardHeader){\n <ng-content select=\"sa-card-title-header\"></ng-content>\n @if (
|
|
33
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: CardComponent, isStandalone: true, selector: "sa-card", inputs: { title: "title", showCardHeader: "showCardHeader", showCardBody: "showCardBody", showHeaderBodyDivider: "showHeaderBodyDivider", showCustomCardBody: "showCustomCardBody", customWrapperClass: "customWrapperClass", chip: "chip", body: "body", avatar: "avatar", image: "image", imageWidth: "imageWidth", avatarSize: "avatarSize", icon: "icon", iconSize: "iconSize", subtitle: "subtitle", logoIcon: "logoIcon", width: "width", column: "column" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"sa-card\" [ngStyle]=\"cardStyles\">\n <div class=\"sa-card-wrapper\" [ngClass]=\"[column ? 'column' : '', customWrapperClass]\">\n <div class=\"\" [ngClass]=\"avatar || image ? 'sa-card-img' : 'sa-card-icon'\">\n @if(avatar){\n <sa-avatar [imagePath]=\"avatar\" [size]=\"avatarSize\"></sa-avatar>\n <!-- <img [src]=\"avatar\" /> -->\n }@else if(image){\n <img [src]=\"image\" [width]=\"imageWidth\" />\n }@else if(icon){\n <sa-icon [icon]=\"icon\" [size]=\"iconSize\"></sa-icon>\n }@else{\n <ng-content select=\"sa-card-icon\"></ng-content>\n }\n @if(column){\n <ng-content select=\"sa-card-title-actions\"></ng-content>\n }\n </div>\n <div class=\"sa-card-container\" [ngClass]=\"showCardHeader ? 'sa-card-custom-container' : ''\">\n @if(showCardHeader){\n <ng-content select=\"sa-card-title-header\"></ng-content>\n @if (showHeaderBodyDivider && body) {\n <div class=\"custom-divider\"></div>\n }\n }\n @else if(title){\n <div class=\"sa-card-title-container\">\n <div class=\"sa-card-title\">{{title}}</div>\n @if(chip){\n <sa-chip [text]=\"chip.text\" [type]=\"chip.type\" [state]=\"chip.state\" [filling]=\"chip.filling\"></sa-chip>\n }\n <ng-content select=\"sa-card-title-actions\"></ng-content>\n\n </div>\n }\n @if (showCustomCardBody) {\n <ng-content select=\"sa-card-custom-body\"></ng-content>\n }\n @if(showCardBody && body){\n <div class=\"sa-card-body\">\n {{body}}\n </div>\n }\n <ng-content select=\"sa-card-footer-actions\"></ng-content>\n </div>\n </div>\n</div>", styles: ["*{font-family:var(--font)}.sa-card-wrapper{display:flex;border:1px solid var(--grey-50);border-radius:6px;padding:12px;background:var(--structural-white);gap:var(--small-12px)}.sa-card-wrapper.column{flex-direction:column}.sa-card-wrapper.sa-card-secondary-wrapper{gap:var(--medium-20px, 20px)}.sa-card-wrapper.sa-card-custom-wrapper{gap:0}.column .sa-card-img,.column .sa-card-icon{display:flex;justify-content:space-between}.sa-card-img img{height:auto}.sa-card-icon span{background-repeat:no-repeat;background-size:cover;background-position:center;display:block;height:24px;width:24px}.sa-card-container{display:flex;flex-direction:column;justify-content:space-between;width:-webkit-fill-available;gap:.188rem}.sa-card-title-container{display:flex;justify-content:space-between}.column .sa-card-title-container{flex-direction:column;margin-bottom:8px}.sa-card-title{font-size:16px;font-weight:600;line-height:24px;margin-bottom:4px}.sa-card-body{font-size:14px;font-weight:400;line-height:20px;letter-spacing:.25px;text-align:left;color:var(--grey-300);flex:1}.sa-card-container .custom-divider{width:100%;height:.063rem;background-color:#ccc}.sa-card-custom-container{gap:var(--medium-20px, 20px)}.sa-card-custom-wrapper{padding:1.25rem;border-radius:var(--small-8px, 8px);border:1px solid var(--grey-100, #EAECF0);background:#fff}.sa-card-secondary-wrapper .sa-card-icon{margin:0}.sa-card-secondary-wrapper{gap:var(--medium-20px, 20px);padding:var(--medium-20px, 20px);border-radius:var(--small-8px, 8px);border:1px solid var(--grey-100, #EAECF0);background:#fff}.sa-card-checkbox-wrapper{cursor:pointer;border-radius:var(--small-8px, 8px);border:1px solid var(--grey-100, #EAECF0);display:flex;padding:var(--medium-20px, 20px);flex-direction:column;align-items:flex-start;gap:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ChipsComponent, selector: "sa-chip", inputs: ["id", "iconPath", "text", "type", "state", "filling", "iconPosition", "largeStateIcon", "largeStateText"], outputs: ["onClickEvent"] }, { kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["img", "icon", "size", "color", "iconPath", "iconUrl", "customClass"] }, { kind: "component", type: AvatarComponent, selector: "sa-avatar", inputs: ["id", "imagePath", "altText", "size"], outputs: ["onClickEvent", "onMouseInEvent", "onMouseOutEvent"] }] }); }
|
|
32
34
|
}
|
|
33
35
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CardComponent, decorators: [{
|
|
34
36
|
type: Component,
|
|
35
|
-
args: [{ selector: 'sa-card', standalone: true, imports: [CommonModule, ChipsComponent, IconComponent, AvatarComponent], template: "<div class=\"sa-card\" [ngStyle]=\"cardStyles\">\n <div class=\"sa-card-wrapper\" [ngClass]=\"[column ? 'column' : '', customWrapperClass]\">\n <div class=\"\" [ngClass]=\"avatar || image ? 'sa-card-img' : 'sa-card-icon'\">\n @if(avatar){\n <sa-avatar [imagePath]=\"avatar\" [size]=\"avatarSize\"></sa-avatar>\n <!-- <img [src]=\"avatar\" /> -->\n }@else if(image){\n <img [src]=\"image\" [width]=\"imageWidth\" />\n }@else if(icon){\n <sa-icon [icon]=\"icon\" [size]=\"iconSize\"></sa-icon>\n }@else{\n <ng-content select=\"sa-card-icon\"></ng-content>\n }\n @if(column){\n <ng-content select=\"sa-card-title-actions\"></ng-content>\n }\n </div>\n <div class=\"sa-card-container\" [ngClass]=\"showCardHeader ? 'sa-card-custom-container' : ''\">\n @if(showCardHeader){\n <ng-content select=\"sa-card-title-header\"></ng-content>\n @if (
|
|
37
|
+
args: [{ selector: 'sa-card', standalone: true, imports: [CommonModule, ChipsComponent, IconComponent, AvatarComponent], template: "<div class=\"sa-card\" [ngStyle]=\"cardStyles\">\n <div class=\"sa-card-wrapper\" [ngClass]=\"[column ? 'column' : '', customWrapperClass]\">\n <div class=\"\" [ngClass]=\"avatar || image ? 'sa-card-img' : 'sa-card-icon'\">\n @if(avatar){\n <sa-avatar [imagePath]=\"avatar\" [size]=\"avatarSize\"></sa-avatar>\n <!-- <img [src]=\"avatar\" /> -->\n }@else if(image){\n <img [src]=\"image\" [width]=\"imageWidth\" />\n }@else if(icon){\n <sa-icon [icon]=\"icon\" [size]=\"iconSize\"></sa-icon>\n }@else{\n <ng-content select=\"sa-card-icon\"></ng-content>\n }\n @if(column){\n <ng-content select=\"sa-card-title-actions\"></ng-content>\n }\n </div>\n <div class=\"sa-card-container\" [ngClass]=\"showCardHeader ? 'sa-card-custom-container' : ''\">\n @if(showCardHeader){\n <ng-content select=\"sa-card-title-header\"></ng-content>\n @if (showHeaderBodyDivider && body) {\n <div class=\"custom-divider\"></div>\n }\n }\n @else if(title){\n <div class=\"sa-card-title-container\">\n <div class=\"sa-card-title\">{{title}}</div>\n @if(chip){\n <sa-chip [text]=\"chip.text\" [type]=\"chip.type\" [state]=\"chip.state\" [filling]=\"chip.filling\"></sa-chip>\n }\n <ng-content select=\"sa-card-title-actions\"></ng-content>\n\n </div>\n }\n @if (showCustomCardBody) {\n <ng-content select=\"sa-card-custom-body\"></ng-content>\n }\n @if(showCardBody && body){\n <div class=\"sa-card-body\">\n {{body}}\n </div>\n }\n <ng-content select=\"sa-card-footer-actions\"></ng-content>\n </div>\n </div>\n</div>", styles: ["*{font-family:var(--font)}.sa-card-wrapper{display:flex;border:1px solid var(--grey-50);border-radius:6px;padding:12px;background:var(--structural-white);gap:var(--small-12px)}.sa-card-wrapper.column{flex-direction:column}.sa-card-wrapper.sa-card-secondary-wrapper{gap:var(--medium-20px, 20px)}.sa-card-wrapper.sa-card-custom-wrapper{gap:0}.column .sa-card-img,.column .sa-card-icon{display:flex;justify-content:space-between}.sa-card-img img{height:auto}.sa-card-icon span{background-repeat:no-repeat;background-size:cover;background-position:center;display:block;height:24px;width:24px}.sa-card-container{display:flex;flex-direction:column;justify-content:space-between;width:-webkit-fill-available;gap:.188rem}.sa-card-title-container{display:flex;justify-content:space-between}.column .sa-card-title-container{flex-direction:column;margin-bottom:8px}.sa-card-title{font-size:16px;font-weight:600;line-height:24px;margin-bottom:4px}.sa-card-body{font-size:14px;font-weight:400;line-height:20px;letter-spacing:.25px;text-align:left;color:var(--grey-300);flex:1}.sa-card-container .custom-divider{width:100%;height:.063rem;background-color:#ccc}.sa-card-custom-container{gap:var(--medium-20px, 20px)}.sa-card-custom-wrapper{padding:1.25rem;border-radius:var(--small-8px, 8px);border:1px solid var(--grey-100, #EAECF0);background:#fff}.sa-card-secondary-wrapper .sa-card-icon{margin:0}.sa-card-secondary-wrapper{gap:var(--medium-20px, 20px);padding:var(--medium-20px, 20px);border-radius:var(--small-8px, 8px);border:1px solid var(--grey-100, #EAECF0);background:#fff}.sa-card-checkbox-wrapper{cursor:pointer;border-radius:var(--small-8px, 8px);border:1px solid var(--grey-100, #EAECF0);display:flex;padding:var(--medium-20px, 20px);flex-direction:column;align-items:flex-start;gap:0}\n"] }]
|
|
36
38
|
}], propDecorators: { title: [{
|
|
37
39
|
type: Input,
|
|
38
40
|
args: ['title']
|
|
@@ -42,6 +44,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
42
44
|
}], showCardBody: [{
|
|
43
45
|
type: Input,
|
|
44
46
|
args: ['showCardBody']
|
|
47
|
+
}], showHeaderBodyDivider: [{
|
|
48
|
+
type: Input,
|
|
49
|
+
args: ['showHeaderBodyDivider']
|
|
50
|
+
}], showCustomCardBody: [{
|
|
51
|
+
type: Input,
|
|
52
|
+
args: ['showCustomCardBody']
|
|
45
53
|
}], customWrapperClass: [{
|
|
46
54
|
type: Input,
|
|
47
55
|
args: ['customWrapperClass']
|
|
@@ -82,4 +90,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
82
90
|
type: Input,
|
|
83
91
|
args: ['column']
|
|
84
92
|
}] } });
|
|
85
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
93
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2NhcmQvY2FyZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2NhcmQvY2FyZC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQWlCLE1BQU0sZUFBZSxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUUxRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdkQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7QUFTN0QsTUFBTSxPQUFPLGFBQWE7SUFQMUI7UUFRa0IsVUFBSyxHQUFXLEVBQUUsQ0FBQztRQUNWLG1CQUFjLEdBQVksS0FBSyxDQUFDO1FBQ2xDLGlCQUFZLEdBQVksS0FBSyxDQUFDO1FBQ3JCLDBCQUFxQixHQUFZLEtBQUssQ0FBQztRQUMxQyx1QkFBa0IsR0FBWSxLQUFLLENBQUM7UUFDcEMsdUJBQWtCLEdBQVcsRUFBRSxDQUFDO1FBQzlDLFNBQUksR0FBeUIsSUFBSSxDQUFDO1FBQ2xDLFNBQUksR0FBVyxFQUFFLENBQUM7UUFDaEIsV0FBTSxHQUFXLEVBQUUsQ0FBQztRQUNyQixVQUFLLEdBQVcsRUFBRSxDQUFDO1FBQ2QsZUFBVSxHQUFXLEVBQUUsQ0FBQztRQUc5QixTQUFJLEdBQVcsRUFBRSxDQUFDO1FBR2QsYUFBUSxHQUFXLEVBQUUsQ0FBQztRQUN0QixhQUFRLEdBQVcsRUFBRSxDQUFDO1FBR3hCLFdBQU0sR0FBWSxLQUFLLENBQUM7UUFFekMsZUFBVSxHQUFRLEVBQUUsQ0FBQztLQU90QjtJQUxDLFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxJQUFJLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRSxZQUFZLEVBQUUsQ0FBQztZQUNuQyxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxHQUFHLE9BQU8sT0FBTyxDQUFDLE9BQU8sQ0FBQyxFQUFFLFlBQVksS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRSxZQUFZLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRSxZQUFZLEdBQUcsR0FBRyxDQUFDO1FBQ3hKLENBQUM7SUFDSCxDQUFDOzhHQTdCVSxhQUFhO2tHQUFiLGFBQWEsNGhCQ2QxQix5NkRBNkNNLG16RERuQ00sWUFBWSxrTkFBRSxjQUFjLG1NQUFFLGFBQWEsb0lBQUUsZUFBZTs7MkZBSTNELGFBQWE7a0JBUHpCLFNBQVM7K0JBQ0UsU0FBUyxjQUNQLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxjQUFjLEVBQUUsYUFBYSxFQUFFLGVBQWUsQ0FBQzs4QkFLdkQsS0FBSztzQkFBcEIsS0FBSzt1QkFBQyxPQUFPO2dCQUNXLGNBQWM7c0JBQXRDLEtBQUs7dUJBQUMsZ0JBQWdCO2dCQUNBLFlBQVk7c0JBQWxDLEtBQUs7dUJBQUMsY0FBYztnQkFDVyxxQkFBcUI7c0JBQXBELEtBQUs7dUJBQUMsdUJBQXVCO2dCQUNELGtCQUFrQjtzQkFBOUMsS0FBSzt1QkFBQyxvQkFBb0I7Z0JBQ0Usa0JBQWtCO3NCQUE5QyxLQUFLO3VCQUFDLG9CQUFvQjtnQkFDWixJQUFJO3NCQUFsQixLQUFLO3VCQUFDLE1BQU07Z0JBQ0UsSUFBSTtzQkFBbEIsS0FBSzt1QkFBQyxNQUFNO2dCQUNJLE1BQU07c0JBQXRCLEtBQUs7dUJBQUMsUUFBUTtnQkFDQyxLQUFLO3NCQUFwQixLQUFLO3VCQUFDLE9BQU87Z0JBQ08sVUFBVTtzQkFBOUIsS0FBSzt1QkFBQyxZQUFZO2dCQUNFLFVBQVU7c0JBQTlCLEtBQUs7dUJBQUMsWUFBWTtnQkFFSixJQUFJO3NCQUFsQixLQUFLO3VCQUFDLE1BQU07Z0JBQ00sUUFBUTtzQkFBMUIsS0FBSzt1QkFBQyxVQUFVO2dCQUVFLFFBQVE7c0JBQTFCLEtBQUs7dUJBQUMsVUFBVTtnQkFDRSxRQUFRO3NCQUExQixLQUFLO3VCQUFDLFVBQVU7Z0JBRUQsS0FBSztzQkFBcEIsS0FBSzt1QkFBQyxPQUFPO2dCQUNHLE1BQU07c0JBQXRCLEtBQUs7dUJBQUMsUUFBUSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDaGlwc0NvbXBvbmVudCB9IGZyb20gJy4uL2NoaXBzL2NoaXBzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBDaGlwSW50ZXJmYWNlIH0gZnJvbSAnLi4vLi4vaW50ZXJmYWNlcy9jaGlwLWludGVyZmFjZSc7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSAnLi4vaWNvbi9pY29uLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBBdmF0YXJDb21wb25lbnQgfSBmcm9tIFwiLi4vYXZhdGFyL2F2YXRhci5jb21wb25lbnRcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc2EtY2FyZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIENoaXBzQ29tcG9uZW50LCBJY29uQ29tcG9uZW50LCBBdmF0YXJDb21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vY2FyZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9jYXJkLmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIENhcmRDb21wb25lbnQge1xuICBASW5wdXQoJ3RpdGxlJykgdGl0bGU6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoJ3Nob3dDYXJkSGVhZGVyJykgc2hvd0NhcmRIZWFkZXI6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCdzaG93Q2FyZEJvZHknKSBzaG93Q2FyZEJvZHk6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCdzaG93SGVhZGVyQm9keURpdmlkZXInKSBzaG93SGVhZGVyQm9keURpdmlkZXI6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCdzaG93Q3VzdG9tQ2FyZEJvZHknKSBzaG93Q3VzdG9tQ2FyZEJvZHk6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCdjdXN0b21XcmFwcGVyQ2xhc3MnKSBjdXN0b21XcmFwcGVyQ2xhc3M6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoJ2NoaXAnKSBjaGlwOiBDaGlwSW50ZXJmYWNlIHwgbnVsbCA9IG51bGw7XG4gIEBJbnB1dCgnYm9keScpIGJvZHk6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoJ2F2YXRhcicpIGF2YXRhcjogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgnaW1hZ2UnKSBpbWFnZTogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgnaW1hZ2VXaWR0aCcpIGltYWdlV2lkdGg6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoJ2F2YXRhclNpemUnKSBhdmF0YXJTaXplOiBzdHJpbmc7XG5cbiAgQElucHV0KCdpY29uJykgaWNvbjogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgnaWNvblNpemUnKSBpY29uU2l6ZTogc3RyaW5nO1xuXG4gIEBJbnB1dCgnc3VidGl0bGUnKSBzdWJ0aXRsZTogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgnbG9nb0ljb24nKSBsb2dvSWNvbjogc3RyaW5nID0gJyc7XG5cbiAgQElucHV0KCd3aWR0aCcpIHdpZHRoOiBzdHJpbmcgfCBudW1iZXI7XG4gIEBJbnB1dCgnY29sdW1uJykgY29sdW1uOiBib29sZWFuID0gZmFsc2U7XG5cbiAgY2FyZFN0eWxlczogYW55ID0ge307XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcykge1xuICAgIGlmIChjaGFuZ2VzWyd3aWR0aCddPy5jdXJyZW50VmFsdWUpIHtcbiAgICAgIHRoaXMuY2FyZFN0eWxlc1snd2lkdGgnXSA9IHR5cGVvZiBjaGFuZ2VzWyd3aWR0aCddPy5jdXJyZW50VmFsdWUgPT09ICdzdHJpbmcnID8gY2hhbmdlc1snd2lkdGgnXT8uY3VycmVudFZhbHVlIDogY2hhbmdlc1snd2lkdGgnXT8uY3VycmVudFZhbHVlICsgJyUnO1xuICAgIH1cbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInNhLWNhcmRcIiBbbmdTdHlsZV09XCJjYXJkU3R5bGVzXCI+XG4gICAgPGRpdiBjbGFzcz1cInNhLWNhcmQtd3JhcHBlclwiIFtuZ0NsYXNzXT1cIltjb2x1bW4gPyAnY29sdW1uJyA6ICcnLCBjdXN0b21XcmFwcGVyQ2xhc3NdXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJcIiBbbmdDbGFzc109XCJhdmF0YXIgfHwgaW1hZ2UgPyAnc2EtY2FyZC1pbWcnIDogJ3NhLWNhcmQtaWNvbidcIj5cbiAgICAgICAgICAgIEBpZihhdmF0YXIpe1xuICAgICAgICAgICAgPHNhLWF2YXRhciBbaW1hZ2VQYXRoXT1cImF2YXRhclwiIFtzaXplXT1cImF2YXRhclNpemVcIj48L3NhLWF2YXRhcj5cbiAgICAgICAgICAgIDwhLS0gPGltZyBbc3JjXT1cImF2YXRhclwiIC8+IC0tPlxuICAgICAgICAgICAgfUBlbHNlIGlmKGltYWdlKXtcbiAgICAgICAgICAgIDxpbWcgW3NyY109XCJpbWFnZVwiIFt3aWR0aF09XCJpbWFnZVdpZHRoXCIgLz5cbiAgICAgICAgICAgIH1AZWxzZSBpZihpY29uKXtcbiAgICAgICAgICAgIDxzYS1pY29uIFtpY29uXT1cImljb25cIiBbc2l6ZV09XCJpY29uU2l6ZVwiPjwvc2EtaWNvbj5cbiAgICAgICAgICAgIH1AZWxzZXtcbiAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cInNhLWNhcmQtaWNvblwiPjwvbmctY29udGVudD5cbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIEBpZihjb2x1bW4pe1xuICAgICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwic2EtY2FyZC10aXRsZS1hY3Rpb25zXCI+PC9uZy1jb250ZW50PlxuICAgICAgICAgICAgfVxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInNhLWNhcmQtY29udGFpbmVyXCIgW25nQ2xhc3NdPVwic2hvd0NhcmRIZWFkZXIgPyAnc2EtY2FyZC1jdXN0b20tY29udGFpbmVyJyA6ICcnXCI+XG4gICAgICAgICAgICBAaWYoc2hvd0NhcmRIZWFkZXIpe1xuICAgICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwic2EtY2FyZC10aXRsZS1oZWFkZXJcIj48L25nLWNvbnRlbnQ+XG4gICAgICAgICAgICBAaWYgKHNob3dIZWFkZXJCb2R5RGl2aWRlciAmJiBib2R5KSB7XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiY3VzdG9tLWRpdmlkZXJcIj48L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIEBlbHNlIGlmKHRpdGxlKXtcbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLXRpdGxlLWNvbnRhaW5lclwiPlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLXRpdGxlXCI+e3t0aXRsZX19PC9kaXY+XG4gICAgICAgICAgICAgICAgQGlmKGNoaXApe1xuICAgICAgICAgICAgICAgIDxzYS1jaGlwIFt0ZXh0XT1cImNoaXAudGV4dFwiIFt0eXBlXT1cImNoaXAudHlwZVwiIFtzdGF0ZV09XCJjaGlwLnN0YXRlXCIgW2ZpbGxpbmddPVwiY2hpcC5maWxsaW5nXCI+PC9zYS1jaGlwPlxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJzYS1jYXJkLXRpdGxlLWFjdGlvbnNcIj48L25nLWNvbnRlbnQ+XG5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgfVxuICAgICAgICAgICAgQGlmIChzaG93Q3VzdG9tQ2FyZEJvZHkpIHtcbiAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cInNhLWNhcmQtY3VzdG9tLWJvZHlcIj48L25nLWNvbnRlbnQ+XG4gICAgICAgICAgICB9XG4gICAgICAgICAgICBAaWYoc2hvd0NhcmRCb2R5ICYmIGJvZHkpe1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWNhcmQtYm9keVwiPlxuICAgICAgICAgICAgICAgIHt7Ym9keX19XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cInNhLWNhcmQtZm9vdGVyLWFjdGlvbnNcIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuPC9kaXY+Il19
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
2
|
+
import { CardComponent } from '../card.component';
|
|
3
|
+
import { IconComponent } from '../../icon/icon.component';
|
|
4
|
+
import { ListComponent } from '../../list/list.component';
|
|
5
|
+
import { CardBodyComponent } from '../card-body/card-body.component';
|
|
6
|
+
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
7
|
+
import { CommonModule } from '@angular/common';
|
|
8
|
+
import { CardTitleActionsComponent } from '../card-title-actions/card-title-actions.component';
|
|
9
|
+
import { CardCustomHeaderComponent } from '../card-custom-header/card-custom-header.component';
|
|
10
|
+
import { FormsModule } from '@angular/forms';
|
|
11
|
+
import * as i0 from "@angular/core";
|
|
12
|
+
import * as i1 from "@angular/material/checkbox";
|
|
13
|
+
import * as i2 from "@angular/forms";
|
|
14
|
+
export class CheckboxCardComponent {
|
|
15
|
+
constructor() {
|
|
16
|
+
this.featureIcon = '';
|
|
17
|
+
this.title = 'Default Title';
|
|
18
|
+
this.isCardSelected = false;
|
|
19
|
+
this.listItems = [];
|
|
20
|
+
this.listIcon = '';
|
|
21
|
+
this.width = '';
|
|
22
|
+
this.customWrapperClass = 'sa-card-checkbox-wrapper';
|
|
23
|
+
// @Output() cardClick: EventEmitter<boolean> = new EventEmitter();
|
|
24
|
+
// @Output() checkboxChange: EventEmitter<boolean> = new EventEmitter();
|
|
25
|
+
this.selectedCardsChange = new EventEmitter();
|
|
26
|
+
}
|
|
27
|
+
onCardClick(event) {
|
|
28
|
+
this.isCardSelected = !this.isCardSelected;
|
|
29
|
+
this.notifyCheckboxChange();
|
|
30
|
+
}
|
|
31
|
+
onCheckboxClick(event) {
|
|
32
|
+
event.stopPropagation();
|
|
33
|
+
this.notifyCheckboxChange();
|
|
34
|
+
}
|
|
35
|
+
notifyCheckboxChange() {
|
|
36
|
+
this.selectedCardsChange.emit(this.isCardSelected);
|
|
37
|
+
}
|
|
38
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CheckboxCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
39
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CheckboxCardComponent, isStandalone: true, selector: "sa-checkbox-card", inputs: { featureIcon: "featureIcon", title: "title", isCardSelected: "isCardSelected", listItems: "listItems", listIcon: "listIcon", width: "width", customWrapperClass: "customWrapperClass" }, outputs: { selectedCardsChange: "selectedCardsChange" }, ngImport: i0, template: "<sa-card [width]=\"width\" [customWrapperClass]=\"customWrapperClass\" (click)=\"onCardClick($event)\" [showCardBody]=\"false\"\n [showCardHeader]=\"true\" [showCustomCardBody]=\"true\" class=\"checkbox-card\" [style.width]=\"width\">\n <sa-card-title-header>\n <div class=\"sa-card-custom-header-container\">\n <div class=\"sa-card-title-logo-container\">\n <div class=\"sa-card-title-logo\"><sa-icon [icon]=\"featureIcon\"\n customClass=\"auto-dimensions colored-icon\"></sa-icon>\n </div>\n <div class=\"sa-card-custom-title\">{{title}}</div>\n </div>\n <div class=\"sa-card-titleIcon\">\n <sa-card-title-actions>\n <div class=\"sa-document-action\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isCardSelected\"\n (click)=\"onCheckboxClick($event)\"></mat-checkbox>\n </div>\n </sa-card-title-actions>\n </div>\n </div>\n </sa-card-title-header>\n <sa-card-custom-body>\n <lib-list [listData]=\"listItems\" [featuresIcon]=\"listIcon\"></lib-list>\n </sa-card-custom-body>\n</sa-card>", styles: [".sa-card-title-logo-container{display:flex;gap:var(--small-8px);align-items:center}.sa-card-title-logo sa-icon{display:flex}::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper.mdc-checkbox:hover .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:focus:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:focus:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:focus:checked~.mdc-checkbox__ripple,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control:checked~.mdc-checkbox__ripple{border-color:var(--primary-500);background-color:var(--primary-500)}.checkbox-card{display:block}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "sa-card", inputs: ["title", "showCardHeader", "showCardBody", "showHeaderBodyDivider", "showCustomCardBody", "customWrapperClass", "chip", "body", "avatar", "image", "imageWidth", "avatarSize", "icon", "iconSize", "subtitle", "logoIcon", "width", "column"] }, { kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["img", "icon", "size", "color", "iconPath", "iconUrl", "customClass"] }, { kind: "component", type: ListComponent, selector: "lib-list", inputs: ["listData", "featuresIcon"] }, { kind: "component", type: CardBodyComponent, selector: "sa-card-custom-body" }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: CardTitleActionsComponent, selector: "sa-card-title-actions" }, { kind: "component", type: CardCustomHeaderComponent, selector: "sa-card-title-header" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
40
|
+
}
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CheckboxCardComponent, decorators: [{
|
|
42
|
+
type: Component,
|
|
43
|
+
args: [{ selector: 'sa-checkbox-card', standalone: true, imports: [CardComponent, IconComponent, ListComponent, CardBodyComponent, MatCheckboxModule, CommonModule, CardTitleActionsComponent, CardCustomHeaderComponent, FormsModule], template: "<sa-card [width]=\"width\" [customWrapperClass]=\"customWrapperClass\" (click)=\"onCardClick($event)\" [showCardBody]=\"false\"\n [showCardHeader]=\"true\" [showCustomCardBody]=\"true\" class=\"checkbox-card\" [style.width]=\"width\">\n <sa-card-title-header>\n <div class=\"sa-card-custom-header-container\">\n <div class=\"sa-card-title-logo-container\">\n <div class=\"sa-card-title-logo\"><sa-icon [icon]=\"featureIcon\"\n customClass=\"auto-dimensions colored-icon\"></sa-icon>\n </div>\n <div class=\"sa-card-custom-title\">{{title}}</div>\n </div>\n <div class=\"sa-card-titleIcon\">\n <sa-card-title-actions>\n <div class=\"sa-document-action\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isCardSelected\"\n (click)=\"onCheckboxClick($event)\"></mat-checkbox>\n </div>\n </sa-card-title-actions>\n </div>\n </div>\n </sa-card-title-header>\n <sa-card-custom-body>\n <lib-list [listData]=\"listItems\" [featuresIcon]=\"listIcon\"></lib-list>\n </sa-card-custom-body>\n</sa-card>", styles: [".sa-card-title-logo-container{display:flex;gap:var(--small-8px);align-items:center}.sa-card-title-logo sa-icon{display:flex}::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper.mdc-checkbox:hover .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:focus:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:enabled:focus:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox .mdc-checkbox__native-control:focus:checked~.mdc-checkbox__ripple,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,::ng-deep .sa-card-checkbox-wrapper .mdc-checkbox:hover .mdc-checkbox__native-control:checked~.mdc-checkbox__ripple{border-color:var(--primary-500);background-color:var(--primary-500)}.checkbox-card{display:block}\n"] }]
|
|
44
|
+
}], propDecorators: { featureIcon: [{
|
|
45
|
+
type: Input
|
|
46
|
+
}], title: [{
|
|
47
|
+
type: Input
|
|
48
|
+
}], isCardSelected: [{
|
|
49
|
+
type: Input
|
|
50
|
+
}], listItems: [{
|
|
51
|
+
type: Input
|
|
52
|
+
}], listIcon: [{
|
|
53
|
+
type: Input
|
|
54
|
+
}], width: [{
|
|
55
|
+
type: Input
|
|
56
|
+
}], customWrapperClass: [{
|
|
57
|
+
type: Input
|
|
58
|
+
}], selectedCardsChange: [{
|
|
59
|
+
type: Output
|
|
60
|
+
}] } });
|
|
61
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3gtY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2NhcmQvY2hlY2tib3gtY2FyZC9jaGVja2JveC1jYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvY2FyZC9jaGVja2JveC1jYXJkL2NoZWNrYm94LWNhcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN2RSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFDbEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzFELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMxRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNyRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUMvRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sb0RBQW9ELENBQUM7QUFDL0YsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sb0RBQW9ELENBQUM7QUFDL0YsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7O0FBUzdDLE1BQU0sT0FBTyxxQkFBcUI7SUFQbEM7UUFRVyxnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQUN6QixVQUFLLEdBQVcsZUFBZSxDQUFDO1FBQ2hDLG1CQUFjLEdBQVksS0FBSyxDQUFDO1FBQ2hDLGNBQVMsR0FBVSxFQUFFLENBQUM7UUFDdEIsYUFBUSxHQUFXLEVBQUUsQ0FBQztRQUN0QixVQUFLLEdBQVcsRUFBRSxDQUFDO1FBQ25CLHVCQUFrQixHQUFXLDBCQUEwQixDQUFDO1FBRWpFLG1FQUFtRTtRQUNuRSx3RUFBd0U7UUFDOUQsd0JBQW1CLEdBQTBCLElBQUksWUFBWSxFQUFFLENBQUM7S0FlM0U7SUFiQyxXQUFXLENBQUMsS0FBaUI7UUFDM0IsSUFBSSxDQUFDLGNBQWMsR0FBRyxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUM7UUFDM0MsSUFBSSxDQUFDLG9CQUFvQixFQUFFLENBQUM7SUFDOUIsQ0FBQztJQUVELGVBQWUsQ0FBQyxLQUFZO1FBQzFCLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsb0JBQW9CLEVBQUUsQ0FBQztJQUM5QixDQUFDO0lBRU8sb0JBQW9CO1FBQzFCLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxDQUFDO0lBQ3JELENBQUM7OEdBekJVLHFCQUFxQjtrR0FBckIscUJBQXFCLHVVQ2xCbEMsaXZDQXVCVSx5bUVEVEUsYUFBYSw0U0FBRSxhQUFhLG9JQUFFLGFBQWEsMkZBQUUsaUJBQWlCLCtEQUFFLGlCQUFpQiw2V0FBRSxZQUFZLCtCQUFFLHlCQUF5QixrRUFBRSx5QkFBeUIsZ0VBQUUsV0FBVzs7MkZBSWpLLHFCQUFxQjtrQkFQakMsU0FBUzsrQkFDRSxrQkFBa0IsY0FDaEIsSUFBSSxXQUNQLENBQUMsYUFBYSxFQUFFLGFBQWEsRUFBRSxhQUFhLEVBQUUsaUJBQWlCLEVBQUUsaUJBQWlCLEVBQUUsWUFBWSxFQUFFLHlCQUF5QixFQUFFLHlCQUF5QixFQUFFLFdBQVcsQ0FBQzs4QkFLcEssV0FBVztzQkFBbkIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csY0FBYztzQkFBdEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFJSSxtQkFBbUI7c0JBQTVCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ2FyZENvbXBvbmVudCB9IGZyb20gJy4uL2NhcmQuY29tcG9uZW50JztcbmltcG9ydCB7IEljb25Db21wb25lbnQgfSBmcm9tICcuLi8uLi9pY29uL2ljb24uY29tcG9uZW50JztcbmltcG9ydCB7IExpc3RDb21wb25lbnQgfSBmcm9tICcuLi8uLi9saXN0L2xpc3QuY29tcG9uZW50JztcbmltcG9ydCB7IENhcmRCb2R5Q29tcG9uZW50IH0gZnJvbSAnLi4vY2FyZC1ib2R5L2NhcmQtYm9keS5jb21wb25lbnQnO1xuaW1wb3J0IHsgTWF0Q2hlY2tib3hNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9jaGVja2JveCc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ2FyZFRpdGxlQWN0aW9uc0NvbXBvbmVudCB9IGZyb20gJy4uL2NhcmQtdGl0bGUtYWN0aW9ucy9jYXJkLXRpdGxlLWFjdGlvbnMuY29tcG9uZW50JztcbmltcG9ydCB7IENhcmRDdXN0b21IZWFkZXJDb21wb25lbnQgfSBmcm9tICcuLi9jYXJkLWN1c3RvbS1oZWFkZXIvY2FyZC1jdXN0b20taGVhZGVyLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc2EtY2hlY2tib3gtY2FyZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDYXJkQ29tcG9uZW50LCBJY29uQ29tcG9uZW50LCBMaXN0Q29tcG9uZW50LCBDYXJkQm9keUNvbXBvbmVudCwgTWF0Q2hlY2tib3hNb2R1bGUsIENvbW1vbk1vZHVsZSwgQ2FyZFRpdGxlQWN0aW9uc0NvbXBvbmVudCwgQ2FyZEN1c3RvbUhlYWRlckNvbXBvbmVudCwgRm9ybXNNb2R1bGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vY2hlY2tib3gtY2FyZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9jaGVja2JveC1jYXJkLmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIENoZWNrYm94Q2FyZENvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGZlYXR1cmVJY29uOiBzdHJpbmcgPSAnJztcbiAgQElucHV0KCkgdGl0bGU6IHN0cmluZyA9ICdEZWZhdWx0IFRpdGxlJztcbiAgQElucHV0KCkgaXNDYXJkU2VsZWN0ZWQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgbGlzdEl0ZW1zOiBhbnlbXSA9IFtdO1xuICBASW5wdXQoKSBsaXN0SWNvbjogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgpIHdpZHRoOiBzdHJpbmcgPSAnJztcbiAgQElucHV0KCkgY3VzdG9tV3JhcHBlckNsYXNzOiBzdHJpbmcgPSAnc2EtY2FyZC1jaGVja2JveC13cmFwcGVyJztcblxuICAvLyBAT3V0cHV0KCkgY2FyZENsaWNrOiBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIC8vIEBPdXRwdXQoKSBjaGVja2JveENoYW5nZTogRXZlbnRFbWl0dGVyPGJvb2xlYW4+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICBAT3V0cHV0KCkgc2VsZWN0ZWRDYXJkc0NoYW5nZTogRXZlbnRFbWl0dGVyPGJvb2xlYW4+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIG9uQ2FyZENsaWNrKGV2ZW50OiBNb3VzZUV2ZW50KTogdm9pZCB7XG4gICAgdGhpcy5pc0NhcmRTZWxlY3RlZCA9ICF0aGlzLmlzQ2FyZFNlbGVjdGVkO1xuICAgIHRoaXMubm90aWZ5Q2hlY2tib3hDaGFuZ2UoKTtcbiAgfVxuXG4gIG9uQ2hlY2tib3hDbGljayhldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICB0aGlzLm5vdGlmeUNoZWNrYm94Q2hhbmdlKCk7XG4gIH1cblxuICBwcml2YXRlIG5vdGlmeUNoZWNrYm94Q2hhbmdlKCk6IHZvaWQge1xuICAgIHRoaXMuc2VsZWN0ZWRDYXJkc0NoYW5nZS5lbWl0KHRoaXMuaXNDYXJkU2VsZWN0ZWQpO1xuICB9XG59XG4iLCI8c2EtY2FyZCBbd2lkdGhdPVwid2lkdGhcIiBbY3VzdG9tV3JhcHBlckNsYXNzXT1cImN1c3RvbVdyYXBwZXJDbGFzc1wiIChjbGljayk9XCJvbkNhcmRDbGljaygkZXZlbnQpXCIgW3Nob3dDYXJkQm9keV09XCJmYWxzZVwiXG4gICAgW3Nob3dDYXJkSGVhZGVyXT1cInRydWVcIiBbc2hvd0N1c3RvbUNhcmRCb2R5XT1cInRydWVcIiBjbGFzcz1cImNoZWNrYm94LWNhcmRcIiBbc3R5bGUud2lkdGhdPVwid2lkdGhcIj5cbiAgICA8c2EtY2FyZC10aXRsZS1oZWFkZXI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLWN1c3RvbS1oZWFkZXItY29udGFpbmVyXCI+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwic2EtY2FyZC10aXRsZS1sb2dvLWNvbnRhaW5lclwiPlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLXRpdGxlLWxvZ29cIj48c2EtaWNvbiBbaWNvbl09XCJmZWF0dXJlSWNvblwiXG4gICAgICAgICAgICAgICAgICAgICAgICBjdXN0b21DbGFzcz1cImF1dG8tZGltZW5zaW9ucyBjb2xvcmVkLWljb25cIj48L3NhLWljb24+XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWNhcmQtY3VzdG9tLXRpdGxlXCI+e3t0aXRsZX19PC9kaXY+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLXRpdGxlSWNvblwiPlxuICAgICAgICAgICAgICAgIDxzYS1jYXJkLXRpdGxlLWFjdGlvbnM+XG4gICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1kb2N1bWVudC1hY3Rpb25cIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxtYXQtY2hlY2tib3ggY2xhc3M9XCJleGFtcGxlLW1hcmdpblwiIFsobmdNb2RlbCldPVwiaXNDYXJkU2VsZWN0ZWRcIlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIChjbGljayk9XCJvbkNoZWNrYm94Q2xpY2soJGV2ZW50KVwiPjwvbWF0LWNoZWNrYm94PlxuICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICA8L3NhLWNhcmQtdGl0bGUtYWN0aW9ucz5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICA8L3NhLWNhcmQtdGl0bGUtaGVhZGVyPlxuICAgIDxzYS1jYXJkLWN1c3RvbS1ib2R5PlxuICAgICAgICA8bGliLWxpc3QgW2xpc3REYXRhXT1cImxpc3RJdGVtc1wiIFtmZWF0dXJlc0ljb25dPVwibGlzdEljb25cIj48L2xpYi1saXN0PlxuICAgIDwvc2EtY2FyZC1jdXN0b20tYm9keT5cbjwvc2EtY2FyZD4iXX0=
|
|
@@ -66,11 +66,11 @@ export class CardCarouselComponent {
|
|
|
66
66
|
}
|
|
67
67
|
}
|
|
68
68
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CardCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
69
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: CardCarouselComponent, isStandalone: true, selector: "sa-card-carousel", inputs: { cards: "cards", interval: "interval", autoPlay: "autoPlay", showNavigationArrows: "showNavigationArrows", showIndicators: "showIndicators", showBrandFooter: "showBrandFooter" }, ngImport: i0, template: "<!-- card-carousel.component.html -->\n<div class=\"carousel-container\">\n <div class=\"carousel-top-wrapper\">\n <div class=\"controls\">\n @if (showIndicators) {\n <div class=\"dots\">\n @for (card of cards; track card.id; let i = $index) {\n <span class=\"dot\" [class.active]=\"i === currentIndex\" (click)=\"selectCard(i)\"></span>\n }\n </div>\n }\n @if (showNavigationArrows) {\n <div class=\"arrow-controls\">\n <sa-icon [icon]=\"'leftChevronCircle'\" size=\"24\" (click)=\"prev()\"></sa-icon>\n <sa-icon [icon]=\"'rightChevronCircle'\" size=\"24\" (click)=\"next()\"></sa-icon>\n </div>\n }\n </div>\n\n <div class=\"card-container\">\n <sa-card [customWrapperClass]=\"'sa-card-custom-wrapper'\" [width]=\"'24.063rem'\" [column]=\"false\"\n [showCardHeader]=\"true\" [showCardBody]=\"true\" [body]=\"cards[currentIndex].body\">\n <sa-card-title-header>\n <div class=\"sa-card-custom-header-container\">\n <sa-icon [icon]=\"cards[currentIndex].avatarIcon\" size=\"50\"></sa-icon>\n <div class=\"sa-card-title-subtitle-container\">\n <div class=\"sa-card-custom-title\">{{ cards[currentIndex].title }}</div>\n <div class=\"sa-card-subtitle\">{{ cards[currentIndex].subtitle }}</div>\n </div>\n <div class=\"sa-card-titleIcon\">\n <sa-icon [icon]=\"cards[currentIndex].logoIcon\" customClass=\"logo-style\"></sa-icon>\n </div>\n </div>\n </sa-card-title-header>\n </sa-card>\n </div>\n </div>\n\n @if (showBrandFooter) {\n <div class=\"brand-logos-container\">\n <div class=\"brand-logos\">\n @for (logo of visibleLogos; track $index) {\n <sa-icon [icon]=\"logo.logoIcon\" [class.active]=\"$index === 1\" (click)=\"selectCard(logo.index)\"\n [customClass]=\"'logo-style'\">\n </sa-icon>\n }\n </div>\n </div>\n }\n\n\n\n</div>", styles: [".carousel-container{display:flex;flex-direction:column;align-items:center}.controls{display:flex;align-items:center;margin:0 0 var(--medium-20px) 0;width:100%;min-height:var(--medium-32px)}.dots{display:inline-flex;gap:var(--small-4px);align-items:center;
|
|
69
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: CardCarouselComponent, isStandalone: true, selector: "sa-card-carousel", inputs: { cards: "cards", interval: "interval", autoPlay: "autoPlay", showNavigationArrows: "showNavigationArrows", showIndicators: "showIndicators", showBrandFooter: "showBrandFooter" }, ngImport: i0, template: "<!-- card-carousel.component.html -->\n<div class=\"carousel-container\">\n <div class=\"carousel-top-wrapper\">\n <div class=\"controls\">\n @if (showIndicators) {\n <div class=\"dots\">\n @for (card of cards; track card.id; let i = $index) {\n <span class=\"dot\" [class.active]=\"i === currentIndex\" (click)=\"selectCard(i)\"></span>\n }\n </div>\n }\n @if (showNavigationArrows) {\n <div class=\"arrow-controls\">\n <sa-icon [icon]=\"'leftChevronCircle'\" size=\"24\" (click)=\"prev()\"></sa-icon>\n <sa-icon [icon]=\"'rightChevronCircle'\" size=\"24\" (click)=\"next()\"></sa-icon>\n </div>\n }\n </div>\n\n <div class=\"card-container\">\n <sa-card [customWrapperClass]=\"'sa-card-custom-wrapper'\" [width]=\"'24.063rem'\" [column]=\"false\"\n [showCardHeader]=\"true\" [showCardBody]=\"true\" [body]=\"cards[currentIndex].body\"\n [showHeaderBodyDivider]=\"true\">\n <sa-card-title-header>\n <div class=\"sa-card-custom-header-container\">\n <sa-icon [icon]=\"cards[currentIndex].avatarIcon\" size=\"50\"></sa-icon>\n <div class=\"sa-card-title-subtitle-container\">\n <div class=\"sa-card-custom-title\">{{ cards[currentIndex].title }}</div>\n <div class=\"sa-card-subtitle\">{{ cards[currentIndex].subtitle }}</div>\n </div>\n <div class=\"sa-card-titleIcon\">\n <sa-icon [icon]=\"cards[currentIndex].logoIcon\" customClass=\"logo-style\"></sa-icon>\n </div>\n </div>\n </sa-card-title-header>\n </sa-card>\n </div>\n </div>\n\n @if (showBrandFooter) {\n <div class=\"brand-logos-container\">\n <div class=\"brand-logos\">\n @for (logo of visibleLogos; track $index) {\n <sa-icon [icon]=\"logo.logoIcon\" [class.active]=\"$index === 1\" (click)=\"selectCard(logo.index)\"\n [customClass]=\"'logo-style'\">\n </sa-icon>\n }\n </div>\n </div>\n }\n\n\n\n</div>", styles: [".carousel-container{display:flex;flex-direction:column;align-items:center}.controls{display:flex;align-items:center;margin:0 0 var(--medium-20px) 0;width:100%;min-height:var(--medium-32px)}.dots{display:inline-flex;gap:var(--small-4px);align-items:center;width:17rem;overflow:hidden}.arrow-controls{display:flex;align-items:center;margin-top:var(--small-4px);gap:var(--small-12px);margin-left:auto}.arrow-controls sa-icon{cursor:pointer}.dot{width:var(--small-6px);height:var(--small-6px);min-width:var(--small-6px);min-height:var(--small-6px);border-radius:50%;background-color:var(--grey-200);margin:0 var(--small-6px);cursor:pointer;display:block}.dot.active{background-color:var(--primary-500);width:var(--small-8px);height:var(--small-8px);min-width:var(--small-8px);min-height:var(--small-8px)}.brand-logos-container{width:100%;margin-top:var(--medium-32px);overflow:hidden;max-width:28.9375rem}.brand-logos{display:flex;gap:var(--medium-24px);transition:transform .3s ease;justify-content:center;align-items:center}.brand-logos sa-icon{flex:0 0 60px;opacity:.5;cursor:pointer;transition:transform .3s ease,opacity .3s ease;display:flex;align-items:center;justify-content:center;height:var(--medium-32px);max-height:var(--medium-32px);min-height:var(--medium-32px)}.brand-logos sa-icon.active{opacity:1}.sa-icon.logo-style>svg{width:fit-content;height:fit-content}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "sa-card", inputs: ["title", "showCardHeader", "showCardBody", "showHeaderBodyDivider", "showCustomCardBody", "customWrapperClass", "chip", "body", "avatar", "image", "imageWidth", "avatarSize", "icon", "iconSize", "subtitle", "logoIcon", "width", "column"] }, { kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["img", "icon", "size", "color", "iconPath", "iconUrl", "customClass"] }, { kind: "component", type: CardCustomHeaderComponent, selector: "sa-card-title-header" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
70
70
|
}
|
|
71
71
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CardCarouselComponent, decorators: [{
|
|
72
72
|
type: Component,
|
|
73
|
-
args: [{ selector: 'sa-card-carousel', standalone: true, imports: [CardComponent, IconComponent, CardCustomHeaderComponent], encapsulation: ViewEncapsulation.None, template: "<!-- card-carousel.component.html -->\n<div class=\"carousel-container\">\n <div class=\"carousel-top-wrapper\">\n <div class=\"controls\">\n @if (showIndicators) {\n <div class=\"dots\">\n @for (card of cards; track card.id; let i = $index) {\n <span class=\"dot\" [class.active]=\"i === currentIndex\" (click)=\"selectCard(i)\"></span>\n }\n </div>\n }\n @if (showNavigationArrows) {\n <div class=\"arrow-controls\">\n <sa-icon [icon]=\"'leftChevronCircle'\" size=\"24\" (click)=\"prev()\"></sa-icon>\n <sa-icon [icon]=\"'rightChevronCircle'\" size=\"24\" (click)=\"next()\"></sa-icon>\n </div>\n }\n </div>\n\n <div class=\"card-container\">\n <sa-card [customWrapperClass]=\"'sa-card-custom-wrapper'\" [width]=\"'24.063rem'\" [column]=\"false\"\n [showCardHeader]=\"true\" [showCardBody]=\"true\" [body]=\"cards[currentIndex].body\">\n <sa-card-title-header>\n <div class=\"sa-card-custom-header-container\">\n <sa-icon [icon]=\"cards[currentIndex].avatarIcon\" size=\"50\"></sa-icon>\n <div class=\"sa-card-title-subtitle-container\">\n <div class=\"sa-card-custom-title\">{{ cards[currentIndex].title }}</div>\n <div class=\"sa-card-subtitle\">{{ cards[currentIndex].subtitle }}</div>\n </div>\n <div class=\"sa-card-titleIcon\">\n <sa-icon [icon]=\"cards[currentIndex].logoIcon\" customClass=\"logo-style\"></sa-icon>\n </div>\n </div>\n </sa-card-title-header>\n </sa-card>\n </div>\n </div>\n\n @if (showBrandFooter) {\n <div class=\"brand-logos-container\">\n <div class=\"brand-logos\">\n @for (logo of visibleLogos; track $index) {\n <sa-icon [icon]=\"logo.logoIcon\" [class.active]=\"$index === 1\" (click)=\"selectCard(logo.index)\"\n [customClass]=\"'logo-style'\">\n </sa-icon>\n }\n </div>\n </div>\n }\n\n\n\n</div>", styles: [".carousel-container{display:flex;flex-direction:column;align-items:center}.controls{display:flex;align-items:center;margin:0 0 var(--medium-20px) 0;width:100%;min-height:var(--medium-32px)}.dots{display:inline-flex;gap:var(--small-4px);align-items:center;
|
|
73
|
+
args: [{ selector: 'sa-card-carousel', standalone: true, imports: [CardComponent, IconComponent, CardCustomHeaderComponent], encapsulation: ViewEncapsulation.None, template: "<!-- card-carousel.component.html -->\n<div class=\"carousel-container\">\n <div class=\"carousel-top-wrapper\">\n <div class=\"controls\">\n @if (showIndicators) {\n <div class=\"dots\">\n @for (card of cards; track card.id; let i = $index) {\n <span class=\"dot\" [class.active]=\"i === currentIndex\" (click)=\"selectCard(i)\"></span>\n }\n </div>\n }\n @if (showNavigationArrows) {\n <div class=\"arrow-controls\">\n <sa-icon [icon]=\"'leftChevronCircle'\" size=\"24\" (click)=\"prev()\"></sa-icon>\n <sa-icon [icon]=\"'rightChevronCircle'\" size=\"24\" (click)=\"next()\"></sa-icon>\n </div>\n }\n </div>\n\n <div class=\"card-container\">\n <sa-card [customWrapperClass]=\"'sa-card-custom-wrapper'\" [width]=\"'24.063rem'\" [column]=\"false\"\n [showCardHeader]=\"true\" [showCardBody]=\"true\" [body]=\"cards[currentIndex].body\"\n [showHeaderBodyDivider]=\"true\">\n <sa-card-title-header>\n <div class=\"sa-card-custom-header-container\">\n <sa-icon [icon]=\"cards[currentIndex].avatarIcon\" size=\"50\"></sa-icon>\n <div class=\"sa-card-title-subtitle-container\">\n <div class=\"sa-card-custom-title\">{{ cards[currentIndex].title }}</div>\n <div class=\"sa-card-subtitle\">{{ cards[currentIndex].subtitle }}</div>\n </div>\n <div class=\"sa-card-titleIcon\">\n <sa-icon [icon]=\"cards[currentIndex].logoIcon\" customClass=\"logo-style\"></sa-icon>\n </div>\n </div>\n </sa-card-title-header>\n </sa-card>\n </div>\n </div>\n\n @if (showBrandFooter) {\n <div class=\"brand-logos-container\">\n <div class=\"brand-logos\">\n @for (logo of visibleLogos; track $index) {\n <sa-icon [icon]=\"logo.logoIcon\" [class.active]=\"$index === 1\" (click)=\"selectCard(logo.index)\"\n [customClass]=\"'logo-style'\">\n </sa-icon>\n }\n </div>\n </div>\n }\n\n\n\n</div>", styles: [".carousel-container{display:flex;flex-direction:column;align-items:center}.controls{display:flex;align-items:center;margin:0 0 var(--medium-20px) 0;width:100%;min-height:var(--medium-32px)}.dots{display:inline-flex;gap:var(--small-4px);align-items:center;width:17rem;overflow:hidden}.arrow-controls{display:flex;align-items:center;margin-top:var(--small-4px);gap:var(--small-12px);margin-left:auto}.arrow-controls sa-icon{cursor:pointer}.dot{width:var(--small-6px);height:var(--small-6px);min-width:var(--small-6px);min-height:var(--small-6px);border-radius:50%;background-color:var(--grey-200);margin:0 var(--small-6px);cursor:pointer;display:block}.dot.active{background-color:var(--primary-500);width:var(--small-8px);height:var(--small-8px);min-width:var(--small-8px);min-height:var(--small-8px)}.brand-logos-container{width:100%;margin-top:var(--medium-32px);overflow:hidden;max-width:28.9375rem}.brand-logos{display:flex;gap:var(--medium-24px);transition:transform .3s ease;justify-content:center;align-items:center}.brand-logos sa-icon{flex:0 0 60px;opacity:.5;cursor:pointer;transition:transform .3s ease,opacity .3s ease;display:flex;align-items:center;justify-content:center;height:var(--medium-32px);max-height:var(--medium-32px);min-height:var(--medium-32px)}.brand-logos sa-icon.active{opacity:1}.sa-icon.logo-style>svg{width:fit-content;height:fit-content}\n"] }]
|
|
74
74
|
}], propDecorators: { cards: [{
|
|
75
75
|
type: Input
|
|
76
76
|
}], interval: [{
|
|
@@ -84,4 +84,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
84
84
|
}], showBrandFooter: [{
|
|
85
85
|
type: Input
|
|
86
86
|
}] } });
|
|
87
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
87
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FyZC1jYXJvdXNlbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2NhcmQtY2Fyb3VzZWwvY2FyZC1jYXJvdXNlbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2NhcmQtY2Fyb3VzZWwvY2FyZC1jYXJvdXNlbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLEtBQUssRUFBYSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN2RixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdkQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSx5QkFBeUIsRUFBRSxNQUFNLHlEQUF5RCxDQUFDOztBQVlwRyxNQUFNLE9BQU8scUJBQXFCO0lBUmxDO1FBU1csVUFBSyxHQUFtQixFQUFFLENBQUM7UUFDM0IsYUFBUSxHQUFXLElBQUksQ0FBQztRQUN4QixhQUFRLEdBQVksSUFBSSxDQUFDO1FBQ3pCLHlCQUFvQixHQUFZLElBQUksQ0FBQztRQUNyQyxtQkFBYyxHQUFZLElBQUksQ0FBQztRQUMvQixvQkFBZSxHQUFZLElBQUksQ0FBQztRQUV6QyxpQkFBWSxHQUF5QyxFQUFFLENBQUM7UUFFeEQsaUJBQVksR0FBVyxDQUFDLENBQUM7S0ErRDFCO0lBNURDLFFBQVE7UUFDTixJQUFJLENBQUMsa0JBQWtCLEVBQUUsQ0FBQztRQUMxQixJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztZQUNsQixJQUFJLENBQUMsVUFBVSxFQUFFLENBQUM7UUFDcEIsQ0FBQztJQUNILENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ25CLENBQUM7SUFHRCxVQUFVO1FBQ1IsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxLQUFLLEdBQUcsV0FBVyxDQUFDLEdBQUcsRUFBRTtZQUM1QixJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDZCxDQUFDLEVBQUUsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ3BCLENBQUM7SUFFRCxTQUFTO1FBQ1AsSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDZixhQUFhLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzVCLENBQUM7SUFDSCxDQUFDO0lBRUQsVUFBVTtRQUNSLGFBQWEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDMUIsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7WUFDbEIsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1FBQ3BCLENBQUM7SUFDSCxDQUFDO0lBRUQsVUFBVSxDQUFDLEtBQWE7UUFDdEIsSUFBSSxDQUFDLFlBQVksR0FBRyxLQUFLLENBQUM7UUFDMUIsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1FBQ2xCLElBQUksQ0FBQyxrQkFBa0IsRUFBRSxDQUFDO0lBQzVCLENBQUM7SUFFRCxJQUFJO1FBQ0YsSUFBSSxDQUFDLFlBQVksR0FBRyxDQUFDLElBQUksQ0FBQyxZQUFZLEdBQUcsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUM7UUFDaEUsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1FBQ2xCLElBQUksQ0FBQyxrQkFBa0IsRUFBRSxDQUFDO0lBQzVCLENBQUM7SUFFRCxJQUFJO1FBQ0YsSUFBSSxDQUFDLFlBQVksR0FBRyxDQUFDLElBQUksQ0FBQyxZQUFZLEdBQUcsQ0FBQyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUM7UUFDcEYsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1FBQ2xCLElBQUksQ0FBQyxrQkFBa0IsRUFBRSxDQUFDO0lBQzVCLENBQUM7SUFFRCxrQkFBa0I7UUFDaEIsSUFBSSxDQUFDLFlBQVksR0FBRyxFQUFFLENBQUM7UUFDdkIsS0FBSyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsRUFBRSxFQUFFLENBQUM7WUFDN0IsTUFBTSxLQUFLLEdBQUcsQ0FBQyxJQUFJLENBQUMsWUFBWSxHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxDQUFDO1lBQzlFLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDO2dCQUNyQixHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDO2dCQUNwQixLQUFLLEVBQUUsS0FBSzthQUNiLENBQUMsQ0FBQztRQUNMLENBQUM7SUFDSCxDQUFDOzhHQXhFVSxxQkFBcUI7a0dBQXJCLHFCQUFxQix3UUNmbEMsZzBFQXFETSxzNUNEM0NNLGFBQWEsNFNBQUUsYUFBYSxvSUFBRSx5QkFBeUI7OzJGQUt0RCxxQkFBcUI7a0JBUmpDLFNBQVM7K0JBQ0Usa0JBQWtCLGNBQ2hCLElBQUksV0FDUCxDQUFDLGFBQWEsRUFBRSxhQUFhLEVBQUUseUJBQXlCLENBQUMsaUJBR25ELGlCQUFpQixDQUFDLElBQUk7OEJBRzVCLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csb0JBQW9CO3NCQUE1QixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBJbnB1dCwgT25EZXN0cm95LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ2FyZENvbXBvbmVudCB9IGZyb20gJy4uL2NhcmQvY2FyZC5jb21wb25lbnQnO1xuaW1wb3J0IHsgSWNvbkNvbXBvbmVudCB9IGZyb20gJy4uL2ljb24vaWNvbi5jb21wb25lbnQnO1xuaW1wb3J0IHsgQ2FyZEN1c3RvbUhlYWRlckNvbXBvbmVudCB9IGZyb20gJy4uL2NhcmQvY2FyZC1jdXN0b20taGVhZGVyL2NhcmQtY3VzdG9tLWhlYWRlci5jb21wb25lbnQnO1xuaW1wb3J0IHsgQ2FyZENhcm91c2VsIH0gZnJvbSAnLi4vLi4vaW50ZXJmYWNlcy9jYXJkLWNhcm91c2VsLWludGVyZmFjZSc7XG5cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc2EtY2FyZC1jYXJvdXNlbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDYXJkQ29tcG9uZW50LCBJY29uQ29tcG9uZW50LCBDYXJkQ3VzdG9tSGVhZGVyQ29tcG9uZW50XSxcbiAgdGVtcGxhdGVVcmw6ICcuL2NhcmQtY2Fyb3VzZWwuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vY2FyZC1jYXJvdXNlbC5jb21wb25lbnQuY3NzJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZVxufSlcbmV4cG9ydCBjbGFzcyBDYXJkQ2Fyb3VzZWxDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gIEBJbnB1dCgpIGNhcmRzOiBDYXJkQ2Fyb3VzZWxbXSA9IFtdO1xuICBASW5wdXQoKSBpbnRlcnZhbDogbnVtYmVyID0gNTAwMDtcbiAgQElucHV0KCkgYXV0b1BsYXk6IGJvb2xlYW4gPSB0cnVlO1xuICBASW5wdXQoKSBzaG93TmF2aWdhdGlvbkFycm93czogYm9vbGVhbiA9IHRydWU7XG4gIEBJbnB1dCgpIHNob3dJbmRpY2F0b3JzOiBib29sZWFuID0gdHJ1ZTtcbiAgQElucHV0KCkgc2hvd0JyYW5kRm9vdGVyOiBib29sZWFuID0gdHJ1ZTtcblxuICB2aXNpYmxlTG9nb3M6IChDYXJkQ2Fyb3VzZWwgJiB7IGluZGV4OiBudW1iZXIgfSlbXSA9IFtdO1xuXG4gIGN1cnJlbnRJbmRleDogbnVtYmVyID0gMDtcbiAgcHJpdmF0ZSB0aW1lcjogYW55O1xuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMudXBkYXRlVmlzaWJsZUxvZ29zKCk7XG4gICAgaWYgKHRoaXMuYXV0b1BsYXkpIHtcbiAgICAgIHRoaXMuc3RhcnRUaW1lcigpO1xuICAgIH1cbiAgfVxuXG4gIG5nT25EZXN0cm95KCkge1xuICAgIHRoaXMuc3RvcFRpbWVyKCk7XG4gIH1cblxuXG4gIHN0YXJ0VGltZXIoKSB7XG4gICAgdGhpcy5zdG9wVGltZXIoKTtcbiAgICB0aGlzLnRpbWVyID0gc2V0SW50ZXJ2YWwoKCkgPT4ge1xuICAgICAgdGhpcy5uZXh0KCk7XG4gICAgfSwgdGhpcy5pbnRlcnZhbCk7XG4gIH1cblxuICBzdG9wVGltZXIoKSB7XG4gICAgaWYgKHRoaXMudGltZXIpIHtcbiAgICAgIGNsZWFySW50ZXJ2YWwodGhpcy50aW1lcik7XG4gICAgfVxuICB9XG5cbiAgcmVzZXRUaW1lcigpIHtcbiAgICBjbGVhckludGVydmFsKHRoaXMudGltZXIpO1xuICAgIGlmICh0aGlzLmF1dG9QbGF5KSB7XG4gICAgICB0aGlzLnN0YXJ0VGltZXIoKTtcbiAgICB9XG4gIH1cblxuICBzZWxlY3RDYXJkKGluZGV4OiBudW1iZXIpIHtcbiAgICB0aGlzLmN1cnJlbnRJbmRleCA9IGluZGV4O1xuICAgIHRoaXMucmVzZXRUaW1lcigpO1xuICAgIHRoaXMudXBkYXRlVmlzaWJsZUxvZ29zKCk7XG4gIH1cblxuICBuZXh0KCkge1xuICAgIHRoaXMuY3VycmVudEluZGV4ID0gKHRoaXMuY3VycmVudEluZGV4ICsgMSkgJSB0aGlzLmNhcmRzLmxlbmd0aDtcbiAgICB0aGlzLnJlc2V0VGltZXIoKTtcbiAgICB0aGlzLnVwZGF0ZVZpc2libGVMb2dvcygpO1xuICB9XG5cbiAgcHJldigpIHtcbiAgICB0aGlzLmN1cnJlbnRJbmRleCA9ICh0aGlzLmN1cnJlbnRJbmRleCAtIDEgKyB0aGlzLmNhcmRzLmxlbmd0aCkgJSB0aGlzLmNhcmRzLmxlbmd0aDtcbiAgICB0aGlzLnJlc2V0VGltZXIoKTtcbiAgICB0aGlzLnVwZGF0ZVZpc2libGVMb2dvcygpO1xuICB9XG5cbiAgdXBkYXRlVmlzaWJsZUxvZ29zKCkge1xuICAgIHRoaXMudmlzaWJsZUxvZ29zID0gW107XG4gICAgZm9yIChsZXQgaSA9IC0xOyBpIDw9IDQ7IGkrKykge1xuICAgICAgY29uc3QgaW5kZXggPSAodGhpcy5jdXJyZW50SW5kZXggKyBpICsgdGhpcy5jYXJkcy5sZW5ndGgpICUgdGhpcy5jYXJkcy5sZW5ndGg7XG4gICAgICB0aGlzLnZpc2libGVMb2dvcy5wdXNoKHtcbiAgICAgICAgLi4udGhpcy5jYXJkc1tpbmRleF0sXG4gICAgICAgIGluZGV4OiBpbmRleFxuICAgICAgfSk7XG4gICAgfVxuICB9XG59XG4iLCI8IS0tIGNhcmQtY2Fyb3VzZWwuY29tcG9uZW50Lmh0bWwgLS0+XG48ZGl2IGNsYXNzPVwiY2Fyb3VzZWwtY29udGFpbmVyXCI+XG4gICAgPGRpdiBjbGFzcz1cImNhcm91c2VsLXRvcC13cmFwcGVyXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjb250cm9sc1wiPlxuICAgICAgICAgICAgQGlmIChzaG93SW5kaWNhdG9ycykge1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImRvdHNcIj5cbiAgICAgICAgICAgICAgICBAZm9yIChjYXJkIG9mIGNhcmRzOyB0cmFjayBjYXJkLmlkOyBsZXQgaSA9ICRpbmRleCkge1xuICAgICAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiZG90XCIgW2NsYXNzLmFjdGl2ZV09XCJpID09PSBjdXJyZW50SW5kZXhcIiAoY2xpY2spPVwic2VsZWN0Q2FyZChpKVwiPjwvc3Bhbj5cbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIEBpZiAoc2hvd05hdmlnYXRpb25BcnJvd3MpIHtcbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJhcnJvdy1jb250cm9sc1wiPlxuICAgICAgICAgICAgICAgIDxzYS1pY29uIFtpY29uXT1cIidsZWZ0Q2hldnJvbkNpcmNsZSdcIiBzaXplPVwiMjRcIiAoY2xpY2spPVwicHJldigpXCI+PC9zYS1pY29uPlxuICAgICAgICAgICAgICAgIDxzYS1pY29uIFtpY29uXT1cIidyaWdodENoZXZyb25DaXJjbGUnXCIgc2l6ZT1cIjI0XCIgKGNsaWNrKT1cIm5leHQoKVwiPjwvc2EtaWNvbj5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgfVxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8ZGl2IGNsYXNzPVwiY2FyZC1jb250YWluZXJcIj5cbiAgICAgICAgICAgIDxzYS1jYXJkIFtjdXN0b21XcmFwcGVyQ2xhc3NdPVwiJ3NhLWNhcmQtY3VzdG9tLXdyYXBwZXInXCIgW3dpZHRoXT1cIicyNC4wNjNyZW0nXCIgW2NvbHVtbl09XCJmYWxzZVwiXG4gICAgICAgICAgICAgICAgW3Nob3dDYXJkSGVhZGVyXT1cInRydWVcIiBbc2hvd0NhcmRCb2R5XT1cInRydWVcIiBbYm9keV09XCJjYXJkc1tjdXJyZW50SW5kZXhdLmJvZHlcIlxuICAgICAgICAgICAgICAgIFtzaG93SGVhZGVyQm9keURpdmlkZXJdPVwidHJ1ZVwiPlxuICAgICAgICAgICAgICAgIDxzYS1jYXJkLXRpdGxlLWhlYWRlcj5cbiAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWNhcmQtY3VzdG9tLWhlYWRlci1jb250YWluZXJcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxzYS1pY29uIFtpY29uXT1cImNhcmRzW2N1cnJlbnRJbmRleF0uYXZhdGFySWNvblwiIHNpemU9XCI1MFwiPjwvc2EtaWNvbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLXRpdGxlLXN1YnRpdGxlLWNvbnRhaW5lclwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYS1jYXJkLWN1c3RvbS10aXRsZVwiPnt7IGNhcmRzW2N1cnJlbnRJbmRleF0udGl0bGUgfX08L2Rpdj5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwic2EtY2FyZC1zdWJ0aXRsZVwiPnt7IGNhcmRzW2N1cnJlbnRJbmRleF0uc3VidGl0bGUgfX08L2Rpdj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWNhcmQtdGl0bGVJY29uXCI+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPHNhLWljb24gW2ljb25dPVwiY2FyZHNbY3VycmVudEluZGV4XS5sb2dvSWNvblwiIGN1c3RvbUNsYXNzPVwibG9nby1zdHlsZVwiPjwvc2EtaWNvbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICA8L3NhLWNhcmQtdGl0bGUtaGVhZGVyPlxuICAgICAgICAgICAgPC9zYS1jYXJkPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cblxuICAgIEBpZiAoc2hvd0JyYW5kRm9vdGVyKSB7XG4gICAgPGRpdiBjbGFzcz1cImJyYW5kLWxvZ29zLWNvbnRhaW5lclwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiYnJhbmQtbG9nb3NcIj5cbiAgICAgICAgICAgIEBmb3IgKGxvZ28gb2YgdmlzaWJsZUxvZ29zOyB0cmFjayAkaW5kZXgpIHtcbiAgICAgICAgICAgIDxzYS1pY29uIFtpY29uXT1cImxvZ28ubG9nb0ljb25cIiBbY2xhc3MuYWN0aXZlXT1cIiRpbmRleCA9PT0gMVwiIChjbGljayk9XCJzZWxlY3RDYXJkKGxvZ28uaW5kZXgpXCJcbiAgICAgICAgICAgICAgICBbY3VzdG9tQ2xhc3NdPVwiJ2xvZ28tc3R5bGUnXCI+XG4gICAgICAgICAgICA8L3NhLWljb24+XG4gICAgICAgICAgICB9XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICAgIH1cblxuXG5cbjwvZGl2PiJdfQ==
|
|
@@ -28,11 +28,11 @@ export class CheckboxComponent {
|
|
|
28
28
|
return this.selectedValues.some((o) => o.value === option.value);
|
|
29
29
|
}
|
|
30
30
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CheckboxComponent, isStandalone: true, selector: "sa-checkbox", inputs: { options: "options", disabled: "disabled", selectedValues: "selectedValues", type: "type", state: "state" }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: "<div class=\"checkbox-container\">\n <mat-chip-listbox selectable multiple [disabled]=\"disabled\" aria-label=\"Select options\">\n <mat-chip-option *ngFor=\"let option of options\" class=\"custom-chip\" [value]=\"option.value\"\n (click)=\"onSelectionChange(option)\" [selected]=\"isSelected(option)\">\n {{ option.label }}\n </mat-chip-option>\n </mat-chip-listbox>\n</div>", styles: [".mat-mdc-radio-button~.mat-mdc-radio-button{margin-left:var(--small-16px)}::ng-deep .checkbox-container .custom-chip.mat-chip.mat-chip-selected:after{content:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__graphic{display:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__text-label:not(:only-child){padding-left:var(--small-12px)}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip.mdc-evolution-chip--selected:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--primary-500);background-color:var(--structural-white, #FFF);padding:.125rem .625rem}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--grey-100, #EAECF0);background-color:var(--structural-white, #FFF);
|
|
31
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CheckboxComponent, isStandalone: true, selector: "sa-checkbox", inputs: { options: "options", disabled: "disabled", selectedValues: "selectedValues", type: "type", state: "state" }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: "<div class=\"checkbox-container\">\n <mat-chip-listbox selectable multiple [disabled]=\"disabled\" aria-label=\"Select options\">\n <mat-chip-option *ngFor=\"let option of options\" class=\"custom-chip\" [value]=\"option.value\"\n (click)=\"onSelectionChange(option)\" [selected]=\"isSelected(option)\">\n {{ option.label }}\n </mat-chip-option>\n </mat-chip-listbox>\n</div>", styles: [".mat-mdc-radio-button~.mat-mdc-radio-button{margin-left:var(--small-16px)}::ng-deep .checkbox-container .custom-chip.mat-chip.mat-chip-selected:after{content:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__graphic{display:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__text-label:not(:only-child){padding-left:var(--small-12px)}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip.mdc-evolution-chip--selected:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--primary-500);background-color:var(--structural-white, #FFF);padding:.125rem .625rem}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--grey-100, #EAECF0);background-color:var(--structural-white, #FFF);padding:.125rem .625rem}::ng-deep .checkbox-container .mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled) .mdc-evolution-chip__action--primary:before{border:none}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip.mdc-evolution-chip--selected:not(.mdc-evolution-chip--disabled) .mdc-evolution-chip__text-label{color:var(--primary-500);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:500;line-height:var(--medium-20px);letter-spacing:.2px}::ng-deep .checkbox-container mat-chip-option.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{background-color:var(--structural-white, #FFF)}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused:before,::ng-deep .checkbox-container.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus:before{background-color:var(--structural-white, #FFF)}::ng-deep .checkbox-container .mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:0;background:var(--structural-white, #FFF)}::ng-deep .checkbox-container .mat-mdc-chip.mat-mdc-chip-option:hover{background-color:var(--structural-neutral1)}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i1.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }] }); }
|
|
32
32
|
}
|
|
33
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
34
34
|
type: Component,
|
|
35
|
-
args: [{ selector: 'sa-checkbox', standalone: true, imports: [MatChipsModule, CommonModule, FormsModule], template: "<div class=\"checkbox-container\">\n <mat-chip-listbox selectable multiple [disabled]=\"disabled\" aria-label=\"Select options\">\n <mat-chip-option *ngFor=\"let option of options\" class=\"custom-chip\" [value]=\"option.value\"\n (click)=\"onSelectionChange(option)\" [selected]=\"isSelected(option)\">\n {{ option.label }}\n </mat-chip-option>\n </mat-chip-listbox>\n</div>", styles: [".mat-mdc-radio-button~.mat-mdc-radio-button{margin-left:var(--small-16px)}::ng-deep .checkbox-container .custom-chip.mat-chip.mat-chip-selected:after{content:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__graphic{display:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__text-label:not(:only-child){padding-left:var(--small-12px)}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip.mdc-evolution-chip--selected:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--primary-500);background-color:var(--structural-white, #FFF);padding:.125rem .625rem}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--grey-100, #EAECF0);background-color:var(--structural-white, #FFF);
|
|
35
|
+
args: [{ selector: 'sa-checkbox', standalone: true, imports: [MatChipsModule, CommonModule, FormsModule], template: "<div class=\"checkbox-container\">\n <mat-chip-listbox selectable multiple [disabled]=\"disabled\" aria-label=\"Select options\">\n <mat-chip-option *ngFor=\"let option of options\" class=\"custom-chip\" [value]=\"option.value\"\n (click)=\"onSelectionChange(option)\" [selected]=\"isSelected(option)\">\n {{ option.label }}\n </mat-chip-option>\n </mat-chip-listbox>\n</div>", styles: [".mat-mdc-radio-button~.mat-mdc-radio-button{margin-left:var(--small-16px)}::ng-deep .checkbox-container .custom-chip.mat-chip.mat-chip-selected:after{content:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__graphic{display:none}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__text-label:not(:only-child){padding-left:var(--small-12px)}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip.mdc-evolution-chip--selected:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--primary-500);background-color:var(--structural-white, #FFF);padding:.125rem .625rem}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled){border-radius:var(--large-64px, 64px);border:1.3px solid var(--grey-100, #EAECF0);background-color:var(--structural-white, #FFF);padding:.125rem .625rem}::ng-deep .checkbox-container .mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled) .mdc-evolution-chip__action--primary:before{border:none}::ng-deep .checkbox-container mat-chip-option.mat-mdc-standard-chip.mdc-evolution-chip--selected:not(.mdc-evolution-chip--disabled) .mdc-evolution-chip__text-label{color:var(--primary-500);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:500;line-height:var(--medium-20px);letter-spacing:.2px}::ng-deep .checkbox-container mat-chip-option.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{background-color:var(--structural-white, #FFF)}::ng-deep .checkbox-container .mat-mdc-standard-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused:before,::ng-deep .checkbox-container.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus:before{background-color:var(--structural-white, #FFF)}::ng-deep .checkbox-container .mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:0;background:var(--structural-white, #FFF)}::ng-deep .checkbox-container .mat-mdc-chip.mat-mdc-chip-option:hover{background-color:var(--structural-neutral1)}\n"] }]
|
|
36
36
|
}], propDecorators: { options: [{
|
|
37
37
|
type: Input
|
|
38
38
|
}], disabled: [{
|
|
@@ -46,4 +46,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
46
46
|
}], state: [{
|
|
47
47
|
type: Input
|
|
48
48
|
}] } });
|
|
49
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
49
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3guY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9jaGVja2JveC9jaGVja2JveC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2NoZWNrYm94L2NoZWNrYm94LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRXpELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7QUFTN0MsTUFBTSxPQUFPLGlCQUFpQjtJQVA5QjtRQVFXLFlBQU8sR0FBc0IsRUFBRSxDQUFDO1FBQ2hDLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsbUJBQWMsR0FBc0IsRUFBRSxDQUFDO1FBQ3RDLG9CQUFlLEdBQUcsSUFBSSxZQUFZLEVBQXFCLENBQUM7S0FxQm5FO0lBakJDLGlCQUFpQixDQUFDLE1BQXVCO1FBQ3ZDLE1BQU0sYUFBYSxHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUM7UUFDL0MsTUFBTSxLQUFLLEdBQUcsYUFBYSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLEtBQUssS0FBSyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFdkUsSUFBSSxLQUFLLEdBQUcsQ0FBQyxDQUFDLEVBQUUsQ0FBQztZQUNmLGFBQWEsQ0FBQyxNQUFNLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBQ2pDLENBQUM7YUFBTSxDQUFDO1lBQ04sYUFBYSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUM3QixDQUFDO1FBRUQsSUFBSSxDQUFDLGNBQWMsR0FBRyxhQUFhLENBQUM7UUFDcEMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxDQUFDO0lBQ2pELENBQUM7SUFFRCxVQUFVLENBQUMsTUFBdUI7UUFDaEMsT0FBTyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLEtBQUssS0FBSyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDbkUsQ0FBQzs4R0F4QlUsaUJBQWlCO2tHQUFqQixpQkFBaUIsOE9DYjlCLG1hQU9NLDhzRURFTSxjQUFjLDhjQUFFLFlBQVksMkpBQUUsV0FBVzs7MkZBSXhDLGlCQUFpQjtrQkFQN0IsU0FBUzsrQkFDRSxhQUFhLGNBQ1gsSUFBSSxXQUNQLENBQUMsY0FBYyxFQUFFLFlBQVksRUFBRSxXQUFXLENBQUM7OEJBSzNDLE9BQU87c0JBQWYsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0ksZUFBZTtzQkFBeEIsTUFBTTtnQkFDRSxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE1hdENoaXBzTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvY2hpcHMnO1xuaW1wb3J0IHsgT3B0aW9uSW50ZXJmYWNlIH0gZnJvbSAnLi4vLi4vaW50ZXJmYWNlcy9vcHRpb24taW50ZXJmYWNlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc2EtY2hlY2tib3gnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbTWF0Q2hpcHNNb2R1bGUsIENvbW1vbk1vZHVsZSwgRm9ybXNNb2R1bGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vY2hlY2tib3guY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vY2hlY2tib3guY29tcG9uZW50LmNzcydcbn0pXG5leHBvcnQgY2xhc3MgQ2hlY2tib3hDb21wb25lbnQge1xuICBASW5wdXQoKSBvcHRpb25zOiBPcHRpb25JbnRlcmZhY2VbXSA9IFtdO1xuICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuICBASW5wdXQoKSBzZWxlY3RlZFZhbHVlczogT3B0aW9uSW50ZXJmYWNlW10gPSBbXTtcbiAgQE91dHB1dCgpIHNlbGVjdGlvbkNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8T3B0aW9uSW50ZXJmYWNlW10+KCk7XG4gIEBJbnB1dCgpIHR5cGU6IHN0cmluZztcbiAgQElucHV0KCkgc3RhdGU6IHN0cmluZztcblxuICBvblNlbGVjdGlvbkNoYW5nZShvcHRpb246IE9wdGlvbkludGVyZmFjZSk6IHZvaWQge1xuICAgIGNvbnN0IHVwZGF0ZWRWYWx1ZXMgPSBbLi4udGhpcy5zZWxlY3RlZFZhbHVlc107XG4gICAgY29uc3QgaW5kZXggPSB1cGRhdGVkVmFsdWVzLmZpbmRJbmRleCgobykgPT4gby52YWx1ZSA9PT0gb3B0aW9uLnZhbHVlKTtcblxuICAgIGlmIChpbmRleCA+IC0xKSB7XG4gICAgICB1cGRhdGVkVmFsdWVzLnNwbGljZShpbmRleCwgMSk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHVwZGF0ZWRWYWx1ZXMucHVzaChvcHRpb24pO1xuICAgIH1cblxuICAgIHRoaXMuc2VsZWN0ZWRWYWx1ZXMgPSB1cGRhdGVkVmFsdWVzO1xuICAgIHRoaXMuc2VsZWN0aW9uQ2hhbmdlLmVtaXQodGhpcy5zZWxlY3RlZFZhbHVlcyk7XG4gIH1cblxuICBpc1NlbGVjdGVkKG9wdGlvbjogT3B0aW9uSW50ZXJmYWNlKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuc2VsZWN0ZWRWYWx1ZXMuc29tZSgobykgPT4gby52YWx1ZSA9PT0gb3B0aW9uLnZhbHVlKTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImNoZWNrYm94LWNvbnRhaW5lclwiPlxuICAgIDxtYXQtY2hpcC1saXN0Ym94IHNlbGVjdGFibGUgbXVsdGlwbGUgW2Rpc2FibGVkXT1cImRpc2FibGVkXCIgYXJpYS1sYWJlbD1cIlNlbGVjdCBvcHRpb25zXCI+XG4gICAgICAgIDxtYXQtY2hpcC1vcHRpb24gKm5nRm9yPVwibGV0IG9wdGlvbiBvZiBvcHRpb25zXCIgY2xhc3M9XCJjdXN0b20tY2hpcFwiIFt2YWx1ZV09XCJvcHRpb24udmFsdWVcIlxuICAgICAgICAgICAgKGNsaWNrKT1cIm9uU2VsZWN0aW9uQ2hhbmdlKG9wdGlvbilcIiBbc2VsZWN0ZWRdPVwiaXNTZWxlY3RlZChvcHRpb24pXCI+XG4gICAgICAgICAgICB7eyBvcHRpb24ubGFiZWwgfX1cbiAgICAgICAgPC9tYXQtY2hpcC1vcHRpb24+XG4gICAgPC9tYXQtY2hpcC1saXN0Ym94PlxuPC9kaXY+Il19
|
|
@@ -43,11 +43,11 @@ export class IconComponent {
|
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
45
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
46
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: IconComponent, isStandalone: true, selector: "sa-icon", inputs: { img: "img", icon: "icon", size: "size", color: "color", iconPath: "iconPath", iconUrl: "iconUrl", customClass: "customClass" }, usesOnChanges: true, ngImport: i0, template: "@if(img){\n<img [src]=\"img\" [height]=\"size\" [width]=\"size\">\n}@else{\n<span class=\"sa-icon\" [ngClass]=\"{\n 'url-icon': iconUrl\n }\" [ngClass]=\"customClass ? [customClass] : []\" [innerHTML]=\"svgIcon\" [ngStyle]=\"iconStyles\">\n\n</span>\n}", styles: [".sa-icon{display:inline-flex;align-items:center;justify-content:center;color:inherit;font-size:inherit}.sa-icon>svg{width:1em;height:1em;vertical-align:middle}.sa-icon.auto-dimensions>svg{width:fit-content;height:fit-content}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
46
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: IconComponent, isStandalone: true, selector: "sa-icon", inputs: { img: "img", icon: "icon", size: "size", color: "color", iconPath: "iconPath", iconUrl: "iconUrl", customClass: "customClass" }, usesOnChanges: true, ngImport: i0, template: "@if(img){\n<img [src]=\"img\" [height]=\"size\" [width]=\"size\">\n}@else{\n<span class=\"sa-icon\" [ngClass]=\"{\n 'url-icon': iconUrl\n }\" [ngClass]=\"customClass ? [customClass] : []\" [innerHTML]=\"svgIcon\" [ngStyle]=\"iconStyles\">\n\n</span>\n}", styles: [".sa-icon{display:inline-flex;align-items:center;justify-content:center;color:inherit;font-size:inherit}.sa-icon>svg{width:1em;height:1em;vertical-align:middle}.sa-icon.auto-dimensions>svg{width:fit-content;height:fit-content}.colored-icon{color:var(--primary-500)}.sa-card-checkbox-wrapper .sa-card-title-logo .sa-icon{display:flex;width:var(--medium-28px, 28px);padding:var(--small-4px, 4px);align-items:center;border-radius:var(--small-4px, 4px);background:var(--primary-50, #F4EBFF)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
47
47
|
}
|
|
48
48
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, decorators: [{
|
|
49
49
|
type: Component,
|
|
50
|
-
args: [{ selector: 'sa-icon', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "@if(img){\n<img [src]=\"img\" [height]=\"size\" [width]=\"size\">\n}@else{\n<span class=\"sa-icon\" [ngClass]=\"{\n 'url-icon': iconUrl\n }\" [ngClass]=\"customClass ? [customClass] : []\" [innerHTML]=\"svgIcon\" [ngStyle]=\"iconStyles\">\n\n</span>\n}", styles: [".sa-icon{display:inline-flex;align-items:center;justify-content:center;color:inherit;font-size:inherit}.sa-icon>svg{width:1em;height:1em;vertical-align:middle}.sa-icon.auto-dimensions>svg{width:fit-content;height:fit-content}\n"] }]
|
|
50
|
+
args: [{ selector: 'sa-icon', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "@if(img){\n<img [src]=\"img\" [height]=\"size\" [width]=\"size\">\n}@else{\n<span class=\"sa-icon\" [ngClass]=\"{\n 'url-icon': iconUrl\n }\" [ngClass]=\"customClass ? [customClass] : []\" [innerHTML]=\"svgIcon\" [ngStyle]=\"iconStyles\">\n\n</span>\n}", styles: [".sa-icon{display:inline-flex;align-items:center;justify-content:center;color:inherit;font-size:inherit}.sa-icon>svg{width:1em;height:1em;vertical-align:middle}.sa-icon.auto-dimensions>svg{width:fit-content;height:fit-content}.colored-icon{color:var(--primary-500)}.sa-card-checkbox-wrapper .sa-card-title-logo .sa-icon{display:flex;width:var(--medium-28px, 28px);padding:var(--small-4px, 4px);align-items:center;border-radius:var(--small-4px, 4px);background:var(--primary-50, #F4EBFF)}\n"] }]
|
|
51
51
|
}], ctorParameters: () => [], propDecorators: { img: [{
|
|
52
52
|
type: Input,
|
|
53
53
|
args: ['img']
|
|
@@ -69,4 +69,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
69
69
|
type: Input,
|
|
70
70
|
args: ['customClass']
|
|
71
71
|
}] } });
|
|
72
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
72
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2ljb24vaWNvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2ljb24vaWNvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBVSxLQUFLLEVBQWlCLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ25HLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUc3QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDekQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDOzs7QUFVL0MsTUFBTSxPQUFPLGFBQWE7SUFtQnhCO1FBbEJBLGdCQUFXLEdBQUcsTUFBTSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQ2xDLGNBQVMsR0FBRyxNQUFNLENBQUMsWUFBWSxDQUFDLENBQUM7UUFPZCxhQUFRLEdBQVcsRUFBRSxDQUFDO1FBQ2hDLFlBQU8sR0FBVyxFQUFFLENBQUM7UUFDUixnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQUcvQyxlQUFVLEdBQVE7UUFDaEIsb0JBQW9CO1FBQ3BCLGVBQWU7U0FDaEIsQ0FBQztJQUdGLENBQUM7SUFDRCxRQUFRO0lBQ1IsQ0FBQztJQUNELFdBQVcsQ0FBQyxPQUFzQjtRQUdoQyxJQUFJLE9BQU8sQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLEVBQUUsRUFBRSxDQUFDO1lBQ2xELElBQUksQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLElBQUksRUFBRSxFQUFFLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxHQUFHLEVBQUUsRUFBRTtnQkFDeEUsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLHVCQUF1QixDQUFDLEdBQUcsQ0FBQyxDQUFDO1lBQzdELENBQUMsQ0FBQyxDQUFBO1FBQ0osQ0FBQztRQUNELElBQUksT0FBTyxDQUFDLE1BQU0sQ0FBQyxJQUFJLE9BQU8sQ0FBQyxTQUFTLENBQUMsRUFBRSxDQUFDO1lBQzFDLE1BQU0sSUFBSSxHQUFHLElBQUksQ0FBQyxJQUFJLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQztZQUN2QyxJQUFJLElBQUksRUFBRSxDQUFDO2dCQUNULElBQUksQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFO29CQUM5QyxJQUFJLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsdUJBQXVCLENBQUMsR0FBRyxDQUFDLENBQUM7Z0JBQzdELENBQUMsQ0FBQyxDQUFBO1lBQ0osQ0FBQztpQkFBTSxDQUFDO2dCQUNOLElBQUksQ0FBQyxPQUFPLEdBQUcsRUFBRSxDQUFDO1lBQ3BCLENBQUM7UUFDSCxDQUFDO1FBQ0QsSUFBSSxPQUFPLENBQUMsTUFBTSxDQUFDLElBQUksT0FBTyxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUM7WUFDeEMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7WUFDNUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7WUFDN0QsSUFBSSxDQUFDLFVBQVUsQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7WUFDOUQsSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQztRQUNyQyxDQUFDO0lBQ0gsQ0FBQzs4R0EvQ1UsYUFBYTtrR0FBYixhQUFhLGtPQ2YxQixrUUFRQyxpaUJERVcsWUFBWTs7MkZBS1gsYUFBYTtrQkFSekIsU0FBUzsrQkFDRSxTQUFTLGNBQ1AsSUFBSSxXQUNQLENBQUMsWUFBWSxDQUFDLGlCQUdSLGlCQUFpQixDQUFDLElBQUk7d0RBTXZCLEdBQUc7c0JBQWhCLEtBQUs7dUJBQUMsS0FBSztnQkFFRyxJQUFJO3NCQUFsQixLQUFLO3VCQUFDLE1BQU07Z0JBQ0UsSUFBSTtzQkFBbEIsS0FBSzt1QkFBQyxNQUFNO2dCQUNHLEtBQUs7c0JBQXBCLEtBQUs7dUJBQUMsT0FBTztnQkFDSyxRQUFRO3NCQUExQixLQUFLO3VCQUFDLFVBQVU7Z0JBQ1IsT0FBTztzQkFBZixLQUFLO2dCQUNnQixXQUFXO3NCQUFoQyxLQUFLO3VCQUFDLGFBQWEiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIGluamVjdCwgSW5qZWN0LCBJbnB1dCwgU2ltcGxlQ2hhbmdlcywgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEljb25TZXJ2aWNlIH0gZnJvbSAnLi9pY29uLnNlcnZpY2UnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgSHR0cENsaWVudE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbi9odHRwJztcbmltcG9ydCB7IERvbVNhbml0aXplciB9IGZyb20gJ0Bhbmd1bGFyL3BsYXRmb3JtLWJyb3dzZXInO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc2EtaWNvbicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vaWNvbi5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9pY29uLmNvbXBvbmVudC5jc3MnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lXG59KVxuZXhwb3J0IGNsYXNzIEljb25Db21wb25lbnQge1xuICBpY29uU2VydmljZSA9IGluamVjdChJY29uU2VydmljZSk7XG4gIHNhbml0aXplciA9IGluamVjdChEb21TYW5pdGl6ZXIpO1xuXG4gIEBJbnB1dCgnaW1nJykgaW1nOiBzdHJpbmc7XG5cbiAgQElucHV0KCdpY29uJykgaWNvbjogc3RyaW5nO1xuICBASW5wdXQoJ3NpemUnKSBzaXplOiBzdHJpbmc7XG4gIEBJbnB1dCgnY29sb3InKSBjb2xvcjogc3RyaW5nO1xuICBASW5wdXQoJ2ljb25QYXRoJykgaWNvblBhdGg6IHN0cmluZyA9IFwiXCI7XG4gIEBJbnB1dCgpIGljb25Vcmw6IHN0cmluZyA9IFwiXCI7XG4gIEBJbnB1dCgnY3VzdG9tQ2xhc3MnKSBjdXN0b21DbGFzczogc3RyaW5nID0gXCJcIjtcblxuICBzdmdJY29uOiBhbnk7XG4gIGljb25TdHlsZXM6IGFueSA9IHtcbiAgICAvLyBmb250U2l6ZTogJzQ0cHgnLFxuICAgIC8vIGNvbG9yOiAncmVkJ1xuICB9O1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICB9XG4gIG5nT25Jbml0KCkge1xuICB9XG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcblxuXG4gICAgaWYgKGNoYW5nZXNbJ2ljb25QYXRoJ10gJiYgISF0aGlzLmljb25QYXRoLnRyaW0oKSkge1xuICAgICAgdGhpcy5pY29uU2VydmljZS5nZXRTdmcodGhpcy5pY29uIHx8IFwiXCIsIHRoaXMuaWNvblBhdGgpLnN1YnNjcmliZSgoc3ZnKSA9PiB7XG4gICAgICAgIHRoaXMuc3ZnSWNvbiA9IHRoaXMuc2FuaXRpemVyLmJ5cGFzc1NlY3VyaXR5VHJ1c3RIdG1sKHN2Zyk7XG4gICAgICB9KVxuICAgIH1cbiAgICBpZiAoY2hhbmdlc1snaWNvbiddIHx8IGNoYW5nZXNbJ2ljb25VcmwnXSkge1xuICAgICAgY29uc3QgaWNvbiA9IHRoaXMuaWNvbiB8fCB0aGlzLmljb25Vcmw7XG4gICAgICBpZiAoaWNvbikge1xuICAgICAgICB0aGlzLmljb25TZXJ2aWNlLmdldFN2ZyhpY29uKS5zdWJzY3JpYmUoKHN2ZykgPT4ge1xuICAgICAgICAgIHRoaXMuc3ZnSWNvbiA9IHRoaXMuc2FuaXRpemVyLmJ5cGFzc1NlY3VyaXR5VHJ1c3RIdG1sKHN2Zyk7XG4gICAgICAgIH0pXG4gICAgICB9IGVsc2Uge1xuICAgICAgICB0aGlzLnN2Z0ljb24gPSAnJztcbiAgICAgIH1cbiAgICB9XG4gICAgaWYgKGNoYW5nZXNbJ3NpemUnXSB8fCBjaGFuZ2VzWydjb2xvciddKSB7XG4gICAgICB0aGlzLmljb25TdHlsZXMuZm9udFNpemUgPSB0aGlzLnNpemUgKyAncHgnO1xuICAgICAgdGhpcy5pY29uU3R5bGVzLndpZHRoID0gdGhpcy5pY29uVXJsID8gXCJmaXQtY29udGVudFwiIDogJzFlbSc7XG4gICAgICB0aGlzLmljb25TdHlsZXMuaGVpZ2h0ID0gdGhpcy5pY29uVXJsID8gXCJmaXQtY29udGVudFwiIDogJzFlbSc7XG4gICAgICB0aGlzLmljb25TdHlsZXMuY29sb3IgPSB0aGlzLmNvbG9yO1xuICAgIH1cbiAgfVxuXG59IiwiQGlmKGltZyl7XG48aW1nIFtzcmNdPVwiaW1nXCIgW2hlaWdodF09XCJzaXplXCIgW3dpZHRoXT1cInNpemVcIj5cbn1AZWxzZXtcbjxzcGFuIGNsYXNzPVwic2EtaWNvblwiIFtuZ0NsYXNzXT1cIntcbiAgICAndXJsLWljb24nOiBpY29uVXJsXG4gIH1cIiBbbmdDbGFzc109XCJjdXN0b21DbGFzcyA/IFtjdXN0b21DbGFzc10gOiBbXVwiIFtpbm5lckhUTUxdPVwic3ZnSWNvblwiIFtuZ1N0eWxlXT1cImljb25TdHlsZXNcIj5cblxuPC9zcGFuPlxufSJdfQ==
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import { IconComponent } from '../icon/icon.component';
|
|
3
|
+
import { CommonModule } from '@angular/common';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@angular/common";
|
|
6
|
+
export class ListComponent {
|
|
7
|
+
constructor() {
|
|
8
|
+
this.listData = [];
|
|
9
|
+
this.featuresIcon = '';
|
|
10
|
+
}
|
|
11
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ListComponent, isStandalone: true, selector: "lib-list", inputs: { listData: "listData", featuresIcon: "featuresIcon" }, ngImport: i0, template: "<div class=\"feature-list-container\">\n <div class=\"feature-item\" *ngFor=\"let item of listData\">\n <div *ngIf=\"featuresIcon\" class=\"feature-icon\">\n <sa-icon [icon]=\"featuresIcon\" customClass=\"colored-icon\"></sa-icon>\n </div>\n <div>\n <span class=\"feature-text\">{{ item?.text }}</span>\n </div>\n </div>\n</div>", styles: [".feature-list-container{display:flex;flex-direction:column;align-items:flex-start;gap:var(--small-12px, 12px);align-self:stretch}.feature-item{display:flex;align-items:center;gap:var(--small-8px, 8px);align-self:stretch}.feature-list-container .feature-text{color:var(--text-mediumemphasis, #6D6979);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:400;line-height:var(--medium-20px);letter-spacing:.25px}.feature-icon sa-icon{display:flex}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["img", "icon", "size", "color", "iconPath", "iconUrl", "customClass"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
13
|
+
}
|
|
14
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ListComponent, decorators: [{
|
|
15
|
+
type: Component,
|
|
16
|
+
args: [{ selector: 'lib-list', standalone: true, imports: [IconComponent, CommonModule], template: "<div class=\"feature-list-container\">\n <div class=\"feature-item\" *ngFor=\"let item of listData\">\n <div *ngIf=\"featuresIcon\" class=\"feature-icon\">\n <sa-icon [icon]=\"featuresIcon\" customClass=\"colored-icon\"></sa-icon>\n </div>\n <div>\n <span class=\"feature-text\">{{ item?.text }}</span>\n </div>\n </div>\n</div>", styles: [".feature-list-container{display:flex;flex-direction:column;align-items:flex-start;gap:var(--small-12px, 12px);align-self:stretch}.feature-item{display:flex;align-items:center;gap:var(--small-8px, 8px);align-self:stretch}.feature-list-container .feature-text{color:var(--text-mediumemphasis, #6D6979);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:400;line-height:var(--medium-20px);letter-spacing:.25px}.feature-icon sa-icon{display:flex}\n"] }]
|
|
17
|
+
}], propDecorators: { listData: [{
|
|
18
|
+
type: Input
|
|
19
|
+
}], featuresIcon: [{
|
|
20
|
+
type: Input,
|
|
21
|
+
args: ['featuresIcon']
|
|
22
|
+
}] } });
|
|
23
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2xpc3QvbGlzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2xpc3QvbGlzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdkQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDOzs7QUFTL0MsTUFBTSxPQUFPLGFBQWE7SUFQMUI7UUFRVyxhQUFRLEdBQXNDLEVBQUUsQ0FBQztRQUNuQyxpQkFBWSxHQUFXLEVBQUUsQ0FBQztLQUNsRDs4R0FIWSxhQUFhO2tHQUFiLGFBQWEsb0lDWDFCLGtZQVNNLHFoQkRGTSxhQUFhLG1JQUFFLFlBQVk7OzJGQUkxQixhQUFhO2tCQVB6QixTQUFTOytCQUNFLFVBQVUsY0FDUixJQUFJLFdBQ1AsQ0FBQyxhQUFhLEVBQUUsWUFBWSxDQUFDOzhCQUs3QixRQUFRO3NCQUFoQixLQUFLO2dCQUNpQixZQUFZO3NCQUFsQyxLQUFLO3VCQUFDLGNBQWMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSAnLi4vaWNvbi9pY29uLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdsaWItbGlzdCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtJY29uQ29tcG9uZW50LCBDb21tb25Nb2R1bGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vbGlzdC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9saXN0LmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIExpc3RDb21wb25lbnQge1xuICBASW5wdXQoKSBsaXN0RGF0YTogeyBpY29uPzogc3RyaW5nOyB0ZXh0OiBzdHJpbmcgfVtdID0gW107XG4gIEBJbnB1dCgnZmVhdHVyZXNJY29uJykgZmVhdHVyZXNJY29uOiBzdHJpbmcgPSAnJztcbn1cbiIsIjxkaXYgY2xhc3M9XCJmZWF0dXJlLWxpc3QtY29udGFpbmVyXCI+XG4gICAgPGRpdiBjbGFzcz1cImZlYXR1cmUtaXRlbVwiICpuZ0Zvcj1cImxldCBpdGVtIG9mIGxpc3REYXRhXCI+XG4gICAgICAgIDxkaXYgKm5nSWY9XCJmZWF0dXJlc0ljb25cIiBjbGFzcz1cImZlYXR1cmUtaWNvblwiPlxuICAgICAgICAgICAgPHNhLWljb24gW2ljb25dPVwiZmVhdHVyZXNJY29uXCIgY3VzdG9tQ2xhc3M9XCJjb2xvcmVkLWljb25cIj48L3NhLWljb24+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2PlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJmZWF0dXJlLXRleHRcIj57eyBpdGVtPy50ZXh0IH19PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbjwvZGl2PiJdfQ==
|
|
@@ -1,11 +1,19 @@
|
|
|
1
|
-
import { Component } from '@angular/core';
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export class PageLayoutComponent {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.showRightContent = false;
|
|
6
|
+
this.showFooterContent = false;
|
|
7
|
+
}
|
|
4
8
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PageLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
9
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: PageLayoutComponent, isStandalone: true, selector: "sa-page-layout", inputs: { showRightContent: "showRightContent", showFooterContent: "showFooterContent" }, ngImport: i0, template: "<div class=\"layout-container\">\n <div class=\"layout-inner-container\">\n <div class=\"progress-bar-container\">\n <ng-content select=\"[progress-bar-content]\"></ng-content>\n </div>\n <div class=\"content-container\">\n <div class=\"left-section\">\n <div class=\"top-section\">\n <ng-content select=\"[top-content]\"></ng-content>\n </div>\n <div class=\"left-wrapper\">\n <ng-content select=\"[left-content]\"></ng-content>\n </div>\n @if (showFooterContent) {\n <div class=\"footer-section\">\n <ng-content select=\"[footer-content]\"></ng-content>\n </div>\n }\n </div>\n @if (showRightContent) {\n <div class=\"right-section\">\n <ng-content select=\"[right-content]\"></ng-content>\n </div>\n }\n </div>\n </div>\n</div>", styles: [".layout-container{padding:var(--medium-20px)}.layout-inner-container{display:flex;flex-direction:column;position:relative;overflow:hidden;height:calc(100vh - var(--large-40px, 40px));border-radius:var(--small-16px, 16px);border:1px solid var(--grey-100, #EAECF0);background:var(--structural-white);box-shadow:3px 4px 16px 4px #00000014}.progress-bar-container{border-radius:var(--small-16px, 16px);position:absolute;top:0;width:100%}.content-container{display:flex;flex:1;height:100%;-ms-overflow-style:none;scrollbar-width:none}.content-container::-webkit-scrollbar,.left-section::-webkit-scrollbar{display:none}.left-section{flex:1;padding:var(--medium-20px) var(--medium-20px) 0 var(--large-44px);display:flex;flex-direction:column}.right-section{background:var(--structural-primarytint, #FBFAFF);display:flex;align-items:center;width:28.9375rem;max-width:28.9375rem}.left-wrapper{height:calc(100% - 13.5rem);overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none;padding:1rem 0 2rem}.footer-section{display:flex;margin-top:auto;margin-bottom:var(--large-40px)}\n"] }); }
|
|
6
10
|
}
|
|
7
11
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PageLayoutComponent, decorators: [{
|
|
8
12
|
type: Component,
|
|
9
|
-
args: [{ selector: 'sa-page-layout', standalone: true, imports: [], template: "<div class=\"layout-container\">\n <div class=\"layout-inner-container\">\n <div class=\"
|
|
10
|
-
}]
|
|
11
|
-
|
|
13
|
+
args: [{ selector: 'sa-page-layout', standalone: true, imports: [], template: "<div class=\"layout-container\">\n <div class=\"layout-inner-container\">\n <div class=\"progress-bar-container\">\n <ng-content select=\"[progress-bar-content]\"></ng-content>\n </div>\n <div class=\"content-container\">\n <div class=\"left-section\">\n <div class=\"top-section\">\n <ng-content select=\"[top-content]\"></ng-content>\n </div>\n <div class=\"left-wrapper\">\n <ng-content select=\"[left-content]\"></ng-content>\n </div>\n @if (showFooterContent) {\n <div class=\"footer-section\">\n <ng-content select=\"[footer-content]\"></ng-content>\n </div>\n }\n </div>\n @if (showRightContent) {\n <div class=\"right-section\">\n <ng-content select=\"[right-content]\"></ng-content>\n </div>\n }\n </div>\n </div>\n</div>", styles: [".layout-container{padding:var(--medium-20px)}.layout-inner-container{display:flex;flex-direction:column;position:relative;overflow:hidden;height:calc(100vh - var(--large-40px, 40px));border-radius:var(--small-16px, 16px);border:1px solid var(--grey-100, #EAECF0);background:var(--structural-white);box-shadow:3px 4px 16px 4px #00000014}.progress-bar-container{border-radius:var(--small-16px, 16px);position:absolute;top:0;width:100%}.content-container{display:flex;flex:1;height:100%;-ms-overflow-style:none;scrollbar-width:none}.content-container::-webkit-scrollbar,.left-section::-webkit-scrollbar{display:none}.left-section{flex:1;padding:var(--medium-20px) var(--medium-20px) 0 var(--large-44px);display:flex;flex-direction:column}.right-section{background:var(--structural-primarytint, #FBFAFF);display:flex;align-items:center;width:28.9375rem;max-width:28.9375rem}.left-wrapper{height:calc(100% - 13.5rem);overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none;padding:1rem 0 2rem}.footer-section{display:flex;margin-top:auto;margin-bottom:var(--large-40px)}\n"] }]
|
|
14
|
+
}], propDecorators: { showRightContent: [{
|
|
15
|
+
type: Input
|
|
16
|
+
}], showFooterContent: [{
|
|
17
|
+
type: Input
|
|
18
|
+
}] } });
|
|
19
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1sYXlvdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9wYWdlLWxheW91dC9wYWdlLWxheW91dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL3BhZ2UtbGF5b3V0L3BhZ2UtbGF5b3V0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVNqRCxNQUFNLE9BQU8sbUJBQW1CO0lBUGhDO1FBUVcscUJBQWdCLEdBQVksS0FBSyxDQUFDO1FBQ2xDLHNCQUFpQixHQUFZLEtBQUssQ0FBQztLQUM3Qzs4R0FIWSxtQkFBbUI7a0dBQW5CLG1CQUFtQixvS0NUaEMsMmdDQTBCTTs7MkZEakJPLG1CQUFtQjtrQkFQL0IsU0FBUzsrQkFDRSxnQkFBZ0IsY0FDZCxJQUFJLFdBQ1AsRUFBRTs4QkFLRixnQkFBZ0I7c0JBQXhCLEtBQUs7Z0JBQ0csaUJBQWlCO3NCQUF6QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzYS1wYWdlLWxheW91dCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtdLFxuICB0ZW1wbGF0ZVVybDogJy4vcGFnZS1sYXlvdXQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vcGFnZS1sYXlvdXQuY29tcG9uZW50LmNzcydcbn0pXG5leHBvcnQgY2xhc3MgUGFnZUxheW91dENvbXBvbmVudCB7XG4gIEBJbnB1dCgpIHNob3dSaWdodENvbnRlbnQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgc2hvd0Zvb3RlckNvbnRlbnQ6IGJvb2xlYW4gPSBmYWxzZTtcbn1cbiIsIjxkaXYgY2xhc3M9XCJsYXlvdXQtY29udGFpbmVyXCI+XG4gICAgPGRpdiBjbGFzcz1cImxheW91dC1pbm5lci1jb250YWluZXJcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInByb2dyZXNzLWJhci1jb250YWluZXJcIj5cbiAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltwcm9ncmVzcy1iYXItY29udGVudF1cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY29udGVudC1jb250YWluZXJcIj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJsZWZ0LXNlY3Rpb25cIj5cbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwidG9wLXNlY3Rpb25cIj5cbiAgICAgICAgICAgICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW3RvcC1jb250ZW50XVwiPjwvbmctY29udGVudD5cbiAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwibGVmdC13cmFwcGVyXCI+XG4gICAgICAgICAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltsZWZ0LWNvbnRlbnRdXCI+PC9uZy1jb250ZW50PlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIEBpZiAoc2hvd0Zvb3RlckNvbnRlbnQpIHtcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiZm9vdGVyLXNlY3Rpb25cIj5cbiAgICAgICAgICAgICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2Zvb3Rlci1jb250ZW50XVwiPjwvbmctY29udGVudD5cbiAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIEBpZiAoc2hvd1JpZ2h0Q29udGVudCkge1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInJpZ2h0LXNlY3Rpb25cIj5cbiAgICAgICAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbcmlnaHQtY29udGVudF1cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj4iXX0=
|