valtech-components 2.0.963 → 2.0.965
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/components/molecules/content-card/content-card.component.mjs +86 -0
- package/esm2022/lib/components/molecules/content-card/types.mjs +11 -0
- package/esm2022/lib/components/molecules/info-card/info-card.component.mjs +126 -0
- package/esm2022/lib/components/molecules/info-card/types.mjs +11 -0
- package/esm2022/lib/components/molecules/metric-card/metric-card.component.mjs +146 -0
- package/esm2022/lib/components/molecules/metric-card/types.mjs +10 -0
- package/esm2022/lib/components/molecules/pill/pill.component.mjs +100 -105
- package/esm2022/lib/components/molecules/pill/types.mjs +1 -1
- package/esm2022/lib/components/organisms/article-strip/article-strip.component.mjs +127 -0
- package/esm2022/lib/components/organisms/article-strip/types.mjs +8 -0
- package/esm2022/lib/components/organisms/auth-cta/auth-cta.component.mjs +180 -0
- package/esm2022/lib/components/organisms/auth-cta/types.mjs +9 -0
- package/esm2022/lib/services/requests/request.service.mjs +11 -4
- package/esm2022/lib/shared/utils/validators.mjs +7 -3
- package/esm2022/lib/version.mjs +2 -2
- package/esm2022/public-api.mjs +12 -1
- package/fesm2022/valtech-components.mjs +817 -126
- package/fesm2022/valtech-components.mjs.map +1 -1
- package/lib/components/atoms/rights-footer/rights-footer.component.d.ts +1 -1
- package/lib/components/atoms/text/text.component.d.ts +1 -1
- package/lib/components/atoms/user-avatar/user-avatar.component.d.ts +1 -1
- package/lib/components/molecules/article-card/article-card.component.d.ts +1 -1
- package/lib/components/molecules/content-card/content-card.component.d.ts +26 -0
- package/lib/components/molecules/content-card/types.d.ts +30 -0
- package/lib/components/molecules/features-list/features-list.component.d.ts +1 -1
- package/lib/components/molecules/info-card/info-card.component.d.ts +37 -0
- package/lib/components/molecules/info-card/types.d.ts +44 -0
- package/lib/components/molecules/metric-card/metric-card.component.d.ts +34 -0
- package/lib/components/molecules/metric-card/types.d.ts +46 -0
- package/lib/components/molecules/pill/pill.component.d.ts +10 -26
- package/lib/components/molecules/pill/types.d.ts +76 -35
- package/lib/components/organisms/article/article.component.d.ts +4 -4
- package/lib/components/organisms/article-strip/article-strip.component.d.ts +38 -0
- package/lib/components/organisms/article-strip/types.d.ts +29 -0
- package/lib/components/organisms/auth-cta/auth-cta.component.d.ts +44 -0
- package/lib/components/organisms/auth-cta/types.d.ts +42 -0
- package/lib/shared/utils/validators.d.ts +3 -2
- package/lib/version.d.ts +1 -1
- package/package.json +1 -1
- package/public-api.d.ts +10 -0
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { Component, computed, input } from '@angular/core';
|
|
3
|
+
import { CONTENT_CARD_DEFAULTS } from './types';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
const IONIC_COLORS = ['primary', 'secondary', 'tertiary', 'success', 'warning', 'danger', 'light', 'medium', 'dark'];
|
|
6
|
+
function resolveColor(value) {
|
|
7
|
+
if (!value)
|
|
8
|
+
return undefined;
|
|
9
|
+
return IONIC_COLORS.includes(value) ? `var(--ion-color-${value})` : value;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* val-content-card
|
|
13
|
+
*
|
|
14
|
+
* Generic container card with configurable padding, border radius, background
|
|
15
|
+
* color and shadow. Accepts arbitrary content via ng-content. Use it to wrap
|
|
16
|
+
* val-article, stats, or any other content that needs a card shell.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ```html
|
|
20
|
+
* <val-content-card [props]="{ title: 'Summary', shadowed: true }">
|
|
21
|
+
* <p>Any inner content here.</p>
|
|
22
|
+
* </val-content-card>
|
|
23
|
+
* ```
|
|
24
|
+
*/
|
|
25
|
+
export class ContentCardComponent {
|
|
26
|
+
constructor() {
|
|
27
|
+
/** Component configuration */
|
|
28
|
+
this.props = input({});
|
|
29
|
+
/** Merged configuration with defaults */
|
|
30
|
+
this.config = computed(() => ({
|
|
31
|
+
...CONTENT_CARD_DEFAULTS,
|
|
32
|
+
...this.props(),
|
|
33
|
+
}));
|
|
34
|
+
this.resolvedBg = computed(() => resolveColor(this.config().backgroundColor));
|
|
35
|
+
this.resolvedColor = computed(() => resolveColor(this.config().color));
|
|
36
|
+
}
|
|
37
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ContentCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ContentCardComponent, isStandalone: true, selector: "val-content-card", inputs: { props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
39
|
+
<div
|
|
40
|
+
class="content-card"
|
|
41
|
+
[class.content-card--bordered]="config().bordered"
|
|
42
|
+
[class.content-card--shadowed]="config().shadowed"
|
|
43
|
+
[class.content-card--center]="config().align === 'center'"
|
|
44
|
+
[style.padding]="config().padding"
|
|
45
|
+
[style.border-radius]="config().borderRadius"
|
|
46
|
+
[style.background-color]="resolvedBg()"
|
|
47
|
+
[style.color]="resolvedColor()"
|
|
48
|
+
>
|
|
49
|
+
@if (config().title) {
|
|
50
|
+
<h3 class="content-card__title">{{ config().title }}</h3>
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
@if (config().description) {
|
|
54
|
+
<p class="content-card__description">{{ config().description }}</p>
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
<ng-content></ng-content>
|
|
58
|
+
</div>
|
|
59
|
+
`, isInline: true, styles: [":host{display:block}.content-card{background:var(--ion-card-background, var(--ion-background-color))}.content-card--bordered{border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .1))}.content-card--shadowed{box-shadow:0 4px 16px #00000014}.content-card--center{text-align:center}.content-card__title{margin:0 0 .5rem;font-size:1.1rem;font-weight:700;color:inherit;line-height:1.3}.content-card__description{margin:0 0 1rem;font-size:.875rem;color:var(--ion-color-medium-shade);line-height:1.5}:host-context(body.dark) .content-card--bordered,:host-context(html.ion-palette-dark) .content-card--bordered,:host-context([data-theme=dark]) .content-card--bordered{border-color:#ffffff1f}:host-context(body.dark) .content-card--shadowed,:host-context(html.ion-palette-dark) .content-card--shadowed,:host-context([data-theme=dark]) .content-card--shadowed{box-shadow:0 4px 16px #0000004d}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
60
|
+
}
|
|
61
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ContentCardComponent, decorators: [{
|
|
62
|
+
type: Component,
|
|
63
|
+
args: [{ selector: 'val-content-card', standalone: true, imports: [CommonModule], template: `
|
|
64
|
+
<div
|
|
65
|
+
class="content-card"
|
|
66
|
+
[class.content-card--bordered]="config().bordered"
|
|
67
|
+
[class.content-card--shadowed]="config().shadowed"
|
|
68
|
+
[class.content-card--center]="config().align === 'center'"
|
|
69
|
+
[style.padding]="config().padding"
|
|
70
|
+
[style.border-radius]="config().borderRadius"
|
|
71
|
+
[style.background-color]="resolvedBg()"
|
|
72
|
+
[style.color]="resolvedColor()"
|
|
73
|
+
>
|
|
74
|
+
@if (config().title) {
|
|
75
|
+
<h3 class="content-card__title">{{ config().title }}</h3>
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
@if (config().description) {
|
|
79
|
+
<p class="content-card__description">{{ config().description }}</p>
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
<ng-content></ng-content>
|
|
83
|
+
</div>
|
|
84
|
+
`, styles: [":host{display:block}.content-card{background:var(--ion-card-background, var(--ion-background-color))}.content-card--bordered{border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .1))}.content-card--shadowed{box-shadow:0 4px 16px #00000014}.content-card--center{text-align:center}.content-card__title{margin:0 0 .5rem;font-size:1.1rem;font-weight:700;color:inherit;line-height:1.3}.content-card__description{margin:0 0 1rem;font-size:.875rem;color:var(--ion-color-medium-shade);line-height:1.5}:host-context(body.dark) .content-card--bordered,:host-context(html.ion-palette-dark) .content-card--bordered,:host-context([data-theme=dark]) .content-card--bordered{border-color:#ffffff1f}:host-context(body.dark) .content-card--shadowed,:host-context(html.ion-palette-dark) .content-card--shadowed,:host-context([data-theme=dark]) .content-card--shadowed{box-shadow:0 4px 16px #0000004d}\n"] }]
|
|
85
|
+
}] });
|
|
86
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGVudC1jYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9tb2xlY3VsZXMvY29udGVudC1jYXJkL2NvbnRlbnQtY2FyZC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzRCxPQUFPLEVBQXVCLHFCQUFxQixFQUFFLE1BQU0sU0FBUyxDQUFDOztBQUVyRSxNQUFNLFlBQVksR0FBRyxDQUFDLFNBQVMsRUFBRSxXQUFXLEVBQUUsVUFBVSxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxDQUFDLENBQUM7QUFFckgsU0FBUyxZQUFZLENBQUMsS0FBeUI7SUFDN0MsSUFBSSxDQUFDLEtBQUs7UUFBRSxPQUFPLFNBQVMsQ0FBQztJQUM3QixPQUFPLFlBQVksQ0FBQyxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLG1CQUFtQixLQUFLLEdBQUcsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO0FBQzVFLENBQUM7QUFFRDs7Ozs7Ozs7Ozs7OztHQWFHO0FBNkJILE1BQU0sT0FBTyxvQkFBb0I7SUE1QmpDO1FBNkJFLDhCQUE4QjtRQUNyQixVQUFLLEdBQUcsS0FBSyxDQUErQixFQUFrQyxDQUFDLENBQUM7UUFFekYseUNBQXlDO1FBQ3pDLFdBQU0sR0FBRyxRQUFRLENBQ2YsR0FBRyxFQUFFLENBQ0gsQ0FBQztZQUNDLEdBQUcscUJBQXFCO1lBQ3hCLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRTtTQUNoQixDQUF1RCxDQUMzRCxDQUFDO1FBRUYsZUFBVSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUM7UUFDekUsa0JBQWEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO0tBQ25FOytHQWZZLG9CQUFvQjttR0FBcEIsb0JBQW9CLGdOQXhCckI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXFCVCxvOEJBdEJTLFlBQVk7OzRGQXlCWCxvQkFBb0I7a0JBNUJoQyxTQUFTOytCQUNFLGtCQUFrQixjQUNoQixJQUFJLFdBQ1AsQ0FBQyxZQUFZLENBQUMsWUFDYjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBcUJUIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgY29tcHV0ZWQsIGlucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb250ZW50Q2FyZE1ldGFkYXRhLCBDT05URU5UX0NBUkRfREVGQVVMVFMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgSU9OSUNfQ09MT1JTID0gWydwcmltYXJ5JywgJ3NlY29uZGFyeScsICd0ZXJ0aWFyeScsICdzdWNjZXNzJywgJ3dhcm5pbmcnLCAnZGFuZ2VyJywgJ2xpZ2h0JywgJ21lZGl1bScsICdkYXJrJ107XG5cbmZ1bmN0aW9uIHJlc29sdmVDb2xvcih2YWx1ZTogc3RyaW5nIHwgdW5kZWZpbmVkKTogc3RyaW5nIHwgdW5kZWZpbmVkIHtcbiAgaWYgKCF2YWx1ZSkgcmV0dXJuIHVuZGVmaW5lZDtcbiAgcmV0dXJuIElPTklDX0NPTE9SUy5pbmNsdWRlcyh2YWx1ZSkgPyBgdmFyKC0taW9uLWNvbG9yLSR7dmFsdWV9KWAgOiB2YWx1ZTtcbn1cblxuLyoqXG4gKiB2YWwtY29udGVudC1jYXJkXG4gKlxuICogR2VuZXJpYyBjb250YWluZXIgY2FyZCB3aXRoIGNvbmZpZ3VyYWJsZSBwYWRkaW5nLCBib3JkZXIgcmFkaXVzLCBiYWNrZ3JvdW5kXG4gKiBjb2xvciBhbmQgc2hhZG93LiBBY2NlcHRzIGFyYml0cmFyeSBjb250ZW50IHZpYSBuZy1jb250ZW50LiBVc2UgaXQgdG8gd3JhcFxuICogdmFsLWFydGljbGUsIHN0YXRzLCBvciBhbnkgb3RoZXIgY29udGVudCB0aGF0IG5lZWRzIGEgY2FyZCBzaGVsbC5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgaHRtbFxuICogPHZhbC1jb250ZW50LWNhcmQgW3Byb3BzXT1cInsgdGl0bGU6ICdTdW1tYXJ5Jywgc2hhZG93ZWQ6IHRydWUgfVwiPlxuICogICA8cD5BbnkgaW5uZXIgY29udGVudCBoZXJlLjwvcD5cbiAqIDwvdmFsLWNvbnRlbnQtY2FyZD5cbiAqIGBgYFxuICovXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd2YWwtY29udGVudC1jYXJkJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdlxuICAgICAgY2xhc3M9XCJjb250ZW50LWNhcmRcIlxuICAgICAgW2NsYXNzLmNvbnRlbnQtY2FyZC0tYm9yZGVyZWRdPVwiY29uZmlnKCkuYm9yZGVyZWRcIlxuICAgICAgW2NsYXNzLmNvbnRlbnQtY2FyZC0tc2hhZG93ZWRdPVwiY29uZmlnKCkuc2hhZG93ZWRcIlxuICAgICAgW2NsYXNzLmNvbnRlbnQtY2FyZC0tY2VudGVyXT1cImNvbmZpZygpLmFsaWduID09PSAnY2VudGVyJ1wiXG4gICAgICBbc3R5bGUucGFkZGluZ109XCJjb25maWcoKS5wYWRkaW5nXCJcbiAgICAgIFtzdHlsZS5ib3JkZXItcmFkaXVzXT1cImNvbmZpZygpLmJvcmRlclJhZGl1c1wiXG4gICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCJyZXNvbHZlZEJnKClcIlxuICAgICAgW3N0eWxlLmNvbG9yXT1cInJlc29sdmVkQ29sb3IoKVwiXG4gICAgPlxuICAgICAgQGlmIChjb25maWcoKS50aXRsZSkge1xuICAgICAgICA8aDMgY2xhc3M9XCJjb250ZW50LWNhcmRfX3RpdGxlXCI+e3sgY29uZmlnKCkudGl0bGUgfX08L2gzPlxuICAgICAgfVxuXG4gICAgICBAaWYgKGNvbmZpZygpLmRlc2NyaXB0aW9uKSB7XG4gICAgICAgIDxwIGNsYXNzPVwiY29udGVudC1jYXJkX19kZXNjcmlwdGlvblwiPnt7IGNvbmZpZygpLmRlc2NyaXB0aW9uIH19PC9wPlxuICAgICAgfVxuXG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG4gIGAsXG4gIHN0eWxlVXJsczogWycuL2NvbnRlbnQtY2FyZC5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBDb250ZW50Q2FyZENvbXBvbmVudCB7XG4gIC8qKiBDb21wb25lbnQgY29uZmlndXJhdGlvbiAqL1xuICByZWFkb25seSBwcm9wcyA9IGlucHV0PFBhcnRpYWw8Q29udGVudENhcmRNZXRhZGF0YT4+KHt9IGFzIFBhcnRpYWw8Q29udGVudENhcmRNZXRhZGF0YT4pO1xuXG4gIC8qKiBNZXJnZWQgY29uZmlndXJhdGlvbiB3aXRoIGRlZmF1bHRzICovXG4gIGNvbmZpZyA9IGNvbXB1dGVkKFxuICAgICgpID0+XG4gICAgICAoe1xuICAgICAgICAuLi5DT05URU5UX0NBUkRfREVGQVVMVFMsXG4gICAgICAgIC4uLnRoaXMucHJvcHMoKSxcbiAgICAgIH0pIGFzIENvbnRlbnRDYXJkTWV0YWRhdGEgJiB0eXBlb2YgQ09OVEVOVF9DQVJEX0RFRkFVTFRTXG4gICk7XG5cbiAgcmVzb2x2ZWRCZyA9IGNvbXB1dGVkKCgpID0+IHJlc29sdmVDb2xvcih0aGlzLmNvbmZpZygpLmJhY2tncm91bmRDb2xvcikpO1xuICByZXNvbHZlZENvbG9yID0gY29tcHV0ZWQoKCkgPT4gcmVzb2x2ZUNvbG9yKHRoaXMuY29uZmlnKCkuY29sb3IpKTtcbn1cbiJdfQ==
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Default values for ContentCardMetadata.
|
|
3
|
+
*/
|
|
4
|
+
export const CONTENT_CARD_DEFAULTS = {
|
|
5
|
+
padding: '1.5rem',
|
|
6
|
+
borderRadius: '20px',
|
|
7
|
+
bordered: false,
|
|
8
|
+
shadowed: true,
|
|
9
|
+
align: 'start',
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvbW9sZWN1bGVzL2NvbnRlbnQtY2FyZC90eXBlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQkE7O0dBRUc7QUFDSCxNQUFNLENBQUMsTUFBTSxxQkFBcUIsR0FFOUI7SUFDRixPQUFPLEVBQUUsUUFBUTtJQUNqQixZQUFZLEVBQUUsTUFBTTtJQUNwQixRQUFRLEVBQUUsS0FBSztJQUNmLFFBQVEsRUFBRSxJQUFJO0lBQ2QsS0FBSyxFQUFFLE9BQU87Q0FDZixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBNZXRhZGF0YSBmb3IgdmFsLWNvbnRlbnQtY2FyZC5cbiAqXG4gKiBHZW5lcmljIGNvbnRhaW5lciBjYXJkIHdpdGggY29uZmlndXJhYmxlIHBhZGRpbmcsIGJvcmRlciByYWRpdXMsIGJhY2tncm91bmRcbiAqIGNvbG9yIGFuZCBzaGFkb3cuIFN1cHBvcnRzIG5nLWNvbnRlbnQgZm9yIGFyYml0cmFyeSBpbm5lciBjb250ZW50LlxuICovXG5leHBvcnQgaW50ZXJmYWNlIENvbnRlbnRDYXJkTWV0YWRhdGEge1xuICAvKiogT3B0aW9uYWwgY2FyZCB0aXRsZSByZW5kZXJlZCBhYm92ZSB0aGUgY29udGVudCAqL1xuICB0aXRsZT86IHN0cmluZztcbiAgLyoqIE9wdGlvbmFsIGRlc2NyaXB0aW9uIHJlbmRlcmVkIGJlbG93IHRoZSB0aXRsZSAqL1xuICBkZXNjcmlwdGlvbj86IHN0cmluZztcbiAgLyoqIEJhY2tncm91bmQgY29sb3Ig4oCUIElvbmljIGNvbG9yIG5hbWUgKHByaW1hcnnigKZkYXJrKSBvciBhbnkgQ1NTIGNvbG9yICovXG4gIGJhY2tncm91bmRDb2xvcj86IHN0cmluZztcbiAgLyoqIFRleHQgY29sb3Ig4oCUIElvbmljIGNvbG9yIG5hbWUgb3IgYW55IENTUyBjb2xvciAqL1xuICBjb2xvcj86IHN0cmluZztcbiAgLyoqIENhcmQgaW5uZXIgcGFkZGluZy4gRGVmYXVsdDogJzEuNXJlbScgKi9cbiAgcGFkZGluZz86IHN0cmluZztcbiAgLyoqIENhcmQgYm9yZGVyIHJhZGl1cy4gRGVmYXVsdDogJzIwcHgnICovXG4gIGJvcmRlclJhZGl1cz86IHN0cmluZztcbiAgLyoqIFNob3cgYm9yZGVyLiBEZWZhdWx0OiBmYWxzZSAqL1xuICBib3JkZXJlZD86IGJvb2xlYW47XG4gIC8qKiBTaG93IGJveCBzaGFkb3cuIERlZmF1bHQ6IHRydWUgKi9cbiAgc2hhZG93ZWQ/OiBib29sZWFuO1xuICAvKiogVGV4dCBhbGlnbm1lbnQuIERlZmF1bHQ6ICdzdGFydCcgKi9cbiAgYWxpZ24/OiAnc3RhcnQnIHwgJ2NlbnRlcic7XG59XG5cbi8qKlxuICogRGVmYXVsdCB2YWx1ZXMgZm9yIENvbnRlbnRDYXJkTWV0YWRhdGEuXG4gKi9cbmV4cG9ydCBjb25zdCBDT05URU5UX0NBUkRfREVGQVVMVFM6IFJlcXVpcmVkPFxuICBQaWNrPENvbnRlbnRDYXJkTWV0YWRhdGEsICdwYWRkaW5nJyB8ICdib3JkZXJSYWRpdXMnIHwgJ2JvcmRlcmVkJyB8ICdzaGFkb3dlZCcgfCAnYWxpZ24nPlxuPiA9IHtcbiAgcGFkZGluZzogJzEuNXJlbScsXG4gIGJvcmRlclJhZGl1czogJzIwcHgnLFxuICBib3JkZXJlZDogZmFsc2UsXG4gIHNoYWRvd2VkOiB0cnVlLFxuICBhbGlnbjogJ3N0YXJ0Jyxcbn07XG4iXX0=
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { Component, computed, input } from '@angular/core';
|
|
3
|
+
import { IonIcon } from '@ionic/angular/standalone';
|
|
4
|
+
import { INFO_CARD_DEFAULTS } from './types';
|
|
5
|
+
import * as i0 from "@angular/core";
|
|
6
|
+
const IONIC_COLORS = ['primary', 'secondary', 'tertiary', 'success', 'warning', 'danger', 'light', 'medium', 'dark'];
|
|
7
|
+
/**
|
|
8
|
+
* val-info-card
|
|
9
|
+
*
|
|
10
|
+
* Card with icon + overtitle + title + subtitle on the left side, and a list
|
|
11
|
+
* of key-value pairs (label: value) on the right side. Inspired by npm's
|
|
12
|
+
* "Provenance" / metadata panel style.
|
|
13
|
+
*
|
|
14
|
+
* Two-column layout on desktop, stacked single-column on mobile.
|
|
15
|
+
*
|
|
16
|
+
* Presentational — pass already-resolved strings.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ```html
|
|
20
|
+
* <val-info-card
|
|
21
|
+
* [props]="{
|
|
22
|
+
* icon: 'cube-outline',
|
|
23
|
+
* title: 'valtech-components',
|
|
24
|
+
* subtitle: 'v2.0.962',
|
|
25
|
+
* keyValues: [
|
|
26
|
+
* { label: 'License', value: 'MIT' },
|
|
27
|
+
* { label: 'Downloads', value: '1.2M' }
|
|
28
|
+
* ]
|
|
29
|
+
* }"
|
|
30
|
+
* />
|
|
31
|
+
* ```
|
|
32
|
+
*/
|
|
33
|
+
export class InfoCardComponent {
|
|
34
|
+
constructor() {
|
|
35
|
+
/** Component configuration */
|
|
36
|
+
this.props = input({});
|
|
37
|
+
/** Merged configuration with defaults */
|
|
38
|
+
this.config = computed(() => ({
|
|
39
|
+
...INFO_CARD_DEFAULTS,
|
|
40
|
+
...this.props(),
|
|
41
|
+
}));
|
|
42
|
+
}
|
|
43
|
+
getIconColor() {
|
|
44
|
+
const color = this.config().iconColor;
|
|
45
|
+
if (!color)
|
|
46
|
+
return `var(--ion-color-primary)`;
|
|
47
|
+
return IONIC_COLORS.includes(color) ? `var(--ion-color-${color})` : color;
|
|
48
|
+
}
|
|
49
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InfoCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
50
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: InfoCardComponent, isStandalone: true, selector: "val-info-card", inputs: { props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
51
|
+
<div
|
|
52
|
+
class="info-card"
|
|
53
|
+
[class.info-card--bordered]="config().bordered"
|
|
54
|
+
[class.info-card--shadowed]="config().shadowed"
|
|
55
|
+
[style.padding]="config().padding"
|
|
56
|
+
[style.border-radius]="config().borderRadius"
|
|
57
|
+
>
|
|
58
|
+
<div class="info-card__left">
|
|
59
|
+
@if (config().icon) {
|
|
60
|
+
<ion-icon class="info-card__icon" [name]="config().icon" [style.color]="getIconColor()"></ion-icon>
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
@if (config().overtitle) {
|
|
64
|
+
<span class="info-card__overtitle">{{ config().overtitle }}</span>
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
<h3 class="info-card__title">{{ config().title }}</h3>
|
|
68
|
+
|
|
69
|
+
@if (config().subtitle) {
|
|
70
|
+
<p class="info-card__subtitle">{{ config().subtitle }}</p>
|
|
71
|
+
}
|
|
72
|
+
</div>
|
|
73
|
+
|
|
74
|
+
@if (config().keyValues?.length) {
|
|
75
|
+
<div class="info-card__right">
|
|
76
|
+
@for (kv of config().keyValues; track $index) {
|
|
77
|
+
<div class="info-card__kv">
|
|
78
|
+
<span class="info-card__kv-label">{{ kv.label }}</span>
|
|
79
|
+
<span class="info-card__kv-value">{{ kv.value }}</span>
|
|
80
|
+
</div>
|
|
81
|
+
}
|
|
82
|
+
</div>
|
|
83
|
+
}
|
|
84
|
+
</div>
|
|
85
|
+
`, isInline: true, styles: [":host{display:block}.info-card{display:flex;flex-direction:row;gap:2rem;background:var(--ion-card-background, var(--ion-background-color))}.info-card--bordered{border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .1))}.info-card--shadowed{box-shadow:0 2px 8px #00000014}.info-card__left{display:flex;flex-direction:column;gap:.35rem;flex:1 1 0;min-width:0}.info-card__icon{font-size:2rem;margin-bottom:.25rem}.info-card__overtitle{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--ion-color-medium)}.info-card__title{margin:0;font-size:1.25rem;font-weight:700;color:var(--ion-text-color);line-height:1.3}.info-card__subtitle{margin:0;font-size:.875rem;color:var(--ion-color-medium-shade)}.info-card__right{display:flex;flex-direction:column;gap:.6rem;flex:0 0 auto;min-width:160px;max-width:260px}.info-card__kv{display:flex;flex-direction:column;gap:.1rem}.info-card__kv-label{font-size:.75rem;color:var(--ion-color-medium)}.info-card__kv-value{font-size:.9rem;font-weight:600;color:var(--ion-text-color);word-break:break-word}@media (max-width: 600px){.info-card{flex-direction:column;gap:1.25rem}.info-card__right{max-width:100%;flex-direction:row;flex-wrap:wrap;gap:.75rem 1.5rem}.info-card__kv{flex:0 0 auto}}:host-context(body.dark) .info-card--bordered,:host-context(html.ion-palette-dark) .info-card--bordered,:host-context([data-theme=dark]) .info-card--bordered{border-color:#ffffff1f}:host-context(body.dark) .info-card--shadowed,:host-context(html.ion-palette-dark) .info-card--shadowed,:host-context([data-theme=dark]) .info-card--shadowed{box-shadow:0 2px 8px #0000004d}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }] }); }
|
|
86
|
+
}
|
|
87
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InfoCardComponent, decorators: [{
|
|
88
|
+
type: Component,
|
|
89
|
+
args: [{ selector: 'val-info-card', standalone: true, imports: [CommonModule, IonIcon], template: `
|
|
90
|
+
<div
|
|
91
|
+
class="info-card"
|
|
92
|
+
[class.info-card--bordered]="config().bordered"
|
|
93
|
+
[class.info-card--shadowed]="config().shadowed"
|
|
94
|
+
[style.padding]="config().padding"
|
|
95
|
+
[style.border-radius]="config().borderRadius"
|
|
96
|
+
>
|
|
97
|
+
<div class="info-card__left">
|
|
98
|
+
@if (config().icon) {
|
|
99
|
+
<ion-icon class="info-card__icon" [name]="config().icon" [style.color]="getIconColor()"></ion-icon>
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
@if (config().overtitle) {
|
|
103
|
+
<span class="info-card__overtitle">{{ config().overtitle }}</span>
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
<h3 class="info-card__title">{{ config().title }}</h3>
|
|
107
|
+
|
|
108
|
+
@if (config().subtitle) {
|
|
109
|
+
<p class="info-card__subtitle">{{ config().subtitle }}</p>
|
|
110
|
+
}
|
|
111
|
+
</div>
|
|
112
|
+
|
|
113
|
+
@if (config().keyValues?.length) {
|
|
114
|
+
<div class="info-card__right">
|
|
115
|
+
@for (kv of config().keyValues; track $index) {
|
|
116
|
+
<div class="info-card__kv">
|
|
117
|
+
<span class="info-card__kv-label">{{ kv.label }}</span>
|
|
118
|
+
<span class="info-card__kv-value">{{ kv.value }}</span>
|
|
119
|
+
</div>
|
|
120
|
+
}
|
|
121
|
+
</div>
|
|
122
|
+
}
|
|
123
|
+
</div>
|
|
124
|
+
`, styles: [":host{display:block}.info-card{display:flex;flex-direction:row;gap:2rem;background:var(--ion-card-background, var(--ion-background-color))}.info-card--bordered{border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .1))}.info-card--shadowed{box-shadow:0 2px 8px #00000014}.info-card__left{display:flex;flex-direction:column;gap:.35rem;flex:1 1 0;min-width:0}.info-card__icon{font-size:2rem;margin-bottom:.25rem}.info-card__overtitle{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--ion-color-medium)}.info-card__title{margin:0;font-size:1.25rem;font-weight:700;color:var(--ion-text-color);line-height:1.3}.info-card__subtitle{margin:0;font-size:.875rem;color:var(--ion-color-medium-shade)}.info-card__right{display:flex;flex-direction:column;gap:.6rem;flex:0 0 auto;min-width:160px;max-width:260px}.info-card__kv{display:flex;flex-direction:column;gap:.1rem}.info-card__kv-label{font-size:.75rem;color:var(--ion-color-medium)}.info-card__kv-value{font-size:.9rem;font-weight:600;color:var(--ion-text-color);word-break:break-word}@media (max-width: 600px){.info-card{flex-direction:column;gap:1.25rem}.info-card__right{max-width:100%;flex-direction:row;flex-wrap:wrap;gap:.75rem 1.5rem}.info-card__kv{flex:0 0 auto}}:host-context(body.dark) .info-card--bordered,:host-context(html.ion-palette-dark) .info-card--bordered,:host-context([data-theme=dark]) .info-card--bordered{border-color:#ffffff1f}:host-context(body.dark) .info-card--shadowed,:host-context(html.ion-palette-dark) .info-card--shadowed,:host-context([data-theme=dark]) .info-card--shadowed{box-shadow:0 2px 8px #0000004d}\n"] }]
|
|
125
|
+
}] });
|
|
126
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5mby1jYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9tb2xlY3VsZXMvaW5mby1jYXJkL2luZm8tY2FyZC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzRCxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDcEQsT0FBTyxFQUFvQixrQkFBa0IsRUFBRSxNQUFNLFNBQVMsQ0FBQzs7QUFFL0QsTUFBTSxZQUFZLEdBQUcsQ0FBQyxTQUFTLEVBQUUsV0FBVyxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sQ0FBQyxDQUFDO0FBRXJIOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBeUJHO0FBMkNILE1BQU0sT0FBTyxpQkFBaUI7SUExQzlCO1FBMkNFLDhCQUE4QjtRQUNyQixVQUFLLEdBQUcsS0FBSyxDQUE0QixFQUErQixDQUFDLENBQUM7UUFFbkYseUNBQXlDO1FBQ3pDLFdBQU0sR0FBRyxRQUFRLENBQ2YsR0FBRyxFQUFFLENBQ0gsQ0FBQztZQUNDLEdBQUcsa0JBQWtCO1lBQ3JCLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRTtTQUNoQixDQUFpRCxDQUNyRCxDQUFDO0tBT0g7SUFMQyxZQUFZO1FBQ1YsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLFNBQVMsQ0FBQztRQUN0QyxJQUFJLENBQUMsS0FBSztZQUFFLE9BQU8sMEJBQTBCLENBQUM7UUFDOUMsT0FBTyxZQUFZLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxtQkFBbUIsS0FBSyxHQUFHLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQztJQUM1RSxDQUFDOytHQWpCVSxpQkFBaUI7bUdBQWpCLGlCQUFpQiw2TUF0Q2xCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1DVCwycURBcENTLFlBQVksK0JBQUUsT0FBTzs7NEZBdUNwQixpQkFBaUI7a0JBMUM3QixTQUFTOytCQUNFLGVBQWUsY0FDYixJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsT0FBTyxDQUFDLFlBQ3RCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1DVCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDb21wb25lbnQsIGNvbXB1dGVkLCBpbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSW9uSWNvbiB9IGZyb20gJ0Bpb25pYy9hbmd1bGFyL3N0YW5kYWxvbmUnO1xuaW1wb3J0IHsgSW5mb0NhcmRNZXRhZGF0YSwgSU5GT19DQVJEX0RFRkFVTFRTIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IElPTklDX0NPTE9SUyA9IFsncHJpbWFyeScsICdzZWNvbmRhcnknLCAndGVydGlhcnknLCAnc3VjY2VzcycsICd3YXJuaW5nJywgJ2RhbmdlcicsICdsaWdodCcsICdtZWRpdW0nLCAnZGFyayddO1xuXG4vKipcbiAqIHZhbC1pbmZvLWNhcmRcbiAqXG4gKiBDYXJkIHdpdGggaWNvbiArIG92ZXJ0aXRsZSArIHRpdGxlICsgc3VidGl0bGUgb24gdGhlIGxlZnQgc2lkZSwgYW5kIGEgbGlzdFxuICogb2Yga2V5LXZhbHVlIHBhaXJzIChsYWJlbDogdmFsdWUpIG9uIHRoZSByaWdodCBzaWRlLiBJbnNwaXJlZCBieSBucG0nc1xuICogXCJQcm92ZW5hbmNlXCIgLyBtZXRhZGF0YSBwYW5lbCBzdHlsZS5cbiAqXG4gKiBUd28tY29sdW1uIGxheW91dCBvbiBkZXNrdG9wLCBzdGFja2VkIHNpbmdsZS1jb2x1bW4gb24gbW9iaWxlLlxuICpcbiAqIFByZXNlbnRhdGlvbmFsIOKAlCBwYXNzIGFscmVhZHktcmVzb2x2ZWQgc3RyaW5ncy5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgaHRtbFxuICogPHZhbC1pbmZvLWNhcmRcbiAqICAgW3Byb3BzXT1cIntcbiAqICAgICBpY29uOiAnY3ViZS1vdXRsaW5lJyxcbiAqICAgICB0aXRsZTogJ3ZhbHRlY2gtY29tcG9uZW50cycsXG4gKiAgICAgc3VidGl0bGU6ICd2Mi4wLjk2MicsXG4gKiAgICAga2V5VmFsdWVzOiBbXG4gKiAgICAgICB7IGxhYmVsOiAnTGljZW5zZScsIHZhbHVlOiAnTUlUJyB9LFxuICogICAgICAgeyBsYWJlbDogJ0Rvd25sb2FkcycsIHZhbHVlOiAnMS4yTScgfVxuICogICAgIF1cbiAqICAgfVwiXG4gKiAvPlxuICogYGBgXG4gKi9cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3ZhbC1pbmZvLWNhcmQnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJb25JY29uXSxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cImluZm8tY2FyZFwiXG4gICAgICBbY2xhc3MuaW5mby1jYXJkLS1ib3JkZXJlZF09XCJjb25maWcoKS5ib3JkZXJlZFwiXG4gICAgICBbY2xhc3MuaW5mby1jYXJkLS1zaGFkb3dlZF09XCJjb25maWcoKS5zaGFkb3dlZFwiXG4gICAgICBbc3R5bGUucGFkZGluZ109XCJjb25maWcoKS5wYWRkaW5nXCJcbiAgICAgIFtzdHlsZS5ib3JkZXItcmFkaXVzXT1cImNvbmZpZygpLmJvcmRlclJhZGl1c1wiXG4gICAgPlxuICAgICAgPGRpdiBjbGFzcz1cImluZm8tY2FyZF9fbGVmdFwiPlxuICAgICAgICBAaWYgKGNvbmZpZygpLmljb24pIHtcbiAgICAgICAgICA8aW9uLWljb24gY2xhc3M9XCJpbmZvLWNhcmRfX2ljb25cIiBbbmFtZV09XCJjb25maWcoKS5pY29uXCIgW3N0eWxlLmNvbG9yXT1cImdldEljb25Db2xvcigpXCI+PC9pb24taWNvbj5cbiAgICAgICAgfVxuXG4gICAgICAgIEBpZiAoY29uZmlnKCkub3ZlcnRpdGxlKSB7XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJpbmZvLWNhcmRfX292ZXJ0aXRsZVwiPnt7IGNvbmZpZygpLm92ZXJ0aXRsZSB9fTwvc3Bhbj5cbiAgICAgICAgfVxuXG4gICAgICAgIDxoMyBjbGFzcz1cImluZm8tY2FyZF9fdGl0bGVcIj57eyBjb25maWcoKS50aXRsZSB9fTwvaDM+XG5cbiAgICAgICAgQGlmIChjb25maWcoKS5zdWJ0aXRsZSkge1xuICAgICAgICAgIDxwIGNsYXNzPVwiaW5mby1jYXJkX19zdWJ0aXRsZVwiPnt7IGNvbmZpZygpLnN1YnRpdGxlIH19PC9wPlxuICAgICAgICB9XG4gICAgICA8L2Rpdj5cblxuICAgICAgQGlmIChjb25maWcoKS5rZXlWYWx1ZXM/Lmxlbmd0aCkge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiaW5mby1jYXJkX19yaWdodFwiPlxuICAgICAgICAgIEBmb3IgKGt2IG9mIGNvbmZpZygpLmtleVZhbHVlczsgdHJhY2sgJGluZGV4KSB7XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaW5mby1jYXJkX19rdlwiPlxuICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImluZm8tY2FyZF9fa3YtbGFiZWxcIj57eyBrdi5sYWJlbCB9fTwvc3Bhbj5cbiAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJpbmZvLWNhcmRfX2t2LXZhbHVlXCI+e3sga3YudmFsdWUgfX08L3NwYW4+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICB9XG4gICAgICAgIDwvZGl2PlxuICAgICAgfVxuICAgIDwvZGl2PlxuICBgLFxuICBzdHlsZVVybHM6IFsnLi9pbmZvLWNhcmQuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgSW5mb0NhcmRDb21wb25lbnQge1xuICAvKiogQ29tcG9uZW50IGNvbmZpZ3VyYXRpb24gKi9cbiAgcmVhZG9ubHkgcHJvcHMgPSBpbnB1dDxQYXJ0aWFsPEluZm9DYXJkTWV0YWRhdGE+Pih7fSBhcyBQYXJ0aWFsPEluZm9DYXJkTWV0YWRhdGE+KTtcblxuICAvKiogTWVyZ2VkIGNvbmZpZ3VyYXRpb24gd2l0aCBkZWZhdWx0cyAqL1xuICBjb25maWcgPSBjb21wdXRlZChcbiAgICAoKSA9PlxuICAgICAgKHtcbiAgICAgICAgLi4uSU5GT19DQVJEX0RFRkFVTFRTLFxuICAgICAgICAuLi50aGlzLnByb3BzKCksXG4gICAgICB9KSBhcyBJbmZvQ2FyZE1ldGFkYXRhICYgdHlwZW9mIElORk9fQ0FSRF9ERUZBVUxUU1xuICApO1xuXG4gIGdldEljb25Db2xvcigpOiBzdHJpbmcge1xuICAgIGNvbnN0IGNvbG9yID0gdGhpcy5jb25maWcoKS5pY29uQ29sb3I7XG4gICAgaWYgKCFjb2xvcikgcmV0dXJuIGB2YXIoLS1pb24tY29sb3ItcHJpbWFyeSlgO1xuICAgIHJldHVybiBJT05JQ19DT0xPUlMuaW5jbHVkZXMoY29sb3IpID8gYHZhcigtLWlvbi1jb2xvci0ke2NvbG9yfSlgIDogY29sb3I7XG4gIH1cbn1cbiJdfQ==
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Default values for InfoCardMetadata.
|
|
3
|
+
*/
|
|
4
|
+
export const INFO_CARD_DEFAULTS = {
|
|
5
|
+
iconColor: 'primary',
|
|
6
|
+
bordered: true,
|
|
7
|
+
shadowed: false,
|
|
8
|
+
padding: '1.5rem',
|
|
9
|
+
borderRadius: '16px',
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvbW9sZWN1bGVzL2luZm8tY2FyZC90eXBlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQ0E7O0dBRUc7QUFDSCxNQUFNLENBQUMsTUFBTSxrQkFBa0IsR0FFM0I7SUFDRixTQUFTLEVBQUUsU0FBUztJQUNwQixRQUFRLEVBQUUsSUFBSTtJQUNkLFFBQVEsRUFBRSxLQUFLO0lBQ2YsT0FBTyxFQUFFLFFBQVE7SUFDakIsWUFBWSxFQUFFLE1BQU07Q0FDckIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQSBzaW5nbGUga2V5LXZhbHVlIHBhaXIgc2hvd24gaW4gdGhlIHJpZ2h0IGNvbHVtbiBvZiB2YWwtaW5mby1jYXJkLlxuICovXG5leHBvcnQgaW50ZXJmYWNlIEluZm9DYXJkS2V5VmFsdWUge1xuICAvKiogTGFiZWwgKHNob3duIGluIG11dGVkIGNvbG9yKSAqL1xuICBsYWJlbDogc3RyaW5nO1xuICAvKiogVmFsdWUgKHNob3duIGluIGJvbGQpICovXG4gIHZhbHVlOiBzdHJpbmc7XG4gIC8qKiBPcHRpb25hbCB0b2tlbiBmb3IgY2xpY2sgaWRlbnRpZmljYXRpb24gKi9cbiAgdG9rZW4/OiBzdHJpbmc7XG59XG5cbi8qKlxuICogTWV0YWRhdGEgZm9yIHZhbC1pbmZvLWNhcmQuXG4gKlxuICogQ2FyZCB3aXRoIGljb24gKyBvdmVydGl0bGUgKyB0aXRsZSArIHN1YnRpdGxlIG9uIHRoZSBsZWZ0IHNpZGUsIGFuZCBhIGxpc3RcbiAqIG9mIGtleS12YWx1ZSBwYWlycyBvbiB0aGUgcmlnaHQgc2lkZS4gSW5zcGlyZWQgYnkgbnBtIFwiUHJvdmVuYW5jZVwiIC8gbWV0YWRhdGFcbiAqIHBhbmVscy4gVHdvLWNvbHVtbiBsYXlvdXQgb24gZGVza3RvcCwgc3RhY2tlZCBvbiBtb2JpbGUuXG4gKi9cbmV4cG9ydCBpbnRlcmZhY2UgSW5mb0NhcmRNZXRhZGF0YSB7XG4gIC8qKiBpb24taWNvbiBuYW1lICovXG4gIGljb24/OiBzdHJpbmc7XG4gIC8qKiBJY29uIGNvbG9yIChJb25pYyBjb2xvciBuYW1lIG9yIENTUyBjb2xvcikuIERlZmF1bHQ6ICdwcmltYXJ5JyAqL1xuICBpY29uQ29sb3I/OiBzdHJpbmc7XG4gIC8qKiBTbWFsbCBsYWJlbCBhYm92ZSB0aGUgdGl0bGUgKi9cbiAgb3ZlcnRpdGxlPzogc3RyaW5nO1xuICAvKiogTWFpbiB0aXRsZSAqL1xuICB0aXRsZTogc3RyaW5nO1xuICAvKiogU3VidGl0bGUgYmVsb3cgdGhlIHRpdGxlICovXG4gIHN1YnRpdGxlPzogc3RyaW5nO1xuICAvKiogS2V5LXZhbHVlIHBhaXJzIHNob3duIGluIHRoZSByaWdodCBjb2x1bW4gKi9cbiAga2V5VmFsdWVzPzogSW5mb0NhcmRLZXlWYWx1ZVtdO1xuICAvKiogU2hvdyBib3JkZXIuIERlZmF1bHQ6IHRydWUgKi9cbiAgYm9yZGVyZWQ/OiBib29sZWFuO1xuICAvKiogU2hvdyBzaGFkb3cuIERlZmF1bHQ6IGZhbHNlICovXG4gIHNoYWRvd2VkPzogYm9vbGVhbjtcbiAgLyoqIENhcmQgcGFkZGluZy4gRGVmYXVsdDogJzEuNXJlbScgKi9cbiAgcGFkZGluZz86IHN0cmluZztcbiAgLyoqIENhcmQgYm9yZGVyIHJhZGl1cy4gRGVmYXVsdDogJzE2cHgnICovXG4gIGJvcmRlclJhZGl1cz86IHN0cmluZztcbn1cblxuLyoqXG4gKiBEZWZhdWx0IHZhbHVlcyBmb3IgSW5mb0NhcmRNZXRhZGF0YS5cbiAqL1xuZXhwb3J0IGNvbnN0IElORk9fQ0FSRF9ERUZBVUxUUzogUmVxdWlyZWQ8XG4gIFBpY2s8SW5mb0NhcmRNZXRhZGF0YSwgJ2ljb25Db2xvcicgfCAnYm9yZGVyZWQnIHwgJ3NoYWRvd2VkJyB8ICdwYWRkaW5nJyB8ICdib3JkZXJSYWRpdXMnPlxuPiA9IHtcbiAgaWNvbkNvbG9yOiAncHJpbWFyeScsXG4gIGJvcmRlcmVkOiB0cnVlLFxuICBzaGFkb3dlZDogZmFsc2UsXG4gIHBhZGRpbmc6ICcxLjVyZW0nLFxuICBib3JkZXJSYWRpdXM6ICcxNnB4Jyxcbn07XG4iXX0=
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { Component, computed, EventEmitter, input, Output } from '@angular/core';
|
|
3
|
+
import { RouterLink } from '@angular/router';
|
|
4
|
+
import { IonButton, IonIcon } from '@ionic/angular/standalone';
|
|
5
|
+
import { StatsBarComponent } from '../stats-bar/stats-bar.component';
|
|
6
|
+
import { METRIC_CARD_DEFAULTS } from './types';
|
|
7
|
+
import * as i0 from "@angular/core";
|
|
8
|
+
/**
|
|
9
|
+
* val-metric-card
|
|
10
|
+
*
|
|
11
|
+
* Card with title + optional info link + description + horizontal stats row
|
|
12
|
+
* (val-stats-bar) + a discrete icon action button in the top-right corner.
|
|
13
|
+
*
|
|
14
|
+
* Presentational — pass already-resolved strings.
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* ```html
|
|
18
|
+
* <val-metric-card
|
|
19
|
+
* [props]="{
|
|
20
|
+
* title: 'Email Activity',
|
|
21
|
+
* description: 'Last 30 days',
|
|
22
|
+
* stats: { stats: [{ label: 'Sent', value: 1240 }, { label: 'Opens', value: 680 }] },
|
|
23
|
+
* action: { icon: 'refresh-outline', token: 'refresh' }
|
|
24
|
+
* }"
|
|
25
|
+
* (onAction)="handleAction($event)"
|
|
26
|
+
* />
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export class MetricCardComponent {
|
|
30
|
+
constructor() {
|
|
31
|
+
/** Component configuration */
|
|
32
|
+
this.props = input({});
|
|
33
|
+
/** Emitted with the token of the clicked action */
|
|
34
|
+
this.onAction = new EventEmitter();
|
|
35
|
+
/** Merged configuration with defaults */
|
|
36
|
+
this.config = computed(() => ({
|
|
37
|
+
...METRIC_CARD_DEFAULTS,
|
|
38
|
+
...this.props(),
|
|
39
|
+
}));
|
|
40
|
+
}
|
|
41
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MetricCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
42
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MetricCardComponent, isStandalone: true, selector: "val-metric-card", inputs: { props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onAction: "onAction" }, ngImport: i0, template: `
|
|
43
|
+
<div
|
|
44
|
+
class="metric-card"
|
|
45
|
+
[class.metric-card--bordered]="config().bordered"
|
|
46
|
+
[class.metric-card--shadowed]="config().shadowed"
|
|
47
|
+
[style.padding]="config().padding"
|
|
48
|
+
[style.border-radius]="config().borderRadius"
|
|
49
|
+
>
|
|
50
|
+
<div class="metric-card__header">
|
|
51
|
+
<div class="metric-card__header-left">
|
|
52
|
+
<h3 class="metric-card__title">{{ config().title }}</h3>
|
|
53
|
+
|
|
54
|
+
@if (config().infoLabel) {
|
|
55
|
+
<a
|
|
56
|
+
class="metric-card__info-link"
|
|
57
|
+
[routerLink]="config().infoRoute ?? null"
|
|
58
|
+
[attr.href]="config().infoHref ?? null"
|
|
59
|
+
[attr.target]="config().infoHref ? '_blank' : null"
|
|
60
|
+
[attr.rel]="config().infoHref ? 'noopener noreferrer' : null"
|
|
61
|
+
>
|
|
62
|
+
{{ config().infoLabel }}
|
|
63
|
+
</a>
|
|
64
|
+
}
|
|
65
|
+
</div>
|
|
66
|
+
|
|
67
|
+
@if (config().action; as action) {
|
|
68
|
+
<ion-button
|
|
69
|
+
class="metric-card__action"
|
|
70
|
+
fill="clear"
|
|
71
|
+
size="small"
|
|
72
|
+
[disabled]="action.disabled ?? false"
|
|
73
|
+
(click)="onAction.emit(action.token)"
|
|
74
|
+
>
|
|
75
|
+
<ion-icon [name]="action.icon" slot="icon-only"></ion-icon>
|
|
76
|
+
</ion-button>
|
|
77
|
+
}
|
|
78
|
+
</div>
|
|
79
|
+
|
|
80
|
+
@if (config().description) {
|
|
81
|
+
<p class="metric-card__description">{{ config().description }}</p>
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
@if (config().stats; as stats) {
|
|
85
|
+
<div class="metric-card__stats">
|
|
86
|
+
<val-stats-bar [props]="stats"></val-stats-bar>
|
|
87
|
+
</div>
|
|
88
|
+
}
|
|
89
|
+
</div>
|
|
90
|
+
`, isInline: true, styles: [":host{display:block}.metric-card{background:var(--ion-card-background, var(--ion-background-color))}.metric-card--bordered{border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .1))}.metric-card--shadowed{box-shadow:0 2px 8px #00000014}.metric-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem;margin-bottom:.25rem}.metric-card__header-left{display:flex;flex-direction:column;gap:.2rem;flex:1 1 0;min-width:0}.metric-card__title{margin:0;font-size:1rem;font-weight:700;color:var(--ion-text-color);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric-card__info-link{font-size:.8rem;font-weight:500;color:var(--ion-color-primary);text-decoration:none;transition:opacity .15s ease;width:fit-content}.metric-card__info-link:hover{opacity:.75;text-decoration:underline}.metric-card__action{flex-shrink:0;margin:-6px -8px 0 0}.metric-card__description{margin:0 0 .75rem;font-size:.875rem;color:var(--ion-color-medium-shade);line-height:1.5}.metric-card__stats{margin-top:.5rem}:host-context(body.dark) .metric-card--bordered,:host-context(html.ion-palette-dark) .metric-card--bordered,:host-context([data-theme=dark]) .metric-card--bordered{border-color:#ffffff1f}:host-context(body.dark) .metric-card--shadowed,:host-context(html.ion-palette-dark) .metric-card--shadowed,:host-context([data-theme=dark]) .metric-card--shadowed{box-shadow:0 2px 8px #0000004d}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: StatsBarComponent, selector: "val-stats-bar", inputs: ["props"] }] }); }
|
|
91
|
+
}
|
|
92
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MetricCardComponent, decorators: [{
|
|
93
|
+
type: Component,
|
|
94
|
+
args: [{ selector: 'val-metric-card', standalone: true, imports: [CommonModule, RouterLink, IonButton, IonIcon, StatsBarComponent], template: `
|
|
95
|
+
<div
|
|
96
|
+
class="metric-card"
|
|
97
|
+
[class.metric-card--bordered]="config().bordered"
|
|
98
|
+
[class.metric-card--shadowed]="config().shadowed"
|
|
99
|
+
[style.padding]="config().padding"
|
|
100
|
+
[style.border-radius]="config().borderRadius"
|
|
101
|
+
>
|
|
102
|
+
<div class="metric-card__header">
|
|
103
|
+
<div class="metric-card__header-left">
|
|
104
|
+
<h3 class="metric-card__title">{{ config().title }}</h3>
|
|
105
|
+
|
|
106
|
+
@if (config().infoLabel) {
|
|
107
|
+
<a
|
|
108
|
+
class="metric-card__info-link"
|
|
109
|
+
[routerLink]="config().infoRoute ?? null"
|
|
110
|
+
[attr.href]="config().infoHref ?? null"
|
|
111
|
+
[attr.target]="config().infoHref ? '_blank' : null"
|
|
112
|
+
[attr.rel]="config().infoHref ? 'noopener noreferrer' : null"
|
|
113
|
+
>
|
|
114
|
+
{{ config().infoLabel }}
|
|
115
|
+
</a>
|
|
116
|
+
}
|
|
117
|
+
</div>
|
|
118
|
+
|
|
119
|
+
@if (config().action; as action) {
|
|
120
|
+
<ion-button
|
|
121
|
+
class="metric-card__action"
|
|
122
|
+
fill="clear"
|
|
123
|
+
size="small"
|
|
124
|
+
[disabled]="action.disabled ?? false"
|
|
125
|
+
(click)="onAction.emit(action.token)"
|
|
126
|
+
>
|
|
127
|
+
<ion-icon [name]="action.icon" slot="icon-only"></ion-icon>
|
|
128
|
+
</ion-button>
|
|
129
|
+
}
|
|
130
|
+
</div>
|
|
131
|
+
|
|
132
|
+
@if (config().description) {
|
|
133
|
+
<p class="metric-card__description">{{ config().description }}</p>
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
@if (config().stats; as stats) {
|
|
137
|
+
<div class="metric-card__stats">
|
|
138
|
+
<val-stats-bar [props]="stats"></val-stats-bar>
|
|
139
|
+
</div>
|
|
140
|
+
}
|
|
141
|
+
</div>
|
|
142
|
+
`, styles: [":host{display:block}.metric-card{background:var(--ion-card-background, var(--ion-background-color))}.metric-card--bordered{border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .1))}.metric-card--shadowed{box-shadow:0 2px 8px #00000014}.metric-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem;margin-bottom:.25rem}.metric-card__header-left{display:flex;flex-direction:column;gap:.2rem;flex:1 1 0;min-width:0}.metric-card__title{margin:0;font-size:1rem;font-weight:700;color:var(--ion-text-color);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric-card__info-link{font-size:.8rem;font-weight:500;color:var(--ion-color-primary);text-decoration:none;transition:opacity .15s ease;width:fit-content}.metric-card__info-link:hover{opacity:.75;text-decoration:underline}.metric-card__action{flex-shrink:0;margin:-6px -8px 0 0}.metric-card__description{margin:0 0 .75rem;font-size:.875rem;color:var(--ion-color-medium-shade);line-height:1.5}.metric-card__stats{margin-top:.5rem}:host-context(body.dark) .metric-card--bordered,:host-context(html.ion-palette-dark) .metric-card--bordered,:host-context([data-theme=dark]) .metric-card--bordered{border-color:#ffffff1f}:host-context(body.dark) .metric-card--shadowed,:host-context(html.ion-palette-dark) .metric-card--shadowed,:host-context([data-theme=dark]) .metric-card--shadowed{box-shadow:0 2px 8px #0000004d}\n"] }]
|
|
143
|
+
}], propDecorators: { onAction: [{
|
|
144
|
+
type: Output
|
|
145
|
+
}] } });
|
|
146
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWV0cmljLWNhcmQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9jb21wb25lbnRzL21vbGVjdWxlcy9tZXRyaWMtY2FyZC9tZXRyaWMtY2FyZC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pGLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUM3QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE9BQU8sRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQy9ELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGtDQUFrQyxDQUFDO0FBQ3JFLE9BQU8sRUFBc0Isb0JBQW9CLEVBQUUsTUFBTSxTQUFTLENBQUM7O0FBRW5FOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9CRztBQXdESCxNQUFNLE9BQU8sbUJBQW1CO0lBdkRoQztRQXdERSw4QkFBOEI7UUFDckIsVUFBSyxHQUFHLEtBQUssQ0FBOEIsRUFBaUMsQ0FBQyxDQUFDO1FBRXZGLG1EQUFtRDtRQUN6QyxhQUFRLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUVoRCx5Q0FBeUM7UUFDekMsV0FBTSxHQUFHLFFBQVEsQ0FDZixHQUFHLEVBQUUsQ0FDSCxDQUFDO1lBQ0MsR0FBRyxvQkFBb0I7WUFDdkIsR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFO1NBQ2hCLENBQXFELENBQ3pELENBQUM7S0FDSDsrR0FmWSxtQkFBbUI7bUdBQW5CLG1CQUFtQixrUEFuRHBCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FnRFQsKzlDQWpEUyxZQUFZLCtCQUFFLFVBQVUsb09BQUUsU0FBUyxvUEFBRSxPQUFPLDJKQUFFLGlCQUFpQjs7NEZBb0Q5RCxtQkFBbUI7a0JBdkQvQixTQUFTOytCQUNFLGlCQUFpQixjQUNmLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxVQUFVLEVBQUUsU0FBUyxFQUFFLE9BQU8sRUFBRSxpQkFBaUIsQ0FBQyxZQUNoRTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBZ0RUOzhCQVFTLFFBQVE7c0JBQWpCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBjb21wdXRlZCwgRXZlbnRFbWl0dGVyLCBpbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBSb3V0ZXJMaW5rIH0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcbmltcG9ydCB7IElvbkJ1dHRvbiwgSW9uSWNvbiB9IGZyb20gJ0Bpb25pYy9hbmd1bGFyL3N0YW5kYWxvbmUnO1xuaW1wb3J0IHsgU3RhdHNCYXJDb21wb25lbnQgfSBmcm9tICcuLi9zdGF0cy1iYXIvc3RhdHMtYmFyLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBNZXRyaWNDYXJkTWV0YWRhdGEsIE1FVFJJQ19DQVJEX0RFRkFVTFRTIH0gZnJvbSAnLi90eXBlcyc7XG5cbi8qKlxuICogdmFsLW1ldHJpYy1jYXJkXG4gKlxuICogQ2FyZCB3aXRoIHRpdGxlICsgb3B0aW9uYWwgaW5mbyBsaW5rICsgZGVzY3JpcHRpb24gKyBob3Jpem9udGFsIHN0YXRzIHJvd1xuICogKHZhbC1zdGF0cy1iYXIpICsgYSBkaXNjcmV0ZSBpY29uIGFjdGlvbiBidXR0b24gaW4gdGhlIHRvcC1yaWdodCBjb3JuZXIuXG4gKlxuICogUHJlc2VudGF0aW9uYWwg4oCUIHBhc3MgYWxyZWFkeS1yZXNvbHZlZCBzdHJpbmdzLlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGBodG1sXG4gKiA8dmFsLW1ldHJpYy1jYXJkXG4gKiAgIFtwcm9wc109XCJ7XG4gKiAgICAgdGl0bGU6ICdFbWFpbCBBY3Rpdml0eScsXG4gKiAgICAgZGVzY3JpcHRpb246ICdMYXN0IDMwIGRheXMnLFxuICogICAgIHN0YXRzOiB7IHN0YXRzOiBbeyBsYWJlbDogJ1NlbnQnLCB2YWx1ZTogMTI0MCB9LCB7IGxhYmVsOiAnT3BlbnMnLCB2YWx1ZTogNjgwIH1dIH0sXG4gKiAgICAgYWN0aW9uOiB7IGljb246ICdyZWZyZXNoLW91dGxpbmUnLCB0b2tlbjogJ3JlZnJlc2gnIH1cbiAqICAgfVwiXG4gKiAgIChvbkFjdGlvbik9XCJoYW5kbGVBY3Rpb24oJGV2ZW50KVwiXG4gKiAvPlxuICogYGBgXG4gKi9cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3ZhbC1tZXRyaWMtY2FyZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIFJvdXRlckxpbmssIElvbkJ1dHRvbiwgSW9uSWNvbiwgU3RhdHNCYXJDb21wb25lbnRdLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwibWV0cmljLWNhcmRcIlxuICAgICAgW2NsYXNzLm1ldHJpYy1jYXJkLS1ib3JkZXJlZF09XCJjb25maWcoKS5ib3JkZXJlZFwiXG4gICAgICBbY2xhc3MubWV0cmljLWNhcmQtLXNoYWRvd2VkXT1cImNvbmZpZygpLnNoYWRvd2VkXCJcbiAgICAgIFtzdHlsZS5wYWRkaW5nXT1cImNvbmZpZygpLnBhZGRpbmdcIlxuICAgICAgW3N0eWxlLmJvcmRlci1yYWRpdXNdPVwiY29uZmlnKCkuYm9yZGVyUmFkaXVzXCJcbiAgICA+XG4gICAgICA8ZGl2IGNsYXNzPVwibWV0cmljLWNhcmRfX2hlYWRlclwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwibWV0cmljLWNhcmRfX2hlYWRlci1sZWZ0XCI+XG4gICAgICAgICAgPGgzIGNsYXNzPVwibWV0cmljLWNhcmRfX3RpdGxlXCI+e3sgY29uZmlnKCkudGl0bGUgfX08L2gzPlxuXG4gICAgICAgICAgQGlmIChjb25maWcoKS5pbmZvTGFiZWwpIHtcbiAgICAgICAgICAgIDxhXG4gICAgICAgICAgICAgIGNsYXNzPVwibWV0cmljLWNhcmRfX2luZm8tbGlua1wiXG4gICAgICAgICAgICAgIFtyb3V0ZXJMaW5rXT1cImNvbmZpZygpLmluZm9Sb3V0ZSA/PyBudWxsXCJcbiAgICAgICAgICAgICAgW2F0dHIuaHJlZl09XCJjb25maWcoKS5pbmZvSHJlZiA/PyBudWxsXCJcbiAgICAgICAgICAgICAgW2F0dHIudGFyZ2V0XT1cImNvbmZpZygpLmluZm9IcmVmID8gJ19ibGFuaycgOiBudWxsXCJcbiAgICAgICAgICAgICAgW2F0dHIucmVsXT1cImNvbmZpZygpLmluZm9IcmVmID8gJ25vb3BlbmVyIG5vcmVmZXJyZXInIDogbnVsbFwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIHt7IGNvbmZpZygpLmluZm9MYWJlbCB9fVxuICAgICAgICAgICAgPC9hPlxuICAgICAgICAgIH1cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgQGlmIChjb25maWcoKS5hY3Rpb247IGFzIGFjdGlvbikge1xuICAgICAgICAgIDxpb24tYnV0dG9uXG4gICAgICAgICAgICBjbGFzcz1cIm1ldHJpYy1jYXJkX19hY3Rpb25cIlxuICAgICAgICAgICAgZmlsbD1cImNsZWFyXCJcbiAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICBbZGlzYWJsZWRdPVwiYWN0aW9uLmRpc2FibGVkID8/IGZhbHNlXCJcbiAgICAgICAgICAgIChjbGljayk9XCJvbkFjdGlvbi5lbWl0KGFjdGlvbi50b2tlbilcIlxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxpb24taWNvbiBbbmFtZV09XCJhY3Rpb24uaWNvblwiIHNsb3Q9XCJpY29uLW9ubHlcIj48L2lvbi1pY29uPlxuICAgICAgICAgIDwvaW9uLWJ1dHRvbj5cbiAgICAgICAgfVxuICAgICAgPC9kaXY+XG5cbiAgICAgIEBpZiAoY29uZmlnKCkuZGVzY3JpcHRpb24pIHtcbiAgICAgICAgPHAgY2xhc3M9XCJtZXRyaWMtY2FyZF9fZGVzY3JpcHRpb25cIj57eyBjb25maWcoKS5kZXNjcmlwdGlvbiB9fTwvcD5cbiAgICAgIH1cblxuICAgICAgQGlmIChjb25maWcoKS5zdGF0czsgYXMgc3RhdHMpIHtcbiAgICAgICAgPGRpdiBjbGFzcz1cIm1ldHJpYy1jYXJkX19zdGF0c1wiPlxuICAgICAgICAgIDx2YWwtc3RhdHMtYmFyIFtwcm9wc109XCJzdGF0c1wiPjwvdmFsLXN0YXRzLWJhcj5cbiAgICAgICAgPC9kaXY+XG4gICAgICB9XG4gICAgPC9kaXY+XG4gIGAsXG4gIHN0eWxlVXJsczogWycuL21ldHJpYy1jYXJkLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIE1ldHJpY0NhcmRDb21wb25lbnQge1xuICAvKiogQ29tcG9uZW50IGNvbmZpZ3VyYXRpb24gKi9cbiAgcmVhZG9ubHkgcHJvcHMgPSBpbnB1dDxQYXJ0aWFsPE1ldHJpY0NhcmRNZXRhZGF0YT4+KHt9IGFzIFBhcnRpYWw8TWV0cmljQ2FyZE1ldGFkYXRhPik7XG5cbiAgLyoqIEVtaXR0ZWQgd2l0aCB0aGUgdG9rZW4gb2YgdGhlIGNsaWNrZWQgYWN0aW9uICovXG4gIEBPdXRwdXQoKSBvbkFjdGlvbiA9IG5ldyBFdmVudEVtaXR0ZXI8c3RyaW5nPigpO1xuXG4gIC8qKiBNZXJnZWQgY29uZmlndXJhdGlvbiB3aXRoIGRlZmF1bHRzICovXG4gIGNvbmZpZyA9IGNvbXB1dGVkKFxuICAgICgpID0+XG4gICAgICAoe1xuICAgICAgICAuLi5NRVRSSUNfQ0FSRF9ERUZBVUxUUyxcbiAgICAgICAgLi4udGhpcy5wcm9wcygpLFxuICAgICAgfSkgYXMgTWV0cmljQ2FyZE1ldGFkYXRhICYgdHlwZW9mIE1FVFJJQ19DQVJEX0RFRkFVTFRTXG4gICk7XG59XG4iXX0=
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Default values for MetricCardMetadata.
|
|
3
|
+
*/
|
|
4
|
+
export const METRIC_CARD_DEFAULTS = {
|
|
5
|
+
bordered: true,
|
|
6
|
+
shadowed: false,
|
|
7
|
+
padding: '1.25rem 1.5rem',
|
|
8
|
+
borderRadius: '16px',
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvbW9sZWN1bGVzL21ldHJpYy1jYXJkL3R5cGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZDQTs7R0FFRztBQUNILE1BQU0sQ0FBQyxNQUFNLG9CQUFvQixHQUU3QjtJQUNGLFFBQVEsRUFBRSxJQUFJO0lBQ2QsUUFBUSxFQUFFLEtBQUs7SUFDZixPQUFPLEVBQUUsZ0JBQWdCO0lBQ3pCLFlBQVksRUFBRSxNQUFNO0NBQ3JCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBTdGF0c0Jhck1ldGFkYXRhIH0gZnJvbSAnLi4vc3RhdHMtYmFyL3R5cGVzJztcblxuLyoqXG4gKiBBIGRpc2NyZXRlIGFjdGlvbiBidXR0b24gc2hvd24gaW4gdGhlIHRvcC1yaWdodCBjb3JuZXIgb2YgdmFsLW1ldHJpYy1jYXJkLlxuICovXG5leHBvcnQgaW50ZXJmYWNlIE1ldHJpY0NhcmRBY3Rpb24ge1xuICAvKiogaW9uLWljb24gbmFtZSAqL1xuICBpY29uOiBzdHJpbmc7XG4gIC8qKiBUb2tlbiBpZGVudGlmaWVyIGVtaXR0ZWQgYnkgKG9uQWN0aW9uKSAqL1xuICB0b2tlbjogc3RyaW5nO1xuICAvKiogV2hldGhlciB0aGUgYWN0aW9uIGJ1dHRvbiBpcyBkaXNhYmxlZCAqL1xuICBkaXNhYmxlZD86IGJvb2xlYW47XG59XG5cbi8qKlxuICogTWV0YWRhdGEgZm9yIHZhbC1tZXRyaWMtY2FyZC5cbiAqXG4gKiBDYXJkIHdpdGggdGl0bGUgKyBvcHRpb25hbCBpbmZvIGxpbmsgKyBkZXNjcmlwdGlvbiArIGhvcml6b250YWwgc3RhdHMgcm93XG4gKiAodmFsLXN0YXRzLWJhcikgKyBhIGRpc2NyZXRlIGFjdGlvbiBidXR0b24gaW4gdGhlIHRvcC1yaWdodCBjb3JuZXIuXG4gKi9cbmV4cG9ydCBpbnRlcmZhY2UgTWV0cmljQ2FyZE1ldGFkYXRhIHtcbiAgLyoqIENhcmQgdGl0bGUgKi9cbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFRleHQgZm9yIHRoZSBpbmZvIGxpbmsgbmV4dCB0byB0aGUgdGl0bGUgKi9cbiAgaW5mb0xhYmVsPzogc3RyaW5nO1xuICAvKiogRXh0ZXJuYWwgaHJlZiBmb3IgdGhlIGluZm8gbGluayAqL1xuICBpbmZvSHJlZj86IHN0cmluZztcbiAgLyoqIEludGVybmFsIHJvdXRlIGZvciB0aGUgaW5mbyBsaW5rICovXG4gIGluZm9Sb3V0ZT86IHN0cmluZyB8IGFueVtdO1xuICAvKiogRGVzY3JpcHRpb24gLyBzdWJ0aXRsZSBiZWxvdyB0aGUgdGl0bGUgKi9cbiAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG4gIC8qKiBTdGF0cyB0byBkaXNwbGF5IHVzaW5nIHZhbC1zdGF0cy1iYXIgKi9cbiAgc3RhdHM/OiBTdGF0c0Jhck1ldGFkYXRhO1xuICAvKiogRGlzY3JldGUgYWN0aW9uIGJ1dHRvbiBpbiB0b3AtcmlnaHQgY29ybmVyICovXG4gIGFjdGlvbj86IE1ldHJpY0NhcmRBY3Rpb247XG4gIC8qKiBTaG93IGJvcmRlci4gRGVmYXVsdDogdHJ1ZSAqL1xuICBib3JkZXJlZD86IGJvb2xlYW47XG4gIC8qKiBTaG93IHNoYWRvdy4gRGVmYXVsdDogZmFsc2UgKi9cbiAgc2hhZG93ZWQ/OiBib29sZWFuO1xuICAvKiogQ2FyZCBwYWRkaW5nLiBEZWZhdWx0OiAnMS4yNXJlbSAxLjVyZW0nICovXG4gIHBhZGRpbmc/OiBzdHJpbmc7XG4gIC8qKiBDYXJkIGJvcmRlciByYWRpdXMuIERlZmF1bHQ6ICcxNnB4JyAqL1xuICBib3JkZXJSYWRpdXM/OiBzdHJpbmc7XG59XG5cbi8qKlxuICogRGVmYXVsdCB2YWx1ZXMgZm9yIE1ldHJpY0NhcmRNZXRhZGF0YS5cbiAqL1xuZXhwb3J0IGNvbnN0IE1FVFJJQ19DQVJEX0RFRkFVTFRTOiBSZXF1aXJlZDxcbiAgUGljazxNZXRyaWNDYXJkTWV0YWRhdGEsICdib3JkZXJlZCcgfCAnc2hhZG93ZWQnIHwgJ3BhZGRpbmcnIHwgJ2JvcmRlclJhZGl1cyc+XG4+ID0ge1xuICBib3JkZXJlZDogdHJ1ZSxcbiAgc2hhZG93ZWQ6IGZhbHNlLFxuICBwYWRkaW5nOiAnMS4yNXJlbSAxLjVyZW0nLFxuICBib3JkZXJSYWRpdXM6ICcxNnB4Jyxcbn07XG4iXX0=
|