@kern-ux-annex/kern-angular-kit 1.2.1 → 1.2.2
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.
|
@@ -4,11 +4,11 @@ import { NgTemplateOutlet } from '@angular/common';
|
|
|
4
4
|
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
|
|
5
5
|
|
|
6
6
|
class KernTitle {
|
|
7
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
8
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
7
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
8
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
9
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.2", type: KernTitle, isStandalone: true, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-title--small": "size() === \"small\"", "class.kern-title--large": "size() === \"large\"" }, classAttribute: "kern-title" }, ngImport: i0 });
|
|
10
10
|
}
|
|
11
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
11
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernTitle, decorators: [{
|
|
12
12
|
type: Directive,
|
|
13
13
|
args: [{
|
|
14
14
|
host: {
|
|
@@ -22,21 +22,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
22
22
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
23
23
|
|
|
24
24
|
class KernAccordion {
|
|
25
|
-
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
26
|
-
open = input(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
|
|
27
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
28
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
25
|
+
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
26
|
+
open = input(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
27
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
28
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernAccordion, isStandalone: true, selector: "kern-accordion", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<details class=\"kern-accordion\" [open]=\"open()\">\n <summary class=\"kern-accordion__header\">\n <span kernTitle>{{ title() }}</span>\n </summary>\n <section class=\"kern-accordion__body\">\n <ng-content />\n </section>\n</details>\n", styles: [":host{display:contents}:host:not(:first-of-type)>.kern-accordion{margin-top:calc(var(--kern-metric-border-width-light) * -1)}\n"], dependencies: [{ kind: "directive", type: KernTitle, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: ["size"] }] });
|
|
29
29
|
}
|
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAccordion, decorators: [{
|
|
31
31
|
type: Component,
|
|
32
32
|
args: [{ selector: 'kern-accordion', imports: [KernTitle], template: "<details class=\"kern-accordion\" [open]=\"open()\">\n <summary class=\"kern-accordion__header\">\n <span kernTitle>{{ title() }}</span>\n </summary>\n <section class=\"kern-accordion__body\">\n <ng-content />\n </section>\n</details>\n", styles: [":host{display:contents}:host:not(:first-of-type)>.kern-accordion{margin-top:calc(var(--kern-metric-border-width-light) * -1)}\n"] }]
|
|
33
33
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }] } });
|
|
34
34
|
|
|
35
35
|
class KernAccordionGroup {
|
|
36
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
37
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
36
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAccordionGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
37
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.2", type: KernAccordionGroup, isStandalone: true, selector: "kern-accordion-group", host: { classAttribute: "kern-accordion-group" }, ngImport: i0, template: `<ng-content />`, isInline: true });
|
|
38
38
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAccordionGroup, decorators: [{
|
|
40
40
|
type: Component,
|
|
41
41
|
args: [{
|
|
42
42
|
selector: 'kern-accordion-group',
|
|
@@ -46,24 +46,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
46
46
|
}] });
|
|
47
47
|
|
|
48
48
|
class KernIcon {
|
|
49
|
-
name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
50
|
-
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : []));
|
|
51
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
52
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
53
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
49
|
+
name = input.required(...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
50
|
+
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : /* istanbul ignore next */ []));
|
|
51
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
52
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
53
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernIcon, isStandalone: true, selector: "kern-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, ariaHidden: { classPropertyName: "ariaHidden", publicName: "ariaHidden", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span\n class=\"kern-icon kern-icon--{{ name() }}\"\n [attr.aria-hidden]=\"ariaHidden()\"\n [class.kern-icon--small]=\"size() === 'small'\"\n [class.kern-icon--large]=\"size() === 'large'\"\n [class.kern-icon--x-large]=\"size() === 'x-large'\"\n></span>\n", styles: [":host{display:contents}\n"] });
|
|
54
54
|
}
|
|
55
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernIcon, decorators: [{
|
|
56
56
|
type: Component,
|
|
57
57
|
args: [{ selector: 'kern-icon', template: "<span\n class=\"kern-icon kern-icon--{{ name() }}\"\n [attr.aria-hidden]=\"ariaHidden()\"\n [class.kern-icon--small]=\"size() === 'small'\"\n [class.kern-icon--large]=\"size() === 'large'\"\n [class.kern-icon--x-large]=\"size() === 'x-large'\"\n></span>\n", styles: [":host{display:contents}\n"] }]
|
|
58
58
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], ariaHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaHidden", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
59
59
|
|
|
60
60
|
class KernAlert {
|
|
61
|
-
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
62
|
-
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : []));
|
|
63
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
64
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
61
|
+
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
62
|
+
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
63
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAlert, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
64
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernAlert, isStandalone: true, selector: "kern-alert", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"kern-alert kern-alert--{{ variant() }}\" role=\"alert\">\n <div class=\"kern-alert__header\">\n <kern-icon [name]=\"variant()\"></kern-icon>\n <span kernTitle>{{ title() }}</span>\n </div>\n <div class=\"kern-alert__body\"><ng-content /></div>\n</div>\n", styles: [".kern-alert__body:empty{display:none}\n"], dependencies: [{ kind: "component", type: KernIcon, selector: "kern-icon", inputs: ["name", "ariaHidden", "size"] }, { kind: "directive", type: KernTitle, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: ["size"] }] });
|
|
65
65
|
}
|
|
66
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
66
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAlert, decorators: [{
|
|
67
67
|
type: Component,
|
|
68
68
|
args: [{ selector: 'kern-alert', imports: [KernIcon, KernTitle], template: "<div class=\"kern-alert kern-alert--{{ variant() }}\" role=\"alert\">\n <div class=\"kern-alert__header\">\n <kern-icon [name]=\"variant()\"></kern-icon>\n <span kernTitle>{{ title() }}</span>\n </div>\n <div class=\"kern-alert__body\"><ng-content /></div>\n</div>\n", styles: [".kern-alert__body:empty{display:none}\n"] }]
|
|
69
69
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
|
|
@@ -73,10 +73,10 @@ class UniqueIdService {
|
|
|
73
73
|
getUniqueId(prefix = '') {
|
|
74
74
|
return prefix + '_' + (this.counter++).toString();
|
|
75
75
|
}
|
|
76
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
77
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
76
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: UniqueIdService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
77
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: UniqueIdService, providedIn: 'root' });
|
|
78
78
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: UniqueIdService, decorators: [{
|
|
80
80
|
type: Injectable,
|
|
81
81
|
args: [{
|
|
82
82
|
providedIn: 'root'
|
|
@@ -87,9 +87,9 @@ class KernLabel {
|
|
|
87
87
|
optionalSpan;
|
|
88
88
|
elementRef = inject(ElementRef);
|
|
89
89
|
renderer = inject(Renderer2);
|
|
90
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
91
|
-
optional = input(false, { ...(ngDevMode ? { debugName: "optional" } : {}), transform: booleanAttribute });
|
|
92
|
-
srOnly = input(false, { ...(ngDevMode ? { debugName: "srOnly" } : {}), transform: booleanAttribute });
|
|
90
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
91
|
+
optional = input(false, { ...(ngDevMode ? { debugName: "optional" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
92
|
+
srOnly = input(false, { ...(ngDevMode ? { debugName: "srOnly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
93
93
|
ngOnChanges(changes) {
|
|
94
94
|
if (changes['optional']) {
|
|
95
95
|
if (this.optional()) {
|
|
@@ -107,10 +107,10 @@ class KernLabel {
|
|
|
107
107
|
}
|
|
108
108
|
}
|
|
109
109
|
}
|
|
110
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
111
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
110
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
111
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.2", type: KernLabel, isStandalone: true, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, srOnly: { classPropertyName: "srOnly", publicName: "srOnly", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-label--small": "size() === \"small\"", "class.kern-label--large": "size() === \"large\"", "class.kern-sr-only": "srOnly()" }, classAttribute: "kern-label" }, usesOnChanges: true, ngImport: i0 });
|
|
112
112
|
}
|
|
113
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
113
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernLabel, decorators: [{
|
|
114
114
|
type: Directive,
|
|
115
115
|
args: [{
|
|
116
116
|
host: {
|
|
@@ -125,19 +125,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
125
125
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], srOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "srOnly", required: false }] }] } });
|
|
126
126
|
|
|
127
127
|
class KernButton {
|
|
128
|
-
variant = input('primary', ...(ngDevMode ? [{ debugName: "variant" }] : []));
|
|
129
|
-
block = input(false, ...(ngDevMode ? [{ debugName: "block" }] : []));
|
|
130
|
-
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
131
|
-
type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : []));
|
|
132
|
-
iconLeft = input(null, ...(ngDevMode ? [{ debugName: "iconLeft" }] : []));
|
|
133
|
-
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : []));
|
|
134
|
-
srOnlyLabel = input(false, ...(ngDevMode ? [{ debugName: "srOnlyLabel" }] : []));
|
|
135
|
-
formId = input(null, ...(ngDevMode ? [{ debugName: "formId" }] : []));
|
|
128
|
+
variant = input('primary', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
129
|
+
block = input(false, ...(ngDevMode ? [{ debugName: "block" }] : /* istanbul ignore next */ []));
|
|
130
|
+
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
131
|
+
type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
132
|
+
iconLeft = input(null, ...(ngDevMode ? [{ debugName: "iconLeft" }] : /* istanbul ignore next */ []));
|
|
133
|
+
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
|
|
134
|
+
srOnlyLabel = input(false, ...(ngDevMode ? [{ debugName: "srOnlyLabel" }] : /* istanbul ignore next */ []));
|
|
135
|
+
formId = input(null, ...(ngDevMode ? [{ debugName: "formId" }] : /* istanbul ignore next */ []));
|
|
136
136
|
clickEvent = output();
|
|
137
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
138
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
137
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
138
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernButton, isStandalone: true, selector: "kern-button", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, iconLeft: { classPropertyName: "iconLeft", publicName: "iconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, srOnlyLabel: { classPropertyName: "srOnlyLabel", publicName: "srOnlyLabel", isSignal: true, isRequired: false, transformFunction: null }, formId: { classPropertyName: "formId", publicName: "formId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<button\n class=\"kern-btn kern-btn--{{ variant() }}\"\n [class.kern-btn--block]=\"block()\"\n [type]=\"type()\"\n [disabled]=\"disabled()\"\n (click)=\"clickEvent.emit($event)\"\n [attr.form]=\"formId() || null\"\n>\n @if (iconLeft()) {\n <span class=\"kern-icon kern-icon--{{ iconLeft() }}\" aria-hidden=\"true\"></span>\n }\n <span kernLabel [srOnly]=\"srOnlyLabel()\"><ng-content /></span>\n @if (iconRight()) {\n <span class=\"kern-icon kern-icon--{{ iconRight() }}\" aria-hidden=\"true\"></span>\n }\n</button>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
139
139
|
}
|
|
140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
140
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernButton, decorators: [{
|
|
141
141
|
type: Component,
|
|
142
142
|
args: [{ selector: 'kern-button', imports: [KernLabel], template: "<button\n class=\"kern-btn kern-btn--{{ variant() }}\"\n [class.kern-btn--block]=\"block()\"\n [type]=\"type()\"\n [disabled]=\"disabled()\"\n (click)=\"clickEvent.emit($event)\"\n [attr.form]=\"formId() || null\"\n>\n @if (iconLeft()) {\n <span class=\"kern-icon kern-icon--{{ iconLeft() }}\" aria-hidden=\"true\"></span>\n }\n <span kernLabel [srOnly]=\"srOnlyLabel()\"><ng-content /></span>\n @if (iconRight()) {\n <span class=\"kern-icon kern-icon--{{ iconRight() }}\" aria-hidden=\"true\"></span>\n }\n</button>\n", styles: [":host{display:contents}\n"] }]
|
|
143
143
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], block: [{ type: i0.Input, args: [{ isSignal: true, alias: "block", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], iconLeft: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconLeft", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], srOnlyLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "srOnlyLabel", required: false }] }], formId: [{ type: i0.Input, args: [{ isSignal: true, alias: "formId", required: false }] }], clickEvent: [{ type: i0.Output, args: ["clickEvent"] }] } });
|
|
@@ -164,10 +164,10 @@ class ScrollLockService {
|
|
|
164
164
|
isLocked() {
|
|
165
165
|
return this.lockCount > 0;
|
|
166
166
|
}
|
|
167
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
168
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
167
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: ScrollLockService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
168
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: ScrollLockService, providedIn: 'root' });
|
|
169
169
|
}
|
|
170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
170
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: ScrollLockService, decorators: [{
|
|
171
171
|
type: Injectable,
|
|
172
172
|
args: [{
|
|
173
173
|
providedIn: 'root'
|
|
@@ -175,19 +175,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
175
175
|
}] });
|
|
176
176
|
|
|
177
177
|
class KernDialog {
|
|
178
|
-
dialogId = input(...(ngDevMode ? [undefined, { debugName: "dialogId" }] : []));
|
|
179
|
-
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
180
|
-
btnCloseLabelText = input('Schließen', ...(ngDevMode ? [{ debugName: "btnCloseLabelText" }] : []));
|
|
181
|
-
btnPrimaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryLabelText" }] : []));
|
|
182
|
-
btnSecondaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryLabelText" }] : []));
|
|
183
|
-
formId = input(null, ...(ngDevMode ? [{ debugName: "formId" }] : []));
|
|
184
|
-
forceBodyScrollLock = input(false, ...(ngDevMode ? [{ debugName: "forceBodyScrollLock" }] : []));
|
|
178
|
+
dialogId = input(...(ngDevMode ? [undefined, { debugName: "dialogId" }] : /* istanbul ignore next */ []));
|
|
179
|
+
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
180
|
+
btnCloseLabelText = input('Schließen', ...(ngDevMode ? [{ debugName: "btnCloseLabelText" }] : /* istanbul ignore next */ []));
|
|
181
|
+
btnPrimaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryLabelText" }] : /* istanbul ignore next */ []));
|
|
182
|
+
btnSecondaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryLabelText" }] : /* istanbul ignore next */ []));
|
|
183
|
+
formId = input(null, ...(ngDevMode ? [{ debugName: "formId" }] : /* istanbul ignore next */ []));
|
|
184
|
+
forceBodyScrollLock = input(false, ...(ngDevMode ? [{ debugName: "forceBodyScrollLock" }] : /* istanbul ignore next */ []));
|
|
185
185
|
cancelEvent = output();
|
|
186
186
|
btnPrimaryClickEvent = output();
|
|
187
187
|
btnSecondaryClickEvent = output();
|
|
188
188
|
generatedId = inject(UniqueIdService).getUniqueId('dialog');
|
|
189
189
|
scrollLockService = inject(ScrollLockService);
|
|
190
|
-
effectiveId = computed(() => this.dialogId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
190
|
+
effectiveId = computed(() => this.dialogId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
191
191
|
dialog = viewChild.required('dialog');
|
|
192
192
|
bodyScrollIsLocked = false;
|
|
193
193
|
ngOnDestroy() {
|
|
@@ -210,41 +210,41 @@ class KernDialog {
|
|
|
210
210
|
this.scrollLockService.unlock();
|
|
211
211
|
}
|
|
212
212
|
}
|
|
213
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
214
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
213
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
214
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernDialog, isStandalone: true, selector: "kern-dialog", inputs: { dialogId: { classPropertyName: "dialogId", publicName: "dialogId", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, btnCloseLabelText: { classPropertyName: "btnCloseLabelText", publicName: "btnCloseLabelText", isSignal: true, isRequired: false, transformFunction: null }, btnPrimaryLabelText: { classPropertyName: "btnPrimaryLabelText", publicName: "btnPrimaryLabelText", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryLabelText: { classPropertyName: "btnSecondaryLabelText", publicName: "btnSecondaryLabelText", isSignal: true, isRequired: false, transformFunction: null }, formId: { classPropertyName: "formId", publicName: "formId", isSignal: true, isRequired: false, transformFunction: null }, forceBodyScrollLock: { classPropertyName: "forceBodyScrollLock", publicName: "forceBodyScrollLock", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cancelEvent: "cancelEvent", btnPrimaryClickEvent: "btnPrimaryClickEvent", btnSecondaryClickEvent: "btnSecondaryClickEvent" }, viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n #dialog\n [id]=\"effectiveId()\"\n class=\"kern-dialog\"\n [attr.aria-describedby]=\"effectiveId() + '_heading'\"\n (cancel)=\"cancelEvent.emit($event)\"\n (close)=\"unlockBodyScroll()\"\n>\n <header class=\"kern-dialog__header\">\n <h2 kernTitle size=\"large\" id=\"{{ effectiveId() }}_heading\">{{ title() }}</h2>\n <kern-button variant=\"tertiary\" iconLeft=\"close\" [srOnlyLabel]=\"true\" (clickEvent)=\"dialog.close()\">\n {{ btnCloseLabelText() }}\n </kern-button>\n </header>\n <section class=\"kern-dialog__body\">\n <ng-content />\n </section>\n @if (btnPrimaryLabelText() || btnSecondaryLabelText()) {\n <footer class=\"kern-dialog__footer\">\n @if (btnSecondaryLabelText()) {\n <kern-button variant=\"secondary\" (clickEvent)=\"btnSecondaryClickEvent.emit($event)\">\n {{ btnSecondaryLabelText() }}\n </kern-button>\n }\n @if (btnPrimaryLabelText()) {\n <kern-button\n [type]=\"formId() ? 'submit' : 'button'\"\n [formId]=\"formId()\"\n (clickEvent)=\"btnPrimaryClickEvent.emit($event)\"\n >\n {{ btnPrimaryLabelText() }}\n </kern-button>\n }\n </footer>\n }\n</dialog>\n", dependencies: [{ kind: "component", type: KernButton, selector: "kern-button", inputs: ["variant", "block", "disabled", "type", "iconLeft", "iconRight", "srOnlyLabel", "formId"], outputs: ["clickEvent"] }, { kind: "directive", type: KernTitle, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: ["size"] }] });
|
|
215
215
|
}
|
|
216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
216
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernDialog, decorators: [{
|
|
217
217
|
type: Component,
|
|
218
218
|
args: [{ selector: 'kern-dialog', imports: [KernButton, KernTitle], template: "<dialog\n #dialog\n [id]=\"effectiveId()\"\n class=\"kern-dialog\"\n [attr.aria-describedby]=\"effectiveId() + '_heading'\"\n (cancel)=\"cancelEvent.emit($event)\"\n (close)=\"unlockBodyScroll()\"\n>\n <header class=\"kern-dialog__header\">\n <h2 kernTitle size=\"large\" id=\"{{ effectiveId() }}_heading\">{{ title() }}</h2>\n <kern-button variant=\"tertiary\" iconLeft=\"close\" [srOnlyLabel]=\"true\" (clickEvent)=\"dialog.close()\">\n {{ btnCloseLabelText() }}\n </kern-button>\n </header>\n <section class=\"kern-dialog__body\">\n <ng-content />\n </section>\n @if (btnPrimaryLabelText() || btnSecondaryLabelText()) {\n <footer class=\"kern-dialog__footer\">\n @if (btnSecondaryLabelText()) {\n <kern-button variant=\"secondary\" (clickEvent)=\"btnSecondaryClickEvent.emit($event)\">\n {{ btnSecondaryLabelText() }}\n </kern-button>\n }\n @if (btnPrimaryLabelText()) {\n <kern-button\n [type]=\"formId() ? 'submit' : 'button'\"\n [formId]=\"formId()\"\n (clickEvent)=\"btnPrimaryClickEvent.emit($event)\"\n >\n {{ btnPrimaryLabelText() }}\n </kern-button>\n }\n </footer>\n }\n</dialog>\n" }]
|
|
219
219
|
}], propDecorators: { dialogId: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogId", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], btnCloseLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnCloseLabelText", required: false }] }], btnPrimaryLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnPrimaryLabelText", required: false }] }], btnSecondaryLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryLabelText", required: false }] }], formId: [{ type: i0.Input, args: [{ isSignal: true, alias: "formId", required: false }] }], forceBodyScrollLock: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceBodyScrollLock", required: false }] }], cancelEvent: [{ type: i0.Output, args: ["cancelEvent"] }], btnPrimaryClickEvent: [{ type: i0.Output, args: ["btnPrimaryClickEvent"] }], btnSecondaryClickEvent: [{ type: i0.Output, args: ["btnSecondaryClickEvent"] }], dialog: [{ type: i0.ViewChild, args: ['dialog', { isSignal: true }] }] } });
|
|
220
220
|
|
|
221
221
|
class KernLoader {
|
|
222
|
-
text = input('Wird geladen...', ...(ngDevMode ? [{ debugName: "text" }] : []));
|
|
223
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
224
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
222
|
+
text = input('Wird geladen...', ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
223
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernLoader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
224
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernLoader, isStandalone: true, selector: "kern-loader", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"kern-loader kern-loader--visible\" role=\"status\">\n <span class=\"kern-sr-only\">{{ text() }}</span>\n</div>\n" });
|
|
225
225
|
}
|
|
226
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
226
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernLoader, decorators: [{
|
|
227
227
|
type: Component,
|
|
228
228
|
args: [{ selector: 'kern-loader', template: "<div class=\"kern-loader kern-loader--visible\" role=\"status\">\n <span class=\"kern-sr-only\">{{ text() }}</span>\n</div>\n" }]
|
|
229
229
|
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }] } });
|
|
230
230
|
|
|
231
231
|
class KernBadge {
|
|
232
|
-
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : []));
|
|
233
|
-
icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
|
|
234
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
235
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
232
|
+
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
233
|
+
icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
234
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
235
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernBadge, isStandalone: true, selector: "kern-badge", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span class=\"kern-badge kern-badge--{{ variant() }}\">\n @if (icon()) {\n <kern-icon [name]=\"icon()!\" />\n }\n <span kernLabel size=\"small\">\n <ng-content />\n </span>\n</span>\n", dependencies: [{ kind: "component", type: KernIcon, selector: "kern-icon", inputs: ["name", "ariaHidden", "size"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
236
236
|
}
|
|
237
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernBadge, decorators: [{
|
|
238
238
|
type: Component,
|
|
239
239
|
args: [{ selector: 'kern-badge', imports: [KernIcon, KernLabel], template: "<span class=\"kern-badge kern-badge--{{ variant() }}\">\n @if (icon()) {\n <kern-icon [name]=\"icon()!\" />\n }\n <span kernLabel size=\"small\">\n <ng-content />\n </span>\n</span>\n" }]
|
|
240
240
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
|
|
241
241
|
|
|
242
242
|
class KernPreline {
|
|
243
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
244
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
245
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
243
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
244
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernPreline, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
245
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.2", type: KernPreline, isStandalone: true, selector: "h1[kernPreline], h2[kernPreline], h3[kernPreline], h4[kernPreline], h5[kernPreline], h6[kernPreline], span[kernPreline], p[kernPreline]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-preline--small": "size() === \"small\"", "class.kern-preline--large": "size() === \"large\"" }, classAttribute: "kern-preline" }, ngImport: i0 });
|
|
246
246
|
}
|
|
247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
247
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernPreline, decorators: [{
|
|
248
248
|
type: Directive,
|
|
249
249
|
args: [{
|
|
250
250
|
host: {
|
|
@@ -258,11 +258,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
258
258
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
259
259
|
|
|
260
260
|
class KernSubline {
|
|
261
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
262
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
263
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
261
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
262
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernSubline, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
263
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.2", type: KernSubline, isStandalone: true, selector: "h1[kernSubline], h2[kernSubline], h3[kernSubline], h4[kernSubline], h5[kernSubline], h6[kernSubline], span[kernSubline], p[kernSubline]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-subline--small": "size() === \"small\"", "class.kern-subline--large": "size() === \"large\"" }, classAttribute: "kern-subline" }, ngImport: i0 });
|
|
264
264
|
}
|
|
265
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
265
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernSubline, decorators: [{
|
|
266
266
|
type: Directive,
|
|
267
267
|
args: [{
|
|
268
268
|
host: {
|
|
@@ -276,77 +276,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
276
276
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
277
277
|
|
|
278
278
|
class KernCard {
|
|
279
|
-
title = input(null, ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
280
|
-
titleLinkHref = input(null, ...(ngDevMode ? [{ debugName: "titleLinkHref" }] : []));
|
|
281
|
-
titleLinkTarget = input('_self', ...(ngDevMode ? [{ debugName: "titleLinkTarget" }] : []));
|
|
282
|
-
preline = input(null, ...(ngDevMode ? [{ debugName: "preline" }] : []));
|
|
283
|
-
subline = input(null, ...(ngDevMode ? [{ debugName: "subline" }] : []));
|
|
284
|
-
imgSrc = input(null, ...(ngDevMode ? [{ debugName: "imgSrc" }] : []));
|
|
285
|
-
imgAlt = input(null, ...(ngDevMode ? [{ debugName: "imgAlt" }] : []));
|
|
286
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
287
|
-
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : []));
|
|
288
|
-
btnPrimaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryLabelText" }] : []));
|
|
289
|
-
btnSecondaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryLabelText" }] : []));
|
|
279
|
+
title = input(null, ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
280
|
+
titleLinkHref = input(null, ...(ngDevMode ? [{ debugName: "titleLinkHref" }] : /* istanbul ignore next */ []));
|
|
281
|
+
titleLinkTarget = input('_self', ...(ngDevMode ? [{ debugName: "titleLinkTarget" }] : /* istanbul ignore next */ []));
|
|
282
|
+
preline = input(null, ...(ngDevMode ? [{ debugName: "preline" }] : /* istanbul ignore next */ []));
|
|
283
|
+
subline = input(null, ...(ngDevMode ? [{ debugName: "subline" }] : /* istanbul ignore next */ []));
|
|
284
|
+
imgSrc = input(null, ...(ngDevMode ? [{ debugName: "imgSrc" }] : /* istanbul ignore next */ []));
|
|
285
|
+
imgAlt = input(null, ...(ngDevMode ? [{ debugName: "imgAlt" }] : /* istanbul ignore next */ []));
|
|
286
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
287
|
+
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
288
|
+
btnPrimaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryLabelText" }] : /* istanbul ignore next */ []));
|
|
289
|
+
btnSecondaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryLabelText" }] : /* istanbul ignore next */ []));
|
|
290
290
|
titleLinkClickEvent = output();
|
|
291
291
|
btnPrimaryClickEvent = output();
|
|
292
292
|
btnSecondaryClickEvent = output();
|
|
293
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
294
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
293
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
294
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernCard, isStandalone: true, selector: "kern-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, titleLinkHref: { classPropertyName: "titleLinkHref", publicName: "titleLinkHref", isSignal: true, isRequired: false, transformFunction: null }, titleLinkTarget: { classPropertyName: "titleLinkTarget", publicName: "titleLinkTarget", isSignal: true, isRequired: false, transformFunction: null }, preline: { classPropertyName: "preline", publicName: "preline", isSignal: true, isRequired: false, transformFunction: null }, subline: { classPropertyName: "subline", publicName: "subline", isSignal: true, isRequired: false, transformFunction: null }, imgSrc: { classPropertyName: "imgSrc", publicName: "imgSrc", isSignal: true, isRequired: false, transformFunction: null }, imgAlt: { classPropertyName: "imgAlt", publicName: "imgAlt", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, btnPrimaryLabelText: { classPropertyName: "btnPrimaryLabelText", publicName: "btnPrimaryLabelText", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryLabelText: { classPropertyName: "btnSecondaryLabelText", publicName: "btnSecondaryLabelText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { titleLinkClickEvent: "titleLinkClickEvent", btnPrimaryClickEvent: "btnPrimaryClickEvent", btnSecondaryClickEvent: "btnSecondaryClickEvent" }, ngImport: i0, template: "<article\n class=\"kern-card\"\n [class.kern-card--active]=\"title() && titleLinkHref()\"\n [class.kern-card--small]=\"size() === 'small'\"\n [class.kern-card--large]=\"size() === 'large'\"\n>\n @if (imgSrc()) {\n <div class=\"kern-card__media\">\n <img [src]=\"imgSrc()\" [attr.alt]=\"imgAlt()\" />\n </div>\n }\n <div class=\"kern-card__container\">\n @if (title() || preline() || subline()) {\n <header class=\"kern-card__header\">\n @if (preline()) {\n <p kernPreline>{{ preline() }}</p>\n }\n @if (title()) {\n <ng-template #headingContent>\n @if (titleLinkHref()) {\n <a\n [href]=\"titleLinkHref()\"\n class=\"kern-link--stretched\"\n [target]=\"titleLinkTarget()\"\n [attr.rel]=\"titleLinkTarget() === '_blank' ? 'noopener noreferrer' : null\"\n (click)=\"titleLinkClickEvent.emit($event)\"\n >\n {{ title() }}\n </a>\n } @else {\n {{ title() }}\n }\n </ng-template>\n\n @switch (headingLevel()) {\n @case ('1') {\n <h1 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h1>\n }\n @case ('2') {\n <h2 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h2>\n }\n @case ('3') {\n <h3 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h3>\n }\n @case ('4') {\n <h4 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h4>\n }\n @case ('5') {\n <h5 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h5>\n }\n }\n }\n @if (subline()) {\n @switch (headingLevel()) {\n @case ('1') {\n <h2 kernSubline>{{ subline() }}</h2>\n }\n @case ('2') {\n <h3 kernSubline>{{ subline() }}</h3>\n }\n @case ('3') {\n <h4 kernSubline>{{ subline() }}</h4>\n }\n @case ('4') {\n <h5 kernSubline>{{ subline() }}</h5>\n }\n @case ('5') {\n <h6 kernSubline>{{ subline() }}</h6>\n }\n }\n }\n </header>\n }\n <section class=\"kern-card__body\">\n <ng-content />\n </section>\n @if (btnPrimaryLabelText() || btnSecondaryLabelText()) {\n <footer class=\"kern-card__footer\">\n @if (btnPrimaryLabelText()) {\n <kern-button (clickEvent)=\"btnPrimaryClickEvent.emit($event)\">\n {{ btnPrimaryLabelText() }}\n </kern-button>\n }\n @if (btnSecondaryLabelText()) {\n <kern-button variant=\"secondary\" (clickEvent)=\"btnSecondaryClickEvent.emit($event)\">\n {{ btnSecondaryLabelText() }}\n </kern-button>\n }\n </footer>\n }\n </div>\n</article>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: KernPreline, selector: "h1[kernPreline], h2[kernPreline], h3[kernPreline], h4[kernPreline], h5[kernPreline], h6[kernPreline], span[kernPreline], p[kernPreline]", inputs: ["size"] }, { kind: "directive", type: KernTitle, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: ["size"] }, { kind: "directive", type: KernSubline, selector: "h1[kernSubline], h2[kernSubline], h3[kernSubline], h4[kernSubline], h5[kernSubline], h6[kernSubline], span[kernSubline], p[kernSubline]", inputs: ["size"] }, { kind: "component", type: KernButton, selector: "kern-button", inputs: ["variant", "block", "disabled", "type", "iconLeft", "iconRight", "srOnlyLabel", "formId"], outputs: ["clickEvent"] }] });
|
|
295
295
|
}
|
|
296
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
296
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernCard, decorators: [{
|
|
297
297
|
type: Component,
|
|
298
298
|
args: [{ selector: 'kern-card', imports: [NgTemplateOutlet, KernPreline, KernTitle, KernSubline, KernButton], template: "<article\n class=\"kern-card\"\n [class.kern-card--active]=\"title() && titleLinkHref()\"\n [class.kern-card--small]=\"size() === 'small'\"\n [class.kern-card--large]=\"size() === 'large'\"\n>\n @if (imgSrc()) {\n <div class=\"kern-card__media\">\n <img [src]=\"imgSrc()\" [attr.alt]=\"imgAlt()\" />\n </div>\n }\n <div class=\"kern-card__container\">\n @if (title() || preline() || subline()) {\n <header class=\"kern-card__header\">\n @if (preline()) {\n <p kernPreline>{{ preline() }}</p>\n }\n @if (title()) {\n <ng-template #headingContent>\n @if (titleLinkHref()) {\n <a\n [href]=\"titleLinkHref()\"\n class=\"kern-link--stretched\"\n [target]=\"titleLinkTarget()\"\n [attr.rel]=\"titleLinkTarget() === '_blank' ? 'noopener noreferrer' : null\"\n (click)=\"titleLinkClickEvent.emit($event)\"\n >\n {{ title() }}\n </a>\n } @else {\n {{ title() }}\n }\n </ng-template>\n\n @switch (headingLevel()) {\n @case ('1') {\n <h1 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h1>\n }\n @case ('2') {\n <h2 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h2>\n }\n @case ('3') {\n <h3 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h3>\n }\n @case ('4') {\n <h4 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h4>\n }\n @case ('5') {\n <h5 kernTitle><ng-container [ngTemplateOutlet]=\"headingContent\" /></h5>\n }\n }\n }\n @if (subline()) {\n @switch (headingLevel()) {\n @case ('1') {\n <h2 kernSubline>{{ subline() }}</h2>\n }\n @case ('2') {\n <h3 kernSubline>{{ subline() }}</h3>\n }\n @case ('3') {\n <h4 kernSubline>{{ subline() }}</h4>\n }\n @case ('4') {\n <h5 kernSubline>{{ subline() }}</h5>\n }\n @case ('5') {\n <h6 kernSubline>{{ subline() }}</h6>\n }\n }\n }\n </header>\n }\n <section class=\"kern-card__body\">\n <ng-content />\n </section>\n @if (btnPrimaryLabelText() || btnSecondaryLabelText()) {\n <footer class=\"kern-card__footer\">\n @if (btnPrimaryLabelText()) {\n <kern-button (clickEvent)=\"btnPrimaryClickEvent.emit($event)\">\n {{ btnPrimaryLabelText() }}\n </kern-button>\n }\n @if (btnSecondaryLabelText()) {\n <kern-button variant=\"secondary\" (clickEvent)=\"btnSecondaryClickEvent.emit($event)\">\n {{ btnSecondaryLabelText() }}\n </kern-button>\n }\n </footer>\n }\n </div>\n</article>\n", styles: [":host{display:contents}\n"] }]
|
|
299
299
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], titleLinkHref: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleLinkHref", required: false }] }], titleLinkTarget: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleLinkTarget", required: false }] }], preline: [{ type: i0.Input, args: [{ isSignal: true, alias: "preline", required: false }] }], subline: [{ type: i0.Input, args: [{ isSignal: true, alias: "subline", required: false }] }], imgSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgSrc", required: false }] }], imgAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgAlt", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], btnPrimaryLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnPrimaryLabelText", required: false }] }], btnSecondaryLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryLabelText", required: false }] }], titleLinkClickEvent: [{ type: i0.Output, args: ["titleLinkClickEvent"] }], btnPrimaryClickEvent: [{ type: i0.Output, args: ["btnPrimaryClickEvent"] }], btnSecondaryClickEvent: [{ type: i0.Output, args: ["btnSecondaryClickEvent"] }] } });
|
|
300
300
|
|
|
301
301
|
class KernDivider {
|
|
302
|
-
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : []));
|
|
303
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
304
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
302
|
+
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : /* istanbul ignore next */ []));
|
|
303
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
304
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernDivider, isStandalone: true, selector: "kern-divider", inputs: { ariaHidden: { classPropertyName: "ariaHidden", publicName: "ariaHidden", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<hr class=\"kern-divider\" [attr.aria-hidden]=\"ariaHidden()\" />\n" });
|
|
305
305
|
}
|
|
306
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
306
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernDivider, decorators: [{
|
|
307
307
|
type: Component,
|
|
308
308
|
args: [{ selector: 'kern-divider', template: "<hr class=\"kern-divider\" [attr.aria-hidden]=\"ariaHidden()\" />\n" }]
|
|
309
309
|
}], propDecorators: { ariaHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaHidden", required: false }] }] } });
|
|
310
310
|
|
|
311
311
|
class KernLink {
|
|
312
|
-
href = input(null, ...(ngDevMode ? [{ debugName: "href" }] : []));
|
|
313
|
-
target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : []));
|
|
314
|
-
small = input(false, ...(ngDevMode ? [{ debugName: "small" }] : []));
|
|
315
|
-
stretched = input(false, ...(ngDevMode ? [{ debugName: "stretched" }] : []));
|
|
316
|
-
iconLeft = input(null, ...(ngDevMode ? [{ debugName: "iconLeft" }] : []));
|
|
317
|
-
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : []));
|
|
318
|
-
linkDescribedBy = input(null, ...(ngDevMode ? [{ debugName: "linkDescribedBy" }] : []));
|
|
312
|
+
href = input(null, ...(ngDevMode ? [{ debugName: "href" }] : /* istanbul ignore next */ []));
|
|
313
|
+
target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
|
|
314
|
+
small = input(false, ...(ngDevMode ? [{ debugName: "small" }] : /* istanbul ignore next */ []));
|
|
315
|
+
stretched = input(false, ...(ngDevMode ? [{ debugName: "stretched" }] : /* istanbul ignore next */ []));
|
|
316
|
+
iconLeft = input(null, ...(ngDevMode ? [{ debugName: "iconLeft" }] : /* istanbul ignore next */ []));
|
|
317
|
+
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
|
|
318
|
+
linkDescribedBy = input(null, ...(ngDevMode ? [{ debugName: "linkDescribedBy" }] : /* istanbul ignore next */ []));
|
|
319
319
|
clickEvent = output();
|
|
320
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
321
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
320
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernLink, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
321
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernLink, isStandalone: true, selector: "kern-link", inputs: { href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, small: { classPropertyName: "small", publicName: "small", isSignal: true, isRequired: false, transformFunction: null }, stretched: { classPropertyName: "stretched", publicName: "stretched", isSignal: true, isRequired: false, transformFunction: null }, iconLeft: { classPropertyName: "iconLeft", publicName: "iconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, linkDescribedBy: { classPropertyName: "linkDescribedBy", publicName: "linkDescribedBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<a\n class=\"kern-link\"\n [class.kern-link--small]=\"small()\"\n [class.kern-link--stretched]=\"stretched()\"\n [href]=\"href()\"\n [target]=\"target()\"\n [attr.rel]=\"target() === '_blank' ? 'noopener noreferrer' : null\"\n [attr.aria-describedby]=\"linkDescribedBy() || null\"\n (click)=\"clickEvent.emit($event)\"\n>\n @if (iconLeft()) {\n <kern-icon [name]=\"iconLeft()!\"></kern-icon>\n }\n <ng-content />\n @if (iconRight()) {\n <kern-icon [name]=\"iconRight()!\"></kern-icon>\n }\n</a>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: KernIcon, selector: "kern-icon", inputs: ["name", "ariaHidden", "size"] }] });
|
|
322
322
|
}
|
|
323
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
323
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernLink, decorators: [{
|
|
324
324
|
type: Component,
|
|
325
325
|
args: [{ selector: 'kern-link', imports: [KernIcon], template: "<a\n class=\"kern-link\"\n [class.kern-link--small]=\"small()\"\n [class.kern-link--stretched]=\"stretched()\"\n [href]=\"href()\"\n [target]=\"target()\"\n [attr.rel]=\"target() === '_blank' ? 'noopener noreferrer' : null\"\n [attr.aria-describedby]=\"linkDescribedBy() || null\"\n (click)=\"clickEvent.emit($event)\"\n>\n @if (iconLeft()) {\n <kern-icon [name]=\"iconLeft()!\"></kern-icon>\n }\n <ng-content />\n @if (iconRight()) {\n <kern-icon [name]=\"iconRight()!\"></kern-icon>\n }\n</a>\n", styles: [":host{display:contents}\n"] }]
|
|
326
326
|
}], propDecorators: { href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], small: [{ type: i0.Input, args: [{ isSignal: true, alias: "small", required: false }] }], stretched: [{ type: i0.Input, args: [{ isSignal: true, alias: "stretched", required: false }] }], iconLeft: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconLeft", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], linkDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "linkDescribedBy", required: false }] }], clickEvent: [{ type: i0.Output, args: ["clickEvent"] }] } });
|
|
327
327
|
|
|
328
328
|
class KernProgress {
|
|
329
|
-
progressId = input(...(ngDevMode ? [undefined, { debugName: "progressId" }] : []));
|
|
330
|
-
value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
331
|
-
max = input(100, ...(ngDevMode ? [{ debugName: "max" }] : []));
|
|
332
|
-
label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
333
|
-
labelPosition = input('top', ...(ngDevMode ? [{ debugName: "labelPosition" }] : []));
|
|
329
|
+
progressId = input(...(ngDevMode ? [undefined, { debugName: "progressId" }] : /* istanbul ignore next */ []));
|
|
330
|
+
value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
331
|
+
max = input(100, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
332
|
+
label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
333
|
+
labelPosition = input('top', ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
|
|
334
334
|
generatedId = inject(UniqueIdService).getUniqueId('progress');
|
|
335
|
-
effectiveId = computed(() => this.progressId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
336
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
337
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
335
|
+
effectiveId = computed(() => this.progressId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
336
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
337
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernProgress, isStandalone: true, selector: "kern-progress", inputs: { progressId: { classPropertyName: "progressId", publicName: "progressId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kern-progress" }, ngImport: i0, template: "@if (label() && labelPosition() === 'top') {\n <label kernLabel [for]=\"effectiveId()\">{{ label() }}</label>\n}\n<progress [value]=\"value()\" [max]=\"max()\" [id]=\"effectiveId()\"></progress>\n@if (label() && labelPosition() === 'bottom') {\n <label kernLabel [for]=\"effectiveId()\">{{ label() }}</label>\n}\n", dependencies: [{ kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
338
338
|
}
|
|
339
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
339
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernProgress, decorators: [{
|
|
340
340
|
type: Component,
|
|
341
341
|
args: [{ selector: 'kern-progress', imports: [KernLabel], host: { class: 'kern-progress' }, template: "@if (label() && labelPosition() === 'top') {\n <label kernLabel [for]=\"effectiveId()\">{{ label() }}</label>\n}\n<progress [value]=\"value()\" [max]=\"max()\" [id]=\"effectiveId()\"></progress>\n@if (label() && labelPosition() === 'bottom') {\n <label kernLabel [for]=\"effectiveId()\">{{ label() }}</label>\n}\n" }]
|
|
342
342
|
}], propDecorators: { progressId: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressId", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }] } });
|
|
343
343
|
|
|
344
344
|
class KernContainer {
|
|
345
|
-
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : []));
|
|
346
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
347
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
345
|
+
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : /* istanbul ignore next */ []));
|
|
346
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
347
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernContainer, isStandalone: true, selector: "kern-container", inputs: { fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-container": "!fluid()", "class.kern-container-fluid": "fluid()" } }, ngImport: i0, template: '<ng-content />', isInline: true, styles: [":host{display:block}\n"] });
|
|
348
348
|
}
|
|
349
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernContainer, decorators: [{
|
|
350
350
|
type: Component,
|
|
351
351
|
args: [{ selector: 'kern-container', host: {
|
|
352
352
|
'[class.kern-container]': '!fluid()',
|
|
@@ -355,11 +355,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
355
355
|
}], propDecorators: { fluid: [{ type: i0.Input, args: [{ isSignal: true, alias: "fluid", required: false }] }] } });
|
|
356
356
|
|
|
357
357
|
class KernKopfzeile {
|
|
358
|
-
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : []));
|
|
359
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
360
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
358
|
+
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : /* istanbul ignore next */ []));
|
|
359
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernKopfzeile, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
360
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernKopfzeile, isStandalone: true, selector: "kern-kopfzeile", inputs: { fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kern-kopfzeile" }, ngImport: i0, template: "<kern-container [fluid]=\"fluid()\">\n <div class=\"kern-kopfzeile__content\">\n <span class=\"kern-kopfzeile__flagge\" aria-hidden=\"true\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 16\">\n <path fill=\"#000\" d=\"M0 .5h24v5.333H0z\" />\n <path fill=\"red\" d=\"M0 5.833h24v5.333H0z\" />\n <path fill=\"#FACA2C\" d=\"M0 11.167h24V16.5H0z\" />\n </svg>\n </span>\n <span class=\"kern-kopfzeile__label\" i18n=\"@@kernAngularKit.kopfzeile.label\">\n Offizielle Website \u2013 Bundesrepublik Deutschland\n </span>\n </div>\n</kern-container>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: KernContainer, selector: "kern-container", inputs: ["fluid"] }] });
|
|
361
361
|
}
|
|
362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
362
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernKopfzeile, decorators: [{
|
|
363
363
|
type: Component,
|
|
364
364
|
args: [{ selector: 'kern-kopfzeile', imports: [KernContainer], host: { class: 'kern-kopfzeile' }, template: "<kern-container [fluid]=\"fluid()\">\n <div class=\"kern-kopfzeile__content\">\n <span class=\"kern-kopfzeile__flagge\" aria-hidden=\"true\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 16\">\n <path fill=\"#000\" d=\"M0 .5h24v5.333H0z\" />\n <path fill=\"red\" d=\"M0 5.833h24v5.333H0z\" />\n <path fill=\"#FACA2C\" d=\"M0 11.167h24V16.5H0z\" />\n </svg>\n </span>\n <span class=\"kern-kopfzeile__label\" i18n=\"@@kernAngularKit.kopfzeile.label\">\n Offizielle Website \u2013 Bundesrepublik Deutschland\n </span>\n </div>\n</kern-container>\n", styles: [":host{display:block}\n"] }]
|
|
365
365
|
}], propDecorators: { fluid: [{ type: i0.Input, args: [{ isSignal: true, alias: "fluid", required: false }] }] } });
|
|
@@ -367,8 +367,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
367
367
|
class KernHeading {
|
|
368
368
|
elementRef = inject(ElementRef);
|
|
369
369
|
renderer = inject(Renderer2);
|
|
370
|
-
level = input('1', ...(ngDevMode ? [{ debugName: "level" }] : []));
|
|
371
|
-
size = input(undefined, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
370
|
+
level = input('1', ...(ngDevMode ? [{ debugName: "level" }] : /* istanbul ignore next */ []));
|
|
371
|
+
size = input(undefined, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
372
372
|
// Compute the CSS class based on level (with default size mapping) and optional size override
|
|
373
373
|
cssClass = computed(() => {
|
|
374
374
|
const sizeOverride = this.size();
|
|
@@ -393,7 +393,7 @@ class KernHeading {
|
|
|
393
393
|
// Default case
|
|
394
394
|
return 'kern-heading-medium';
|
|
395
395
|
}
|
|
396
|
-
}, ...(ngDevMode ? [{ debugName: "cssClass" }] : []));
|
|
396
|
+
}, ...(ngDevMode ? [{ debugName: "cssClass" }] : /* istanbul ignore next */ []));
|
|
397
397
|
ngAfterViewInit() {
|
|
398
398
|
const hostElement = this.elementRef.nativeElement;
|
|
399
399
|
const level = this.level();
|
|
@@ -420,21 +420,21 @@ class KernHeading {
|
|
|
420
420
|
};
|
|
421
421
|
return levelToSizeMap[level] || 'medium';
|
|
422
422
|
}
|
|
423
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
424
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
423
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernHeading, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
424
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernHeading, isStandalone: true, selector: "kern-heading", inputs: { level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host{display:contents}\n"] });
|
|
425
425
|
}
|
|
426
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
426
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernHeading, decorators: [{
|
|
427
427
|
type: Component,
|
|
428
428
|
args: [{ selector: 'kern-heading', template: `<ng-content />`, styles: [":host{display:contents}\n"] }]
|
|
429
429
|
}], propDecorators: { level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
430
430
|
|
|
431
431
|
class KernBody {
|
|
432
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
433
|
-
weight = input('default', ...(ngDevMode ? [{ debugName: "weight" }] : []));
|
|
434
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
435
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
432
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
433
|
+
weight = input('default', ...(ngDevMode ? [{ debugName: "weight" }] : /* istanbul ignore next */ []));
|
|
434
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernBody, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
435
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.2", type: KernBody, isStandalone: true, selector: "p[kernBody], span[kernBody]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, weight: { classPropertyName: "weight", publicName: "weight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-body--small": "size() === \"small\"", "class.kern-body--large": "size() === \"large\"", "class.kern-body--bold": "weight() === \"bold\"", "class.kern-body--muted": "weight() === \"muted\"" }, classAttribute: "kern-body" }, ngImport: i0 });
|
|
436
436
|
}
|
|
437
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
437
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernBody, decorators: [{
|
|
438
438
|
type: Directive,
|
|
439
439
|
args: [{
|
|
440
440
|
host: {
|
|
@@ -450,12 +450,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
450
450
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], weight: [{ type: i0.Input, args: [{ isSignal: true, alias: "weight", required: false }] }] } });
|
|
451
451
|
|
|
452
452
|
class KernList {
|
|
453
|
-
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
454
|
-
type = input('simple', ...(ngDevMode ? [{ debugName: "type" }] : []));
|
|
455
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
456
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
453
|
+
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
454
|
+
type = input('simple', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
455
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernList, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
456
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.2", type: KernList, isStandalone: true, selector: "ul[kernList], ol[kernList]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-list--small": "size() === \"small\"", "class.kern-list--large": "size() === \"large\"", "class.kern-list--bullet": "type() === \"bullet\"", "class.kern-list--number": "type() === \"number\"" }, classAttribute: "kern-list" }, ngImport: i0 });
|
|
457
457
|
}
|
|
458
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
458
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernList, decorators: [{
|
|
459
459
|
type: Directive,
|
|
460
460
|
args: [{
|
|
461
461
|
host: {
|
|
@@ -471,8 +471,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
471
471
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
|
|
472
472
|
|
|
473
473
|
class ControlValueAccessorDirective {
|
|
474
|
-
value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
475
|
-
disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
474
|
+
value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
475
|
+
disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
476
476
|
onChange = (_value) => {
|
|
477
477
|
/* noop */
|
|
478
478
|
};
|
|
@@ -496,8 +496,8 @@ class ControlValueAccessorDirective {
|
|
|
496
496
|
setDisabledState(isDisabled) {
|
|
497
497
|
this.disabled.set(isDisabled);
|
|
498
498
|
}
|
|
499
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
500
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
499
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: ControlValueAccessorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
500
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.2", type: ControlValueAccessorDirective, isStandalone: true, selector: "[kernControlValueAccessor]", providers: [
|
|
501
501
|
{
|
|
502
502
|
provide: NG_VALUE_ACCESSOR,
|
|
503
503
|
useExisting: forwardRef(() => ControlValueAccessorDirective),
|
|
@@ -505,7 +505,7 @@ class ControlValueAccessorDirective {
|
|
|
505
505
|
}
|
|
506
506
|
], ngImport: i0 });
|
|
507
507
|
}
|
|
508
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
508
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: ControlValueAccessorDirective, decorators: [{
|
|
509
509
|
type: Directive,
|
|
510
510
|
args: [{
|
|
511
511
|
selector: '[kernControlValueAccessor]',
|
|
@@ -521,35 +521,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
521
521
|
|
|
522
522
|
class KernInputCheckbox {
|
|
523
523
|
cva = inject(ControlValueAccessorDirective);
|
|
524
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
525
|
-
labelTemplate = input(null, ...(ngDevMode ? [{ debugName: "labelTemplate" }] : []));
|
|
526
|
-
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
527
|
-
error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
|
|
528
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
524
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
525
|
+
labelTemplate = input(null, ...(ngDevMode ? [{ debugName: "labelTemplate" }] : /* istanbul ignore next */ []));
|
|
526
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
527
|
+
error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
|
|
528
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
529
529
|
generatedId = inject(UniqueIdService).getUniqueId('input-checkbox');
|
|
530
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
530
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
531
531
|
onChange(event) {
|
|
532
532
|
const { checked } = event.target;
|
|
533
533
|
this.cva.changeValue(checked);
|
|
534
534
|
}
|
|
535
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
536
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
535
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
536
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputCheckbox, isStandalone: true, selector: "kern-input-checkbox", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelTemplate: { classPropertyName: "labelTemplate", publicName: "labelTemplate", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-check\">\n <input\n [id]=\"effectiveId()\"\n [name]=\"effectiveId()\"\n type=\"checkbox\"\n class=\"kern-form-check__checkbox\"\n [class.kern-form-check__checkbox--error]=\"error()\"\n [disabled]=\"cva.disabled()\"\n [checked]=\"cva.value()\"\n (change)=\"onChange($event)\"\n [attr.title]=\"titleText()\"\n [attr.aria-labelledby]=\"effectiveId() + '-label'\"\n [attr.aria-invalid]=\"error() ? 'true' : null\"\n />\n\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\">\n @if (labelTemplate() !== null) {\n <ng-container [ngTemplateOutlet]=\"labelTemplate()\" />\n } @else {\n {{ labelText() ?? '' }}\n }\n </label>\n</div>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
537
537
|
}
|
|
538
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
538
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputCheckbox, decorators: [{
|
|
539
539
|
type: Component,
|
|
540
540
|
args: [{ selector: 'kern-input-checkbox', imports: [NgTemplateOutlet, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-check\">\n <input\n [id]=\"effectiveId()\"\n [name]=\"effectiveId()\"\n type=\"checkbox\"\n class=\"kern-form-check__checkbox\"\n [class.kern-form-check__checkbox--error]=\"error()\"\n [disabled]=\"cva.disabled()\"\n [checked]=\"cva.value()\"\n (change)=\"onChange($event)\"\n [attr.title]=\"titleText()\"\n [attr.aria-labelledby]=\"effectiveId() + '-label'\"\n [attr.aria-invalid]=\"error() ? 'true' : null\"\n />\n\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\">\n @if (labelTemplate() !== null) {\n <ng-container [ngTemplateOutlet]=\"labelTemplate()\" />\n } @else {\n {{ labelText() ?? '' }}\n }\n </label>\n</div>\n" }]
|
|
541
541
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelTemplate", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }] } });
|
|
542
542
|
|
|
543
543
|
class KernInputError {
|
|
544
|
-
effectiveId = input.required(...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
545
|
-
text = input.required(...(ngDevMode ? [{ debugName: "text" }] : []));
|
|
546
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
547
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
544
|
+
effectiveId = input.required(...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
545
|
+
text = input.required(...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
546
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputError, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
547
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernInputError, isStandalone: true, selector: "kern-input-error", inputs: { effectiveId: { classPropertyName: "effectiveId", publicName: "effectiveId", isSignal: true, isRequired: true, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `<p class="kern-error" [id]="effectiveId() + '-error'" role="alert">
|
|
548
548
|
<kern-icon name="danger" />
|
|
549
549
|
<span kernBody>{{ text() }}</span>
|
|
550
550
|
</p>`, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: KernIcon, selector: "kern-icon", inputs: ["name", "ariaHidden", "size"] }, { kind: "directive", type: KernBody, selector: "p[kernBody], span[kernBody]", inputs: ["size", "weight"] }] });
|
|
551
551
|
}
|
|
552
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
552
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputError, decorators: [{
|
|
553
553
|
type: Component,
|
|
554
554
|
args: [{ selector: 'kern-input-error', imports: [KernIcon, KernBody], template: `<p class="kern-error" [id]="effectiveId() + '-error'" role="alert">
|
|
555
555
|
<kern-icon name="danger" />
|
|
@@ -558,20 +558,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
558
558
|
}], propDecorators: { effectiveId: [{ type: i0.Input, args: [{ isSignal: true, alias: "effectiveId", required: true }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: true }] }] } });
|
|
559
559
|
|
|
560
560
|
class KernInputHint {
|
|
561
|
-
hint = input.required({ ...(ngDevMode ? { debugName: "hint" } : {}), transform: (value) => {
|
|
561
|
+
hint = input.required({ ...(ngDevMode ? { debugName: "hint" } : /* istanbul ignore next */ {}), transform: (value) => {
|
|
562
562
|
return {
|
|
563
563
|
template: value instanceof TemplateRef ? value : null,
|
|
564
564
|
text: typeof value === 'string' ? value : ''
|
|
565
565
|
};
|
|
566
566
|
} });
|
|
567
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
568
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
567
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputHint, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
568
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputHint, isStandalone: true, selector: "kern-input-hint", inputs: { hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "kern-hint" }, ngImport: i0, template: `@if (hint().template; as templateRef) {
|
|
569
569
|
<ng-container [ngTemplateOutlet]="templateRef" />
|
|
570
570
|
} @else {
|
|
571
571
|
{{ hint().text }}
|
|
572
572
|
}`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
573
573
|
}
|
|
574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
574
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputHint, decorators: [{
|
|
575
575
|
type: Component,
|
|
576
576
|
args: [{
|
|
577
577
|
selector: 'kern-input-hint',
|
|
@@ -586,43 +586,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
586
586
|
}], propDecorators: { hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: true }] }] } });
|
|
587
587
|
|
|
588
588
|
class KernFieldset {
|
|
589
|
-
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : []));
|
|
590
|
-
legendText = input.required(...(ngDevMode ? [{ debugName: "legendText" }] : []));
|
|
591
|
-
legendSize = input('large', ...(ngDevMode ? [{ debugName: "legendSize" }] : []));
|
|
592
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
593
|
-
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
594
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
595
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
596
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
597
|
-
horizontalAlignment = input(false, ...(ngDevMode ? [{ debugName: "horizontalAlignment" }] : []));
|
|
589
|
+
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : /* istanbul ignore next */ []));
|
|
590
|
+
legendText = input.required(...(ngDevMode ? [{ debugName: "legendText" }] : /* istanbul ignore next */ []));
|
|
591
|
+
legendSize = input('large', ...(ngDevMode ? [{ debugName: "legendSize" }] : /* istanbul ignore next */ []));
|
|
592
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
593
|
+
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
594
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
595
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
596
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
597
|
+
horizontalAlignment = input(false, ...(ngDevMode ? [{ debugName: "horizontalAlignment" }] : /* istanbul ignore next */ []));
|
|
598
598
|
generatedId = inject(UniqueIdService).getUniqueId('fieldset');
|
|
599
|
-
effectiveId = computed(() => this.fieldsetId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
599
|
+
effectiveId = computed(() => this.fieldsetId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
600
600
|
fieldsetDescribedBy = computed(() => {
|
|
601
601
|
return this.hintTemplate() !== null || this.hintText()
|
|
602
602
|
? this.effectiveId() + '-hint'
|
|
603
603
|
: null;
|
|
604
|
-
}, ...(ngDevMode ? [{ debugName: "fieldsetDescribedBy" }] : []));
|
|
605
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
606
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
604
|
+
}, ...(ngDevMode ? [{ debugName: "fieldsetDescribedBy" }] : /* istanbul ignore next */ []));
|
|
605
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernFieldset, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
606
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernFieldset, isStandalone: true, selector: "kern-fieldset", inputs: { fieldsetId: { classPropertyName: "fieldsetId", publicName: "fieldsetId", isSignal: true, isRequired: false, transformFunction: null }, legendText: { classPropertyName: "legendText", publicName: "legendText", isSignal: true, isRequired: true, transformFunction: null }, legendSize: { classPropertyName: "legendSize", publicName: "legendSize", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlignment: { classPropertyName: "horizontalAlignment", publicName: "horizontalAlignment", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<fieldset\n class=\"kern-fieldset\"\n [class.kern-fieldset--error]=\"errorText()\"\n [attr.aria-describedby]=\"fieldsetDescribedBy()\"\n [id]=\"effectiveId()\"\n>\n <legend kernLabel [size]=\"legendSize()\" [optional]=\"optional()\">\n {{ legendText() }}\n </legend>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <div class=\"kern-fieldset__body\" [class.kern-fieldset__body--horizontal]=\"horizontalAlignment()\">\n <ng-content />\n </div>\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</fieldset>\n", dependencies: [{ kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }, { kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }] });
|
|
607
607
|
}
|
|
608
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
608
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernFieldset, decorators: [{
|
|
609
609
|
type: Component,
|
|
610
610
|
args: [{ selector: 'kern-fieldset', imports: [KernLabel, KernInputError, KernInputHint], template: "<fieldset\n class=\"kern-fieldset\"\n [class.kern-fieldset--error]=\"errorText()\"\n [attr.aria-describedby]=\"fieldsetDescribedBy()\"\n [id]=\"effectiveId()\"\n>\n <legend kernLabel [size]=\"legendSize()\" [optional]=\"optional()\">\n {{ legendText() }}\n </legend>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <div class=\"kern-fieldset__body\" [class.kern-fieldset__body--horizontal]=\"horizontalAlignment()\">\n <ng-content />\n </div>\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</fieldset>\n" }]
|
|
611
611
|
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], legendText: [{ type: i0.Input, args: [{ isSignal: true, alias: "legendText", required: true }] }], legendSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "legendSize", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], horizontalAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlignment", required: false }] }] } });
|
|
612
612
|
|
|
613
613
|
class KernInputDate {
|
|
614
|
-
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : []));
|
|
615
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
616
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
617
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
618
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
619
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
620
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
614
|
+
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : /* istanbul ignore next */ []));
|
|
615
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
616
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
617
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
618
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
619
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
620
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
621
621
|
generatedId = inject(UniqueIdService).getUniqueId('fieldset-date');
|
|
622
|
-
effectiveId = computed(() => this.fieldsetId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
622
|
+
effectiveId = computed(() => this.fieldsetId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
623
623
|
inputDescribedBy = computed(() => {
|
|
624
624
|
return this.errorText() ? this.effectiveId() + '-error' : null;
|
|
625
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
625
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
626
626
|
dayInput = viewChild.required('dayInput');
|
|
627
627
|
monthInput = viewChild.required('monthInput');
|
|
628
628
|
yearInput = viewChild.required('yearInput');
|
|
@@ -793,8 +793,8 @@ class KernInputDate {
|
|
|
793
793
|
}
|
|
794
794
|
}
|
|
795
795
|
}
|
|
796
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
797
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.
|
|
796
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputDate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
797
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.2", type: KernInputDate, isStandalone: true, selector: "kern-input-date", inputs: { fieldsetId: { classPropertyName: "fieldsetId", publicName: "fieldsetId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
798
798
|
{
|
|
799
799
|
provide: NG_VALUE_ACCESSOR,
|
|
800
800
|
multi: true,
|
|
@@ -802,7 +802,7 @@ class KernInputDate {
|
|
|
802
802
|
}
|
|
803
803
|
], viewQueries: [{ propertyName: "dayInput", first: true, predicate: ["dayInput"], descendants: true, isSignal: true }, { propertyName: "monthInput", first: true, predicate: ["monthInput"], descendants: true, isSignal: true }, { propertyName: "yearInput", first: true, predicate: ["yearInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<kern-fieldset\n [fieldsetId]=\"effectiveId()\"\n [legendText]=\"labelText()\"\n legendSize=\"default\"\n [optional]=\"optional()\"\n [hintText]=\"hintText()\"\n [hintTemplate]=\"hintTemplate()\"\n [errorText]=\"errorText()\"\n [horizontalAlignment]=\"true\"\n>\n <div class=\"kern-form-input\">\n <label kernLabel [for]=\"effectiveId() + '-day'\" [id]=\"effectiveId() + '-day-label'\">\n <span i18n=\"@@kernAngularKit.inputDate.day\">Tag</span>\n </label>\n\n <input\n #dayInput\n [id]=\"effectiveId() + '-day'\"\n class=\"kern-form-input__input kern-form-input__input--width-2\"\n [class.kern-form-input__input--error]=\"errorText()\"\n type=\"text\"\n inputmode=\"numeric\"\n [readonly]=\"readonly()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n maxlength=\"2\"\n (input)=\"onInput($event, 'day')\"\n (paste)=\"onPaste($event)\"\n (change)=\"onInput($event, 'day')\"\n (keydown)=\"onKeydown($event, 'day')\"\n (blur)=\"onBlur($event, 'day')\"\n />\n </div>\n <div class=\"kern-form-input\">\n <label kernLabel [for]=\"effectiveId() + '-month'\" [id]=\"effectiveId() + '-month-label'\">\n <span i18n=\"@@kernAngularKit.inputDate.month\">Monat</span>\n </label>\n <input\n #monthInput\n [id]=\"effectiveId() + '-month'\"\n class=\"kern-form-input__input kern-form-input__input--width-2\"\n [class.kern-form-input__input--error]=\"errorText()\"\n type=\"text\"\n inputmode=\"numeric\"\n [readonly]=\"readonly()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n maxlength=\"2\"\n (input)=\"onInput($event, 'month')\"\n (paste)=\"onPaste($event)\"\n (change)=\"onInput($event, 'month')\"\n (keydown)=\"onKeydown($event, 'month')\"\n (blur)=\"onBlur($event, 'month')\"\n />\n </div>\n <div class=\"kern-form-input\">\n <label kernLabel [for]=\"effectiveId() + '-year'\" [id]=\"effectiveId() + '-year-label'\">\n <span i18n=\"@@kernAngularKit.inputDate.year\">Jahr</span>\n </label>\n <input\n #yearInput\n [id]=\"effectiveId() + '-year'\"\n class=\"kern-form-input__input kern-form-input__input--width-4\"\n [class.kern-form-input__input--error]=\"errorText()\"\n type=\"text\"\n inputmode=\"numeric\"\n [readonly]=\"readonly()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n maxlength=\"4\"\n (input)=\"onInput($event, 'year')\"\n (paste)=\"onPaste($event)\"\n (change)=\"onInput($event, 'year')\"\n (keydown)=\"onKeydown($event, 'year')\"\n (blur)=\"onBlur($event, 'year')\"\n />\n </div>\n</kern-fieldset>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }, { kind: "component", type: KernFieldset, selector: "kern-fieldset", inputs: ["fieldsetId", "legendText", "legendSize", "optional", "disabled", "hintTemplate", "hintText", "errorText", "horizontalAlignment"] }] });
|
|
804
804
|
}
|
|
805
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
805
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputDate, decorators: [{
|
|
806
806
|
type: Component,
|
|
807
807
|
args: [{ selector: 'kern-input-date', imports: [FormsModule, KernLabel, KernFieldset], providers: [
|
|
808
808
|
{
|
|
@@ -815,19 +815,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
815
815
|
|
|
816
816
|
class KernInputEmail {
|
|
817
817
|
cva = inject(ControlValueAccessorDirective);
|
|
818
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
819
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
820
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
821
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
822
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
823
|
-
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
824
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
825
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
826
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
827
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
828
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
818
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
819
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
820
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
821
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
822
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
823
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
824
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
825
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
826
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
827
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
828
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
829
829
|
generatedId = inject(UniqueIdService).getUniqueId('input-email');
|
|
830
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
830
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
831
831
|
inputDescribedBy = computed(() => {
|
|
832
832
|
const baseId = this.effectiveId();
|
|
833
833
|
const ids = [];
|
|
@@ -838,7 +838,11 @@ class KernInputEmail {
|
|
|
838
838
|
ids.push(`${baseId}-error`);
|
|
839
839
|
}
|
|
840
840
|
return ids.length ? ids.join(' ') : null;
|
|
841
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
841
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
842
|
+
onInput(event) {
|
|
843
|
+
const { value } = event.target;
|
|
844
|
+
this.cva.changeValue(value);
|
|
845
|
+
}
|
|
842
846
|
onKeydown(event) {
|
|
843
847
|
if (event.target &&
|
|
844
848
|
event.target instanceof HTMLInputElement &&
|
|
@@ -846,28 +850,28 @@ class KernInputEmail {
|
|
|
846
850
|
this.cva.markTouched();
|
|
847
851
|
}
|
|
848
852
|
}
|
|
849
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
850
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
853
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputEmail, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
854
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputEmail, isStandalone: true, selector: "kern-input-email", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"email\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n autocomplete=\"email\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }] });
|
|
851
855
|
}
|
|
852
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
856
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputEmail, decorators: [{
|
|
853
857
|
type: Component,
|
|
854
|
-
args: [{ selector: 'kern-input-email', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"email\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n
|
|
858
|
+
args: [{ selector: 'kern-input-email', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"email\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n autocomplete=\"email\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
855
859
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
856
860
|
|
|
857
861
|
class KernInputFile {
|
|
858
862
|
cva = inject(ControlValueAccessorDirective);
|
|
859
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
860
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
861
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
862
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
863
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
864
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
865
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
866
|
-
accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : []));
|
|
867
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
868
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
863
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
864
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
865
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
866
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
867
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
868
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
869
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
870
|
+
accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
871
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
872
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
869
873
|
generatedId = inject(UniqueIdService).getUniqueId('input-file');
|
|
870
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
874
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
871
875
|
inputDescribedBy = computed(() => {
|
|
872
876
|
const baseId = this.effectiveId();
|
|
873
877
|
const ids = [];
|
|
@@ -878,7 +882,7 @@ class KernInputFile {
|
|
|
878
882
|
ids.push(`${baseId}-error`);
|
|
879
883
|
}
|
|
880
884
|
return ids.length ? ids.join(' ') : null;
|
|
881
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
885
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
882
886
|
fileInput = viewChild.required('fileInput');
|
|
883
887
|
get fileList() {
|
|
884
888
|
return this.fileInput().nativeElement?.files ?? null;
|
|
@@ -887,32 +891,32 @@ class KernInputFile {
|
|
|
887
891
|
const { value } = event.target;
|
|
888
892
|
this.cva.changeValue(value);
|
|
889
893
|
}
|
|
890
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
891
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
894
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputFile, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
895
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputFile, isStandalone: true, selector: "kern-input-file", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"file\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n [disabled]=\"cva.disabled()\"\n (change)=\"onChange($event)\"\n [required]=\"required()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.accept]=\"accept()\"\n #fileInput\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
892
896
|
}
|
|
893
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
897
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputFile, decorators: [{
|
|
894
898
|
type: Component,
|
|
895
899
|
args: [{ selector: 'kern-input-file', imports: [FormsModule, KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"file\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n [disabled]=\"cva.disabled()\"\n (change)=\"onChange($event)\"\n [required]=\"required()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.accept]=\"accept()\"\n #fileInput\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
896
900
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], fileInput: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }] } });
|
|
897
901
|
|
|
898
902
|
class KernInputNumber {
|
|
899
903
|
cva = inject(ControlValueAccessorDirective);
|
|
900
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
901
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
902
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
903
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
904
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
905
|
-
min = input(null, ...(ngDevMode ? [{ debugName: "min" }] : []));
|
|
906
|
-
max = input(null, ...(ngDevMode ? [{ debugName: "max" }] : []));
|
|
907
|
-
step = input(null, ...(ngDevMode ? [{ debugName: "step" }] : []));
|
|
908
|
-
autocomplete = input(null, ...(ngDevMode ? [{ debugName: "autocomplete" }] : []));
|
|
909
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
910
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
911
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
912
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
913
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
904
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
905
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
906
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
907
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
908
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
909
|
+
min = input(null, ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
910
|
+
max = input(null, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
911
|
+
step = input(null, ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
|
|
912
|
+
autocomplete = input(null, ...(ngDevMode ? [{ debugName: "autocomplete" }] : /* istanbul ignore next */ []));
|
|
913
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
914
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
915
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
916
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
917
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
914
918
|
generatedId = inject(UniqueIdService).getUniqueId('input-number');
|
|
915
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
919
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
916
920
|
inputDescribedBy = computed(() => {
|
|
917
921
|
const baseId = this.effectiveId();
|
|
918
922
|
const ids = [];
|
|
@@ -923,7 +927,7 @@ class KernInputNumber {
|
|
|
923
927
|
ids.push(`${baseId}-error`);
|
|
924
928
|
}
|
|
925
929
|
return ids.length ? ids.join(' ') : null;
|
|
926
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
930
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
927
931
|
onInput(event) {
|
|
928
932
|
const { value } = event.target;
|
|
929
933
|
this.cva.changeValue(value);
|
|
@@ -935,29 +939,29 @@ class KernInputNumber {
|
|
|
935
939
|
this.cva.markTouched();
|
|
936
940
|
}
|
|
937
941
|
}
|
|
938
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
939
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
942
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputNumber, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
943
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputNumber, isStandalone: true, selector: "kern-input-number", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"number\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.autocomplete]=\"autocomplete()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.min]=\"min()\"\n [attr.max]=\"max()\"\n [attr.step]=\"step()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }] });
|
|
940
944
|
}
|
|
941
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
945
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputNumber, decorators: [{
|
|
942
946
|
type: Component,
|
|
943
947
|
args: [{ selector: 'kern-input-number', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"number\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.autocomplete]=\"autocomplete()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.min]=\"min()\"\n [attr.max]=\"max()\"\n [attr.step]=\"step()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
944
948
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
945
949
|
|
|
946
950
|
class KernInputPassword {
|
|
947
951
|
cva = inject(ControlValueAccessorDirective);
|
|
948
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
949
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
950
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
951
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
952
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
953
|
-
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
954
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
955
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
956
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
957
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
958
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
952
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
953
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
954
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
955
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
956
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
957
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
958
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
959
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
960
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
961
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
962
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
959
963
|
generatedId = inject(UniqueIdService).getUniqueId('input-password');
|
|
960
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
964
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
961
965
|
inputDescribedBy = computed(() => {
|
|
962
966
|
const baseId = this.effectiveId();
|
|
963
967
|
const ids = [];
|
|
@@ -968,7 +972,7 @@ class KernInputPassword {
|
|
|
968
972
|
ids.push(`${baseId}-error`);
|
|
969
973
|
}
|
|
970
974
|
return ids.length ? ids.join(' ') : null;
|
|
971
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
975
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
972
976
|
onInput(event) {
|
|
973
977
|
const { value } = event.target;
|
|
974
978
|
this.cva.changeValue(value);
|
|
@@ -980,28 +984,28 @@ class KernInputPassword {
|
|
|
980
984
|
this.cva.markTouched();
|
|
981
985
|
}
|
|
982
986
|
}
|
|
983
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
984
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
987
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputPassword, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
988
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputPassword, isStandalone: true, selector: "kern-input-password", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"password\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
985
989
|
}
|
|
986
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
990
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputPassword, decorators: [{
|
|
987
991
|
type: Component,
|
|
988
992
|
args: [{ selector: 'kern-input-password', imports: [KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"password\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
989
993
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
990
994
|
|
|
991
995
|
class KernInputRadio {
|
|
992
996
|
cva = inject(ControlValueAccessorDirective);
|
|
993
|
-
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : []));
|
|
994
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
995
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
996
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
997
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
998
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
999
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
1000
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
1001
|
-
horizontalAlignment = input(false, ...(ngDevMode ? [{ debugName: "horizontalAlignment" }] : []));
|
|
1002
|
-
options = input.required(...(ngDevMode ? [{ debugName: "options" }] : []));
|
|
997
|
+
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : /* istanbul ignore next */ []));
|
|
998
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
999
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1000
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1001
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
1002
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
1003
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
1004
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
1005
|
+
horizontalAlignment = input(false, ...(ngDevMode ? [{ debugName: "horizontalAlignment" }] : /* istanbul ignore next */ []));
|
|
1006
|
+
options = input.required(...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
1003
1007
|
generatedId = inject(UniqueIdService).getUniqueId('fieldset-radio');
|
|
1004
|
-
effectiveId = computed(() => this.fieldsetId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
1008
|
+
effectiveId = computed(() => this.fieldsetId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
1005
1009
|
onKeydown(event) {
|
|
1006
1010
|
if (event.target &&
|
|
1007
1011
|
event.target instanceof HTMLInputElement &&
|
|
@@ -1009,28 +1013,28 @@ class KernInputRadio {
|
|
|
1009
1013
|
this.cva.markTouched();
|
|
1010
1014
|
}
|
|
1011
1015
|
}
|
|
1012
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1013
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1016
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputRadio, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1017
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputRadio, isStandalone: true, selector: "kern-input-radio", inputs: { fieldsetId: { classPropertyName: "fieldsetId", publicName: "fieldsetId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlignment: { classPropertyName: "horizontalAlignment", publicName: "horizontalAlignment", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<kern-fieldset\n [fieldsetId]=\"effectiveId()\"\n [legendText]=\"labelText()\"\n legendSize=\"default\"\n [optional]=\"optional()\"\n [hintText]=\"hintText()\"\n [hintTemplate]=\"hintTemplate()\"\n [errorText]=\"errorText()\"\n [horizontalAlignment]=\"horizontalAlignment()\"\n>\n @for (option of options(); track option.value) {\n <div class=\"kern-form-check\">\n <input\n [attr.title]=\"titleText()\"\n type=\"radio\"\n [id]=\"effectiveId() + '_' + option.value\"\n class=\"kern-form-check__radio\"\n [class.kern-form-check__radio--error]=\"errorText()\"\n [checked]=\"cva.value() === option.value\"\n [disabled]=\"cva.disabled()\"\n (change)=\"cva.changeValue(option.value)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [name]=\"effectiveId()\"\n [required]=\"required()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n />\n <label\n class=\"kern-label\"\n [for]=\"effectiveId() + '_' + option.value\"\n [id]=\"effectiveId() + '_' + option.value + '-label'\"\n >\n {{ option.label }}\n </label>\n </div>\n }\n</kern-fieldset>\n", dependencies: [{ kind: "component", type: KernFieldset, selector: "kern-fieldset", inputs: ["fieldsetId", "legendText", "legendSize", "optional", "disabled", "hintTemplate", "hintText", "errorText", "horizontalAlignment"] }] });
|
|
1014
1018
|
}
|
|
1015
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1019
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputRadio, decorators: [{
|
|
1016
1020
|
type: Component,
|
|
1017
1021
|
args: [{ selector: 'kern-input-radio', imports: [KernFieldset], hostDirectives: [ControlValueAccessorDirective], template: "<kern-fieldset\n [fieldsetId]=\"effectiveId()\"\n [legendText]=\"labelText()\"\n legendSize=\"default\"\n [optional]=\"optional()\"\n [hintText]=\"hintText()\"\n [hintTemplate]=\"hintTemplate()\"\n [errorText]=\"errorText()\"\n [horizontalAlignment]=\"horizontalAlignment()\"\n>\n @for (option of options(); track option.value) {\n <div class=\"kern-form-check\">\n <input\n [attr.title]=\"titleText()\"\n type=\"radio\"\n [id]=\"effectiveId() + '_' + option.value\"\n class=\"kern-form-check__radio\"\n [class.kern-form-check__radio--error]=\"errorText()\"\n [checked]=\"cva.value() === option.value\"\n [disabled]=\"cva.disabled()\"\n (change)=\"cva.changeValue(option.value)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [name]=\"effectiveId()\"\n [required]=\"required()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n />\n <label\n class=\"kern-label\"\n [for]=\"effectiveId() + '_' + option.value\"\n [id]=\"effectiveId() + '_' + option.value + '-label'\"\n >\n {{ option.label }}\n </label>\n </div>\n }\n</kern-fieldset>\n" }]
|
|
1018
1022
|
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], horizontalAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlignment", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }] } });
|
|
1019
1023
|
|
|
1020
1024
|
class KernInputSelect {
|
|
1021
1025
|
cva = inject(ControlValueAccessorDirective);
|
|
1022
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
1023
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
1024
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
1025
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
1026
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
1027
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
1028
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
1029
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
1030
|
-
emptyPlaceholder = input('', ...(ngDevMode ? [{ debugName: "emptyPlaceholder" }] : []));
|
|
1031
|
-
options = input.required(...(ngDevMode ? [{ debugName: "options" }] : []));
|
|
1026
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1027
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1028
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1029
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1030
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
1031
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
1032
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
1033
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
1034
|
+
emptyPlaceholder = input('', ...(ngDevMode ? [{ debugName: "emptyPlaceholder" }] : /* istanbul ignore next */ []));
|
|
1035
|
+
options = input.required(...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
1032
1036
|
generatedId = inject(UniqueIdService).getUniqueId('input-select');
|
|
1033
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
1037
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
1034
1038
|
inputDescribedBy = computed(() => {
|
|
1035
1039
|
const baseId = this.effectiveId();
|
|
1036
1040
|
const ids = [];
|
|
@@ -1041,7 +1045,7 @@ class KernInputSelect {
|
|
|
1041
1045
|
ids.push(`${baseId}-error`);
|
|
1042
1046
|
}
|
|
1043
1047
|
return ids.length ? ids.join(' ') : null;
|
|
1044
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
1048
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
1045
1049
|
onChange(event) {
|
|
1046
1050
|
const { value } = event.target;
|
|
1047
1051
|
this.cva.changeValue(value);
|
|
@@ -1053,29 +1057,29 @@ class KernInputSelect {
|
|
|
1053
1057
|
this.cva.markTouched();
|
|
1054
1058
|
}
|
|
1055
1059
|
}
|
|
1056
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1057
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1060
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1061
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputSelect, isStandalone: true, selector: "kern-input-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, emptyPlaceholder: { classPropertyName: "emptyPlaceholder", publicName: "emptyPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <div class=\"kern-form-input__select-wrapper\">\n <select\n [id]=\"effectiveId()\"\n class=\"kern-form-input__select\"\n [class.kern-form-input__select--error]=\"errorText()\"\n (change)=\"onChange($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [required]=\"required()\"\n [disabled]=\"cva.disabled()\"\n [attr.title]=\"titleText()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.aria-label]=\"labelText()\"\n >\n <option value=\"\" disabled hidden [selected]=\"!cva.value()\">{{ emptyPlaceholder() }}</option>\n @for (option of options(); track option.value) {\n <option [value]=\"option.value\" [selected]=\"option.value === cva.value()\">{{ option.label }}</option>\n }\n </select>\n </div>\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }] });
|
|
1058
1062
|
}
|
|
1059
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1063
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputSelect, decorators: [{
|
|
1060
1064
|
type: Component,
|
|
1061
1065
|
args: [{ selector: 'kern-input-select', imports: [KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <div class=\"kern-form-input__select-wrapper\">\n <select\n [id]=\"effectiveId()\"\n class=\"kern-form-input__select\"\n [class.kern-form-input__select--error]=\"errorText()\"\n (change)=\"onChange($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [required]=\"required()\"\n [disabled]=\"cva.disabled()\"\n [attr.title]=\"titleText()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.aria-label]=\"labelText()\"\n >\n <option value=\"\" disabled hidden [selected]=\"!cva.value()\">{{ emptyPlaceholder() }}</option>\n @for (option of options(); track option.value) {\n <option [value]=\"option.value\" [selected]=\"option.value === cva.value()\">{{ option.label }}</option>\n }\n </select>\n </div>\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
1062
1066
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], emptyPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyPlaceholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }] } });
|
|
1063
1067
|
|
|
1064
1068
|
class KernInputTel {
|
|
1065
1069
|
cva = inject(ControlValueAccessorDirective);
|
|
1066
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
1067
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
1068
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
1069
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
1070
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
1071
|
-
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
1072
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
1073
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
1074
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
1075
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
1076
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
1070
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1071
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1072
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1073
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1074
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1075
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
1076
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
1077
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
1078
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
1079
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
1080
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
1077
1081
|
generatedId = inject(UniqueIdService).getUniqueId('input-tel');
|
|
1078
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
1082
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
1079
1083
|
inputDescribedBy = computed(() => {
|
|
1080
1084
|
const baseId = this.effectiveId();
|
|
1081
1085
|
const ids = [];
|
|
@@ -1086,7 +1090,7 @@ class KernInputTel {
|
|
|
1086
1090
|
ids.push(`${baseId}-error`);
|
|
1087
1091
|
}
|
|
1088
1092
|
return ids.length ? ids.join(' ') : null;
|
|
1089
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
1093
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
1090
1094
|
onInput(event) {
|
|
1091
1095
|
const { value } = event.target;
|
|
1092
1096
|
this.cva.changeValue(value);
|
|
@@ -1098,31 +1102,31 @@ class KernInputTel {
|
|
|
1098
1102
|
this.cva.markTouched();
|
|
1099
1103
|
}
|
|
1100
1104
|
}
|
|
1101
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1102
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1105
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputTel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1106
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputTel, isStandalone: true, selector: "kern-input-tel", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"tel\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n autocomplete=\"tel\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }] });
|
|
1103
1107
|
}
|
|
1104
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputTel, decorators: [{
|
|
1105
1109
|
type: Component,
|
|
1106
1110
|
args: [{ selector: 'kern-input-tel', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"tel\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n autocomplete=\"tel\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
1107
1111
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
1108
1112
|
|
|
1109
1113
|
class KernInputText {
|
|
1110
1114
|
cva = inject(ControlValueAccessorDirective);
|
|
1111
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
1112
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
1113
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
1114
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
1115
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
1116
|
-
inputmode = input(null, ...(ngDevMode ? [{ debugName: "inputmode" }] : []));
|
|
1117
|
-
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
1118
|
-
autocomplete = input(null, ...(ngDevMode ? [{ debugName: "autocomplete" }] : []));
|
|
1119
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
1120
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
1121
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
1122
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
1123
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
1115
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1116
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1117
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1118
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1119
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1120
|
+
inputmode = input(null, ...(ngDevMode ? [{ debugName: "inputmode" }] : /* istanbul ignore next */ []));
|
|
1121
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
1122
|
+
autocomplete = input(null, ...(ngDevMode ? [{ debugName: "autocomplete" }] : /* istanbul ignore next */ []));
|
|
1123
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
1124
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
1125
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
1126
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
1127
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
1124
1128
|
generatedId = inject(UniqueIdService).getUniqueId('input-text');
|
|
1125
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
1129
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
1126
1130
|
inputDescribedBy = computed(() => {
|
|
1127
1131
|
const baseId = this.effectiveId();
|
|
1128
1132
|
const ids = [];
|
|
@@ -1133,7 +1137,7 @@ class KernInputText {
|
|
|
1133
1137
|
ids.push(`${baseId}-error`);
|
|
1134
1138
|
}
|
|
1135
1139
|
return ids.length ? ids.join(' ') : null;
|
|
1136
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
1140
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
1137
1141
|
onInput(event) {
|
|
1138
1142
|
const { value } = event.target;
|
|
1139
1143
|
this.cva.changeValue(value);
|
|
@@ -1145,29 +1149,29 @@ class KernInputText {
|
|
|
1145
1149
|
this.cva.markTouched();
|
|
1146
1150
|
}
|
|
1147
1151
|
}
|
|
1148
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1149
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1152
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1153
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputText, isStandalone: true, selector: "kern-input-text", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, inputmode: { classPropertyName: "inputmode", publicName: "inputmode", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"text\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [attr.autocomplete]=\"autocomplete()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.inputmode]=\"inputmode()\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1150
1154
|
}
|
|
1151
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1155
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputText, decorators: [{
|
|
1152
1156
|
type: Component,
|
|
1153
1157
|
args: [{ selector: 'kern-input-text', changeDetection: ChangeDetectionStrategy.OnPush, imports: [KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"text\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n [value]=\"cva.value()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [attr.autocomplete]=\"autocomplete()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.inputmode]=\"inputmode()\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
1154
1158
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], inputmode: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputmode", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
1155
1159
|
|
|
1156
1160
|
class KernInputTextarea {
|
|
1157
1161
|
cva = inject(ControlValueAccessorDirective);
|
|
1158
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
1159
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
1160
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
1161
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
1162
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
1163
|
-
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
1164
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
1165
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
1166
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
1167
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
1168
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
1162
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1163
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1164
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1165
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1166
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1167
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
1168
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
1169
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
1170
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
1171
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
1172
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
1169
1173
|
generatedId = inject(UniqueIdService).getUniqueId('input-textarea');
|
|
1170
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
1174
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
1171
1175
|
inputDescribedBy = computed(() => {
|
|
1172
1176
|
const baseId = this.effectiveId();
|
|
1173
1177
|
const ids = [];
|
|
@@ -1178,34 +1182,34 @@ class KernInputTextarea {
|
|
|
1178
1182
|
ids.push(`${baseId}-error`);
|
|
1179
1183
|
}
|
|
1180
1184
|
return ids.length ? ids.join(' ') : null;
|
|
1181
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
1185
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
1182
1186
|
onInput(event) {
|
|
1183
1187
|
const { value } = event.target;
|
|
1184
1188
|
this.cva.changeValue(value);
|
|
1185
1189
|
}
|
|
1186
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1187
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1190
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1191
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputTextarea, isStandalone: true, selector: "kern-input-textarea", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <textarea\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n ></textarea>\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1188
1192
|
}
|
|
1189
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1193
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputTextarea, decorators: [{
|
|
1190
1194
|
type: Component,
|
|
1191
1195
|
args: [{ selector: 'kern-input-textarea', changeDetection: ChangeDetectionStrategy.OnPush, imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <textarea\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n ></textarea>\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
1192
1196
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
1193
1197
|
|
|
1194
1198
|
class KernInputUrl {
|
|
1195
1199
|
cva = inject(ControlValueAccessorDirective);
|
|
1196
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
|
|
1197
|
-
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : []));
|
|
1198
|
-
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : []));
|
|
1199
|
-
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
1200
|
-
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
1201
|
-
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
1202
|
-
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : []));
|
|
1203
|
-
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : []));
|
|
1204
|
-
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
|
|
1205
|
-
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : []));
|
|
1206
|
-
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
1200
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1201
|
+
labelText = input.required(...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1202
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1203
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1204
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1205
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
1206
|
+
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
1207
|
+
hintText = input(null, ...(ngDevMode ? [{ debugName: "hintText" }] : /* istanbul ignore next */ []));
|
|
1208
|
+
errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : /* istanbul ignore next */ []));
|
|
1209
|
+
titleText = input(null, ...(ngDevMode ? [{ debugName: "titleText" }] : /* istanbul ignore next */ []));
|
|
1210
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
1207
1211
|
generatedId = inject(UniqueIdService).getUniqueId('input-url');
|
|
1208
|
-
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : []));
|
|
1212
|
+
effectiveId = computed(() => this.inputId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
1209
1213
|
inputDescribedBy = computed(() => {
|
|
1210
1214
|
const baseId = this.effectiveId();
|
|
1211
1215
|
const ids = [];
|
|
@@ -1216,7 +1220,7 @@ class KernInputUrl {
|
|
|
1216
1220
|
ids.push(`${baseId}-error`);
|
|
1217
1221
|
}
|
|
1218
1222
|
return ids.length ? ids.join(' ') : null;
|
|
1219
|
-
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : []));
|
|
1223
|
+
}, ...(ngDevMode ? [{ debugName: "inputDescribedBy" }] : /* istanbul ignore next */ []));
|
|
1220
1224
|
onInput(event) {
|
|
1221
1225
|
const { value } = event.target;
|
|
1222
1226
|
this.cva.changeValue(value);
|
|
@@ -1228,30 +1232,30 @@ class KernInputUrl {
|
|
|
1228
1232
|
this.cva.markTouched();
|
|
1229
1233
|
}
|
|
1230
1234
|
}
|
|
1231
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1232
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1235
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputUrl, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1236
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernInputUrl, isStandalone: true, selector: "kern-input-url", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: true, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, hintTemplate: { classPropertyName: "hintTemplate", publicName: "hintTemplate", isSignal: true, isRequired: false, transformFunction: null }, hintText: { classPropertyName: "hintText", publicName: "hintText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, titleText: { classPropertyName: "titleText", publicName: "titleText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: ControlValueAccessorDirective }], ngImport: i0, template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"url\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n", dependencies: [{ kind: "component", type: KernInputError, selector: "kern-input-error", inputs: ["effectiveId", "text"] }, { kind: "component", type: KernInputHint, selector: "kern-input-hint", inputs: ["hint"] }, { kind: "directive", type: KernLabel, selector: "label[kernLabel], legend[kernLabel], span[kernLabel], p[kernLabel]", inputs: ["size", "optional", "srOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1233
1237
|
}
|
|
1234
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernInputUrl, decorators: [{
|
|
1235
1239
|
type: Component,
|
|
1236
1240
|
args: [{ selector: 'kern-input-url', changeDetection: ChangeDetectionStrategy.OnPush, imports: [KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n\n @if (hintTemplate() || hintText(); as hint) {\n <kern-input-hint [hint]=\"hint\" />\n }\n\n <input\n [attr.title]=\"titleText()\"\n [attr.placeholder]=\"placeholder()\"\n [id]=\"effectiveId()\"\n type=\"url\"\n class=\"kern-form-input__input\"\n [class.kern-form-input__input--error]=\"errorText()\"\n (input)=\"onInput($event)\"\n (blur)=\"cva.markTouched()\"\n (keydown)=\"onKeydown($event)\"\n [disabled]=\"cva.disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [value]=\"cva.value()\"\n [attr.aria-describedby]=\"inputDescribedBy()\"\n [attr.aria-required]=\"required() ? 'true' : null\"\n [attr.aria-invalid]=\"errorText() ? 'true' : null\"\n [attr.aria-errormessage]=\"errorText() ? effectiveId() + '-error' : null\"\n [attr.maxlength]=\"maxlength()\"\n />\n\n @if (errorText(); as errorText) {\n <kern-input-error [effectiveId]=\"effectiveId()\" [text]=\"errorText\" />\n }\n</div>\n" }]
|
|
1237
1241
|
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: true }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], hintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintTemplate", required: false }] }], hintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], titleText: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
1238
1242
|
|
|
1239
1243
|
class KernTable {
|
|
1240
|
-
responsive = input(true, ...(ngDevMode ? [{ debugName: "responsive" }] : []));
|
|
1241
|
-
small = input(false, ...(ngDevMode ? [{ debugName: "small" }] : []));
|
|
1242
|
-
striped = input(false, ...(ngDevMode ? [{ debugName: "striped" }] : []));
|
|
1243
|
-
caption = input(null, ...(ngDevMode ? [{ debugName: "caption" }] : []));
|
|
1244
|
-
columns = input.required(...(ngDevMode ? [{ debugName: "columns" }] : []));
|
|
1245
|
-
data = input.required(...(ngDevMode ? [{ debugName: "data" }] : []));
|
|
1246
|
-
footer = input(null, ...(ngDevMode ? [{ debugName: "footer" }] : []));
|
|
1247
|
-
rowHeaderKey = input(null, ...(ngDevMode ? [{ debugName: "rowHeaderKey" }] : []));
|
|
1244
|
+
responsive = input(true, ...(ngDevMode ? [{ debugName: "responsive" }] : /* istanbul ignore next */ []));
|
|
1245
|
+
small = input(false, ...(ngDevMode ? [{ debugName: "small" }] : /* istanbul ignore next */ []));
|
|
1246
|
+
striped = input(false, ...(ngDevMode ? [{ debugName: "striped" }] : /* istanbul ignore next */ []));
|
|
1247
|
+
caption = input(null, ...(ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []));
|
|
1248
|
+
columns = input.required(...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
1249
|
+
data = input.required(...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
1250
|
+
footer = input(null, ...(ngDevMode ? [{ debugName: "footer" }] : /* istanbul ignore next */ []));
|
|
1251
|
+
rowHeaderKey = input(null, ...(ngDevMode ? [{ debugName: "rowHeaderKey" }] : /* istanbul ignore next */ []));
|
|
1248
1252
|
getCellText(row, key) {
|
|
1249
1253
|
return row[key] ?? '';
|
|
1250
1254
|
}
|
|
1251
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1252
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1255
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1256
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernTable, isStandalone: true, selector: "kern-table", inputs: { responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, small: { classPropertyName: "small", publicName: "small", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, rowHeaderKey: { classPropertyName: "rowHeaderKey", publicName: "rowHeaderKey", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-table-responsive": "responsive()", "attr.tabindex": "responsive() ? 0 : null" } }, ngImport: i0, template: "<table class=\"kern-table\" [class.kern-table--small]=\"small()\" [class.kern-table--striped]=\"striped()\">\n @if (caption()) {\n <caption kernTitle>\n {{\n caption()\n }}\n </caption>\n }\n\n <thead class=\"kern-table__head\">\n <tr class=\"kern-table__row\">\n @for (col of columns(); track col.key) {\n <th scope=\"col\" class=\"kern-table__header\" [class.kern-table__header--numeric]=\"col.numeric\">\n {{ col.header }}\n </th>\n }\n </tr>\n </thead>\n\n <tbody class=\"kern-table__body\">\n @for (row of data(); track $index) {\n <tr class=\"kern-table__row\">\n @for (col of columns(); track col.key) {\n @if (rowHeaderKey() && rowHeaderKey() === col.key) {\n <th scope=\"row\" class=\"kern-table__header\" [class.kern-table__header--numeric]=\"col.numeric\">\n {{ getCellText(row, col.key) }}\n </th>\n } @else {\n <td class=\"kern-table__cell\" [class.kern-table__cell--numeric]=\"col.numeric\">\n {{ getCellText(row, col.key) }}\n </td>\n }\n }\n </tr>\n }\n </tbody>\n\n @if (footer()?.length) {\n <tfoot class=\"kern-table__footer\">\n @for (frow of footer()!; track $index) {\n <tr class=\"kern-table__row\">\n @for (col of columns(); track col.key) {\n <th scope=\"col\" class=\"kern-table__header\" [class.kern-table__header--numeric]=\"col.numeric\">\n {{ getCellText(frow, col.key) }}\n </th>\n }\n </tr>\n }\n </tfoot>\n }\n</table>\n", dependencies: [{ kind: "directive", type: KernTitle, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: ["size"] }] });
|
|
1253
1257
|
}
|
|
1254
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1258
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernTable, decorators: [{
|
|
1255
1259
|
type: Component,
|
|
1256
1260
|
args: [{ selector: 'kern-table', imports: [KernTitle], host: {
|
|
1257
1261
|
'[class.kern-table-responsive]': 'responsive()',
|
|
@@ -1260,56 +1264,56 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
1260
1264
|
}], propDecorators: { responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], small: [{ type: i0.Input, args: [{ isSignal: true, alias: "small", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], footer: [{ type: i0.Input, args: [{ isSignal: true, alias: "footer", required: false }] }], rowHeaderKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHeaderKey", required: false }] }] } });
|
|
1261
1265
|
|
|
1262
1266
|
class KernDescriptionList {
|
|
1263
|
-
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : []));
|
|
1264
|
-
column = input(false, ...(ngDevMode ? [{ debugName: "column" }] : []));
|
|
1265
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1266
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1267
|
+
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
1268
|
+
column = input(false, ...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1269
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernDescriptionList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1270
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernDescriptionList, isStandalone: true, selector: "kern-description-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<dl class=\"kern-description-list\" [class.kern-description-list--col]=\"column()\">\n @for (item of items(); track item.term) {\n <div class=\"kern-description-list-item\">\n <dt class=\"kern-description-list-item__key\">{{ item.term }}</dt>\n <dd class=\"kern-description-list-item__value\">{{ item.description }}</dd>\n </div>\n }\n</dl>\n" });
|
|
1267
1271
|
}
|
|
1268
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernDescriptionList, decorators: [{
|
|
1269
1273
|
type: Component,
|
|
1270
1274
|
args: [{ selector: 'kern-description-list', template: "<dl class=\"kern-description-list\" [class.kern-description-list--col]=\"column()\">\n @for (item of items(); track item.term) {\n <div class=\"kern-description-list-item\">\n <dt class=\"kern-description-list-item__key\">{{ item.term }}</dt>\n <dd class=\"kern-description-list-item__value\">{{ item.description }}</dd>\n </div>\n }\n</dl>\n" }]
|
|
1271
1275
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: false }] }] } });
|
|
1272
1276
|
|
|
1273
1277
|
class KernTasklist {
|
|
1274
|
-
tasks = input.required(...(ngDevMode ? [{ debugName: "tasks" }] : []));
|
|
1275
|
-
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : []));
|
|
1276
|
-
linkTarget = input('_self', ...(ngDevMode ? [{ debugName: "linkTarget" }] : []));
|
|
1278
|
+
tasks = input.required(...(ngDevMode ? [{ debugName: "tasks" }] : /* istanbul ignore next */ []));
|
|
1279
|
+
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
1280
|
+
linkTarget = input('_self', ...(ngDevMode ? [{ debugName: "linkTarget" }] : /* istanbul ignore next */ []));
|
|
1277
1281
|
generatedId = inject(UniqueIdService).getUniqueId('tasklist');
|
|
1278
1282
|
getGeneratedStatusId(taskIndex, itemIndex) {
|
|
1279
1283
|
return (this.generatedId + '_' + taskIndex.toString() + '_' + itemIndex.toString());
|
|
1280
1284
|
}
|
|
1281
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1282
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1285
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernTasklist, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1286
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernTasklist, isStandalone: true, selector: "kern-tasklist", inputs: { tasks: { classPropertyName: "tasks", publicName: "tasks", isSignal: true, isRequired: true, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, linkTarget: { classPropertyName: "linkTarget", publicName: "linkTarget", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kern-task-list" }, ngImport: i0, template: "@for (task of tasks(); track $index) {\n @let taskIndex = $index;\n\n <div class=\"kern-task-list__header\">\n <kern-heading size=\"medium\" [level]=\"headingLevel()\">{{ task.heading }}</kern-heading>\n </div>\n\n <ul class=\"kern-task-list__list\">\n @for (item of task.items; track $index) {\n @let statusId = item.statusId ?? getGeneratedStatusId(taskIndex, $index);\n\n <li class=\"kern-task-list__item\">\n @if (item.number) {\n <span class=\"kern-number\">{{ item.number }}</span>\n }\n <div class=\"kern-task-list__title\">\n @if (item.linkHref) {\n <kern-link\n [href]=\"item.linkHref\"\n [stretched]=\"true\"\n [target]=\"linkTarget()\"\n [linkDescribedBy]=\"item.status && item.status !== 'new' ? statusId : null\"\n >\n {{ item.task }}\n </kern-link>\n } @else {\n <p kernBody>{{ item.task }}</p>\n }\n\n @if (item.status && item.status !== 'new') {\n <div class=\"kern-task-list__status\" [id]=\"statusId\">\n @switch (item.status) {\n @case ('incomplete') {\n <kern-badge variant=\"warning\" i18n=\"@@kernAngularKit.tasklist.status.incomplete\">\n Unvollst\u00E4ndig\n </kern-badge>\n }\n @case ('completed') {\n <kern-badge variant=\"success\" icon=\"success\" i18n=\"@@kernAngularKit.tasklist.status.completed\">\n Erledigt\n </kern-badge>\n }\n @case ('unavailable') {\n <kern-badge variant=\"info\" i18n=\"@@kernAngularKit.tasklist.status.unavailable\">\n Noch nicht zu bearbeiten\n </kern-badge>\n }\n }\n </div>\n }\n </div>\n </li>\n }\n </ul>\n}\n", dependencies: [{ kind: "component", type: KernHeading, selector: "kern-heading", inputs: ["level", "size"] }, { kind: "component", type: KernLink, selector: "kern-link", inputs: ["href", "target", "small", "stretched", "iconLeft", "iconRight", "linkDescribedBy"], outputs: ["clickEvent"] }, { kind: "directive", type: KernBody, selector: "p[kernBody], span[kernBody]", inputs: ["size", "weight"] }, { kind: "component", type: KernBadge, selector: "kern-badge", inputs: ["variant", "icon"] }] });
|
|
1283
1287
|
}
|
|
1284
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1288
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernTasklist, decorators: [{
|
|
1285
1289
|
type: Component,
|
|
1286
1290
|
args: [{ selector: 'kern-tasklist', imports: [KernHeading, KernLink, KernBody, KernBadge], host: { class: 'kern-task-list' }, template: "@for (task of tasks(); track $index) {\n @let taskIndex = $index;\n\n <div class=\"kern-task-list__header\">\n <kern-heading size=\"medium\" [level]=\"headingLevel()\">{{ task.heading }}</kern-heading>\n </div>\n\n <ul class=\"kern-task-list__list\">\n @for (item of task.items; track $index) {\n @let statusId = item.statusId ?? getGeneratedStatusId(taskIndex, $index);\n\n <li class=\"kern-task-list__item\">\n @if (item.number) {\n <span class=\"kern-number\">{{ item.number }}</span>\n }\n <div class=\"kern-task-list__title\">\n @if (item.linkHref) {\n <kern-link\n [href]=\"item.linkHref\"\n [stretched]=\"true\"\n [target]=\"linkTarget()\"\n [linkDescribedBy]=\"item.status && item.status !== 'new' ? statusId : null\"\n >\n {{ item.task }}\n </kern-link>\n } @else {\n <p kernBody>{{ item.task }}</p>\n }\n\n @if (item.status && item.status !== 'new') {\n <div class=\"kern-task-list__status\" [id]=\"statusId\">\n @switch (item.status) {\n @case ('incomplete') {\n <kern-badge variant=\"warning\" i18n=\"@@kernAngularKit.tasklist.status.incomplete\">\n Unvollst\u00E4ndig\n </kern-badge>\n }\n @case ('completed') {\n <kern-badge variant=\"success\" icon=\"success\" i18n=\"@@kernAngularKit.tasklist.status.completed\">\n Erledigt\n </kern-badge>\n }\n @case ('unavailable') {\n <kern-badge variant=\"info\" i18n=\"@@kernAngularKit.tasklist.status.unavailable\">\n Noch nicht zu bearbeiten\n </kern-badge>\n }\n }\n </div>\n }\n </div>\n </li>\n }\n </ul>\n}\n" }]
|
|
1287
1291
|
}], propDecorators: { tasks: [{ type: i0.Input, args: [{ isSignal: true, alias: "tasks", required: true }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], linkTarget: [{ type: i0.Input, args: [{ isSignal: true, alias: "linkTarget", required: false }] }] } });
|
|
1288
1292
|
|
|
1289
1293
|
class KernSummary {
|
|
1290
|
-
titleId = input(...(ngDevMode ? [undefined, { debugName: "titleId" }] : []));
|
|
1291
|
-
title = input(null, ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
1292
|
-
titleNumber = input(null, ...(ngDevMode ? [{ debugName: "titleNumber" }] : []));
|
|
1293
|
-
headingLevel = input('3', ...(ngDevMode ? [{ debugName: "headingLevel" }] : []));
|
|
1294
|
-
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : []));
|
|
1295
|
-
actionLinkHref = input(null, ...(ngDevMode ? [{ debugName: "actionLinkHref" }] : []));
|
|
1296
|
-
actionLinkTarget = input('_self', ...(ngDevMode ? [{ debugName: "actionLinkTarget" }] : []));
|
|
1294
|
+
titleId = input(...(ngDevMode ? [undefined, { debugName: "titleId" }] : /* istanbul ignore next */ []));
|
|
1295
|
+
title = input(null, ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
1296
|
+
titleNumber = input(null, ...(ngDevMode ? [{ debugName: "titleNumber" }] : /* istanbul ignore next */ []));
|
|
1297
|
+
headingLevel = input('3', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
1298
|
+
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
1299
|
+
actionLinkHref = input(null, ...(ngDevMode ? [{ debugName: "actionLinkHref" }] : /* istanbul ignore next */ []));
|
|
1300
|
+
actionLinkTarget = input('_self', ...(ngDevMode ? [{ debugName: "actionLinkTarget" }] : /* istanbul ignore next */ []));
|
|
1297
1301
|
actionLinkClickEvent = output();
|
|
1298
1302
|
generatedTitleId = inject(UniqueIdService).getUniqueId('title');
|
|
1299
|
-
effectiveTitleId = computed(() => this.titleId() ?? this.generatedTitleId, ...(ngDevMode ? [{ debugName: "effectiveTitleId" }] : []));
|
|
1300
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1301
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1303
|
+
effectiveTitleId = computed(() => this.titleId() ?? this.generatedTitleId, ...(ngDevMode ? [{ debugName: "effectiveTitleId" }] : /* istanbul ignore next */ []));
|
|
1304
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernSummary, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1305
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernSummary, isStandalone: true, selector: "kern-summary", inputs: { titleId: { classPropertyName: "titleId", publicName: "titleId", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, titleNumber: { classPropertyName: "titleNumber", publicName: "titleNumber", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, actionLinkHref: { classPropertyName: "actionLinkHref", publicName: "actionLinkHref", isSignal: true, isRequired: false, transformFunction: null }, actionLinkTarget: { classPropertyName: "actionLinkTarget", publicName: "actionLinkTarget", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionLinkClickEvent: "actionLinkClickEvent" }, host: { classAttribute: "kern-summary" }, ngImport: i0, template: "@if (titleNumber() || title()) {\n <div class=\"kern-summary__header\">\n @if (titleNumber()) {\n <span class=\"kern-number\">{{ titleNumber() }}</span>\n }\n @if (title()) {\n @switch (headingLevel()) {\n @case ('1') {\n <h1 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h1>\n }\n @case ('2') {\n <h2 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h2>\n }\n @case ('3') {\n <h3 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h3>\n }\n @case ('4') {\n <h4 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h4>\n }\n @case ('5') {\n <h5 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h5>\n }\n @case ('6') {\n <h6 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h6>\n }\n }\n }\n </div>\n}\n\n<div class=\"kern-summary__body\">\n <kern-description-list [items]=\"items()\" />\n @if (actionLinkHref()) {\n <div class=\"kern-summary__actions\">\n <kern-link\n [href]=\"actionLinkHref()\"\n [target]=\"actionLinkTarget()\"\n iconLeft=\"edit\"\n [linkDescribedBy]=\"title() ? effectiveTitleId() : null\"\n (clickEvent)=\"actionLinkClickEvent.emit($event)\"\n >\n <span i18n=\"@@kernAngularKit.summary.actionLink\">Bearbeiten</span>\n </kern-link>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: KernLink, selector: "kern-link", inputs: ["href", "target", "small", "stretched", "iconLeft", "iconRight", "linkDescribedBy"], outputs: ["clickEvent"] }, { kind: "directive", type: KernTitle, selector: "h1[kernTitle], h2[kernTitle], h3[kernTitle], h4[kernTitle], h5[kernTitle], h6[kernTitle], span[kernTitle], caption[kernTitle], p[kernTitle]", inputs: ["size"] }, { kind: "component", type: KernDescriptionList, selector: "kern-description-list", inputs: ["items", "column"] }] });
|
|
1302
1306
|
}
|
|
1303
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1307
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernSummary, decorators: [{
|
|
1304
1308
|
type: Component,
|
|
1305
1309
|
args: [{ selector: 'kern-summary', imports: [KernLink, KernTitle, KernDescriptionList], host: { class: 'kern-summary' }, template: "@if (titleNumber() || title()) {\n <div class=\"kern-summary__header\">\n @if (titleNumber()) {\n <span class=\"kern-number\">{{ titleNumber() }}</span>\n }\n @if (title()) {\n @switch (headingLevel()) {\n @case ('1') {\n <h1 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h1>\n }\n @case ('2') {\n <h2 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h2>\n }\n @case ('3') {\n <h3 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h3>\n }\n @case ('4') {\n <h4 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h4>\n }\n @case ('5') {\n <h5 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h5>\n }\n @case ('6') {\n <h6 kernTitle size=\"small\" [id]=\"effectiveTitleId()\">{{ title() }}</h6>\n }\n }\n }\n </div>\n}\n\n<div class=\"kern-summary__body\">\n <kern-description-list [items]=\"items()\" />\n @if (actionLinkHref()) {\n <div class=\"kern-summary__actions\">\n <kern-link\n [href]=\"actionLinkHref()\"\n [target]=\"actionLinkTarget()\"\n iconLeft=\"edit\"\n [linkDescribedBy]=\"title() ? effectiveTitleId() : null\"\n (clickEvent)=\"actionLinkClickEvent.emit($event)\"\n >\n <span i18n=\"@@kernAngularKit.summary.actionLink\">Bearbeiten</span>\n </kern-link>\n </div>\n }\n</div>\n" }]
|
|
1306
1310
|
}], propDecorators: { titleId: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleId", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], titleNumber: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleNumber", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], actionLinkHref: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLinkHref", required: false }] }], actionLinkTarget: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLinkTarget", required: false }] }], actionLinkClickEvent: [{ type: i0.Output, args: ["actionLinkClickEvent"] }] } });
|
|
1307
1311
|
|
|
1308
1312
|
class KernSummaryGroup {
|
|
1309
|
-
heading = input(null, ...(ngDevMode ? [{ debugName: "heading" }] : []));
|
|
1310
|
-
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : []));
|
|
1311
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1312
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1313
|
+
heading = input(null, ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
|
|
1314
|
+
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
1315
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernSummaryGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1316
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.2", type: KernSummaryGroup, isStandalone: true, selector: "kern-summary-group", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kern-summary-group" }, ngImport: i0, template: `
|
|
1313
1317
|
@if (heading()) {
|
|
1314
1318
|
<div class="kern-summary-group__header">
|
|
1315
1319
|
<kern-heading [level]="headingLevel()" size="medium">{{
|
|
@@ -1320,7 +1324,7 @@ class KernSummaryGroup {
|
|
|
1320
1324
|
<ng-content />
|
|
1321
1325
|
`, isInline: true, dependencies: [{ kind: "component", type: KernHeading, selector: "kern-heading", inputs: ["level", "size"] }] });
|
|
1322
1326
|
}
|
|
1323
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1327
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernSummaryGroup, decorators: [{
|
|
1324
1328
|
type: Component,
|
|
1325
1329
|
args: [{
|
|
1326
1330
|
selector: 'kern-summary-group',
|
|
@@ -1340,12 +1344,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
1340
1344
|
}], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }] } });
|
|
1341
1345
|
|
|
1342
1346
|
class KernRow {
|
|
1343
|
-
verticalAlign = input(null, ...(ngDevMode ? [{ debugName: "verticalAlign" }] : []));
|
|
1344
|
-
horizontalAlign = input(null, ...(ngDevMode ? [{ debugName: "horizontalAlign" }] : []));
|
|
1345
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1346
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
1347
|
+
verticalAlign = input(null, ...(ngDevMode ? [{ debugName: "verticalAlign" }] : /* istanbul ignore next */ []));
|
|
1348
|
+
horizontalAlign = input(null, ...(ngDevMode ? [{ debugName: "horizontalAlign" }] : /* istanbul ignore next */ []));
|
|
1349
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernRow, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1350
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernRow, isStandalone: true, selector: "kern-row", inputs: { verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlign: { classPropertyName: "horizontalAlign", publicName: "horizontalAlign", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kern-align-items-start": "verticalAlign() === \"start\"", "class.kern-align-items-center": "verticalAlign() === \"center\"", "class.kern-align-items-end": "verticalAlign() === \"end\"", "class.kern-justify-content-start": "horizontalAlign() === \"start\"", "class.kern-justify-content-center": "horizontalAlign() === \"center\"", "class.kern-justify-content-end": "horizontalAlign() === \"end\"", "class.kern-justify-content-around": "horizontalAlign() === \"around\"", "class.kern-justify-content-between": "horizontalAlign() === \"between\"", "class.kern-justify-content-evenly": "horizontalAlign() === \"evenly\"" }, classAttribute: "kern-row" }, ngImport: i0, template: '<ng-content />', isInline: true });
|
|
1347
1351
|
}
|
|
1348
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1352
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernRow, decorators: [{
|
|
1349
1353
|
type: Component,
|
|
1350
1354
|
args: [{
|
|
1351
1355
|
selector: 'kern-row',
|
|
@@ -1366,8 +1370,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
1366
1370
|
}], propDecorators: { verticalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalAlign", required: false }] }], horizontalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlign", required: false }] }] } });
|
|
1367
1371
|
|
|
1368
1372
|
class KernCol {
|
|
1369
|
-
size = input({}, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
1370
|
-
offset = input({}, ...(ngDevMode ? [{ debugName: "offset" }] : []));
|
|
1373
|
+
size = input({}, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
1374
|
+
offset = input({}, ...(ngDevMode ? [{ debugName: "offset" }] : /* istanbul ignore next */ []));
|
|
1371
1375
|
get colClasses() {
|
|
1372
1376
|
const classes = [];
|
|
1373
1377
|
const size = this.size();
|
|
@@ -1395,10 +1399,10 @@ class KernCol {
|
|
|
1395
1399
|
}
|
|
1396
1400
|
return classes;
|
|
1397
1401
|
}
|
|
1398
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1399
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
1402
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernCol, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1403
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.2", type: KernCol, isStandalone: true, selector: "kern-col", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "colClasses.join(' ')" } }, ngImport: i0, template: '<ng-content />', isInline: true });
|
|
1400
1404
|
}
|
|
1401
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1405
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernCol, decorators: [{
|
|
1402
1406
|
type: Component,
|
|
1403
1407
|
args: [{
|
|
1404
1408
|
selector: 'kern-col',
|
|
@@ -1411,8 +1415,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
1411
1415
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }] } });
|
|
1412
1416
|
|
|
1413
1417
|
class KernAngularKitModule {
|
|
1414
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1415
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.
|
|
1418
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAngularKitModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1419
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.2", ngImport: i0, type: KernAngularKitModule, imports: [KernAccordion,
|
|
1416
1420
|
KernAccordionGroup,
|
|
1417
1421
|
KernAlert,
|
|
1418
1422
|
KernDialog,
|
|
@@ -1493,10 +1497,10 @@ class KernAngularKitModule {
|
|
|
1493
1497
|
KernTitle,
|
|
1494
1498
|
KernPreline,
|
|
1495
1499
|
KernSubline] });
|
|
1496
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.
|
|
1500
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAngularKitModule, imports: [KernInputDate,
|
|
1497
1501
|
KernInputFile] });
|
|
1498
1502
|
}
|
|
1499
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1503
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImport: i0, type: KernAngularKitModule, decorators: [{
|
|
1500
1504
|
type: NgModule,
|
|
1501
1505
|
args: [{
|
|
1502
1506
|
imports: [
|