@kern-ux-annex/kern-angular-kit 1.2.2 → 1.3.0
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.
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { input, Directive, Component, Injectable, inject, ElementRef, Renderer2, booleanAttribute, output, computed, viewChild, signal, forwardRef, TemplateRef, ChangeDetectionStrategy, NgModule } from '@angular/core';
|
|
3
|
-
import {
|
|
3
|
+
import { Router, ActivatedRoute, UrlTree } from '@angular/router';
|
|
4
|
+
import { LocationStrategy, NgTemplateOutlet } from '@angular/common';
|
|
4
5
|
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
|
|
5
6
|
|
|
6
7
|
class KernTitle {
|
|
7
8
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
8
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
9
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
10
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", 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
11
|
}
|
|
11
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernTitle, decorators: [{
|
|
12
13
|
type: Directive,
|
|
13
14
|
args: [{
|
|
14
15
|
host: {
|
|
@@ -24,19 +25,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
24
25
|
class KernAccordion {
|
|
25
26
|
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
26
27
|
open = input(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
27
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
28
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
28
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
30
|
}
|
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAccordion, decorators: [{
|
|
31
32
|
type: Component,
|
|
32
33
|
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
34
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }] } });
|
|
34
35
|
|
|
35
36
|
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.
|
|
37
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAccordionGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
38
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: KernAccordionGroup, isStandalone: true, selector: "kern-accordion-group", host: { classAttribute: "kern-accordion-group" }, ngImport: i0, template: `<ng-content />`, isInline: true });
|
|
38
39
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
40
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAccordionGroup, decorators: [{
|
|
40
41
|
type: Component,
|
|
41
42
|
args: [{
|
|
42
43
|
selector: 'kern-accordion-group',
|
|
@@ -49,10 +50,10 @@ class KernIcon {
|
|
|
49
50
|
name = input.required(...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
50
51
|
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : /* istanbul ignore next */ []));
|
|
51
52
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
52
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
53
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
53
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
54
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
55
|
}
|
|
55
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernIcon, decorators: [{
|
|
56
57
|
type: Component,
|
|
57
58
|
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
59
|
}], 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 }] }] } });
|
|
@@ -60,10 +61,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
60
61
|
class KernAlert {
|
|
61
62
|
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
62
63
|
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
63
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
64
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
64
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAlert, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
65
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
66
|
}
|
|
66
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
67
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAlert, decorators: [{
|
|
67
68
|
type: Component,
|
|
68
69
|
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
70
|
}], 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 +74,10 @@ class UniqueIdService {
|
|
|
73
74
|
getUniqueId(prefix = '') {
|
|
74
75
|
return prefix + '_' + (this.counter++).toString();
|
|
75
76
|
}
|
|
76
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
77
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
77
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: UniqueIdService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
78
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: UniqueIdService, providedIn: 'root' });
|
|
78
79
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
80
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: UniqueIdService, decorators: [{
|
|
80
81
|
type: Injectable,
|
|
81
82
|
args: [{
|
|
82
83
|
providedIn: 'root'
|
|
@@ -107,10 +108,10 @@ class KernLabel {
|
|
|
107
108
|
}
|
|
108
109
|
}
|
|
109
110
|
}
|
|
110
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
111
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
111
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
112
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", 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
113
|
}
|
|
113
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernLabel, decorators: [{
|
|
114
115
|
type: Directive,
|
|
115
116
|
args: [{
|
|
116
117
|
host: {
|
|
@@ -124,6 +125,57 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
124
125
|
}]
|
|
125
126
|
}], 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
127
|
|
|
128
|
+
class NavigationService {
|
|
129
|
+
router = inject(Router, { optional: true });
|
|
130
|
+
route = inject(ActivatedRoute, { optional: true });
|
|
131
|
+
locationStrategy = inject(LocationStrategy, {
|
|
132
|
+
optional: true
|
|
133
|
+
});
|
|
134
|
+
serialize(routerLink, routerQueryParams = null, routerFragment = null) {
|
|
135
|
+
if (!routerLink || !this.router || !this.locationStrategy) {
|
|
136
|
+
return null;
|
|
137
|
+
}
|
|
138
|
+
let urlTree;
|
|
139
|
+
if (routerLink instanceof UrlTree) {
|
|
140
|
+
urlTree = routerLink;
|
|
141
|
+
}
|
|
142
|
+
else {
|
|
143
|
+
urlTree = this.router.createUrlTree(Array.isArray(routerLink) ? routerLink : [routerLink], {
|
|
144
|
+
relativeTo: this.route,
|
|
145
|
+
queryParams: routerQueryParams,
|
|
146
|
+
fragment: routerFragment || undefined
|
|
147
|
+
});
|
|
148
|
+
}
|
|
149
|
+
return this.locationStrategy.prepareExternalUrl(this.router.serializeUrl(urlTree));
|
|
150
|
+
}
|
|
151
|
+
navigate(routerLink, routerQueryParams = null, routerFragment = null, routerState = null, clickEvent = null) {
|
|
152
|
+
if (!routerLink || !this.router) {
|
|
153
|
+
return;
|
|
154
|
+
}
|
|
155
|
+
clickEvent?.preventDefault();
|
|
156
|
+
const state = routerState ?? undefined;
|
|
157
|
+
if (routerLink instanceof UrlTree) {
|
|
158
|
+
this.router.navigateByUrl(routerLink, { state: state });
|
|
159
|
+
}
|
|
160
|
+
else {
|
|
161
|
+
this.router.navigate(Array.isArray(routerLink) ? routerLink : [routerLink], {
|
|
162
|
+
relativeTo: this.route,
|
|
163
|
+
queryParams: routerQueryParams,
|
|
164
|
+
fragment: routerFragment || undefined,
|
|
165
|
+
state: state
|
|
166
|
+
});
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
170
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NavigationService, providedIn: 'root' });
|
|
171
|
+
}
|
|
172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NavigationService, decorators: [{
|
|
173
|
+
type: Injectable,
|
|
174
|
+
args: [{
|
|
175
|
+
providedIn: 'root'
|
|
176
|
+
}]
|
|
177
|
+
}] });
|
|
178
|
+
|
|
127
179
|
class KernButton {
|
|
128
180
|
variant = input('primary', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
129
181
|
block = input(false, ...(ngDevMode ? [{ debugName: "block" }] : /* istanbul ignore next */ []));
|
|
@@ -133,14 +185,23 @@ class KernButton {
|
|
|
133
185
|
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
|
|
134
186
|
srOnlyLabel = input(false, ...(ngDevMode ? [{ debugName: "srOnlyLabel" }] : /* istanbul ignore next */ []));
|
|
135
187
|
formId = input(null, ...(ngDevMode ? [{ debugName: "formId" }] : /* istanbul ignore next */ []));
|
|
188
|
+
routerLink = input(null, ...(ngDevMode ? [{ debugName: "routerLink" }] : /* istanbul ignore next */ []));
|
|
189
|
+
routerQueryParams = input(null, ...(ngDevMode ? [{ debugName: "routerQueryParams" }] : /* istanbul ignore next */ []));
|
|
190
|
+
routerFragment = input(null, ...(ngDevMode ? [{ debugName: "routerFragment" }] : /* istanbul ignore next */ []));
|
|
191
|
+
routerState = input(null, ...(ngDevMode ? [{ debugName: "routerState" }] : /* istanbul ignore next */ []));
|
|
192
|
+
navigationService = inject(NavigationService);
|
|
136
193
|
clickEvent = output();
|
|
137
|
-
|
|
138
|
-
|
|
194
|
+
onClick(event) {
|
|
195
|
+
this.navigationService.navigate(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.routerState(), event);
|
|
196
|
+
this.clickEvent.emit(event);
|
|
197
|
+
}
|
|
198
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
199
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, routerQueryParams: { classPropertyName: "routerQueryParams", publicName: "routerQueryParams", isSignal: true, isRequired: false, transformFunction: null }, routerFragment: { classPropertyName: "routerFragment", publicName: "routerFragment", isSignal: true, isRequired: false, transformFunction: null }, routerState: { classPropertyName: "routerState", publicName: "routerState", 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)=\"onClick($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
200
|
}
|
|
140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
201
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernButton, decorators: [{
|
|
141
202
|
type: Component,
|
|
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)=\"
|
|
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"] }] } });
|
|
203
|
+
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)=\"onClick($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"] }]
|
|
204
|
+
}], 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 }] }], routerLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerLink", required: false }] }], routerQueryParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerQueryParams", required: false }] }], routerFragment: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerFragment", required: false }] }], routerState: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerState", required: false }] }], clickEvent: [{ type: i0.Output, args: ["clickEvent"] }] } });
|
|
144
205
|
|
|
145
206
|
class ScrollLockService {
|
|
146
207
|
lockCount = 0;
|
|
@@ -164,10 +225,10 @@ class ScrollLockService {
|
|
|
164
225
|
isLocked() {
|
|
165
226
|
return this.lockCount > 0;
|
|
166
227
|
}
|
|
167
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
168
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
228
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ScrollLockService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
229
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ScrollLockService, providedIn: 'root' });
|
|
169
230
|
}
|
|
170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
231
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ScrollLockService, decorators: [{
|
|
171
232
|
type: Injectable,
|
|
172
233
|
args: [{
|
|
173
234
|
providedIn: 'root'
|
|
@@ -210,20 +271,20 @@ class KernDialog {
|
|
|
210
271
|
this.scrollLockService.unlock();
|
|
211
272
|
}
|
|
212
273
|
}
|
|
213
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
214
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
274
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
275
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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", "routerLink", "routerQueryParams", "routerFragment", "routerState"], 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
276
|
}
|
|
216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
277
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernDialog, decorators: [{
|
|
217
278
|
type: Component,
|
|
218
279
|
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
280
|
}], 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
281
|
|
|
221
282
|
class KernLoader {
|
|
222
283
|
text = input('Wird geladen...', ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
223
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
224
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
284
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernLoader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
285
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
286
|
}
|
|
226
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernLoader, decorators: [{
|
|
227
288
|
type: Component,
|
|
228
289
|
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
290
|
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }] } });
|
|
@@ -231,20 +292,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
231
292
|
class KernBadge {
|
|
232
293
|
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
233
294
|
icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
234
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
235
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
295
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
296
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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
297
|
}
|
|
237
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
298
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernBadge, decorators: [{
|
|
238
299
|
type: Component,
|
|
239
300
|
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
301
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
|
|
241
302
|
|
|
242
303
|
class KernPreline {
|
|
243
304
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
244
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
245
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
305
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernPreline, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
306
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", 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
307
|
}
|
|
247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
308
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernPreline, decorators: [{
|
|
248
309
|
type: Directive,
|
|
249
310
|
args: [{
|
|
250
311
|
host: {
|
|
@@ -259,10 +320,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
259
320
|
|
|
260
321
|
class KernSubline {
|
|
261
322
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
262
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
263
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
323
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernSubline, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
324
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", 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
325
|
}
|
|
265
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
326
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernSubline, decorators: [{
|
|
266
327
|
type: Directive,
|
|
267
328
|
args: [{
|
|
268
329
|
host: {
|
|
@@ -286,24 +347,32 @@ class KernCard {
|
|
|
286
347
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
287
348
|
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
288
349
|
btnPrimaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryLabelText" }] : /* istanbul ignore next */ []));
|
|
350
|
+
btnPrimaryRouterLink = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryRouterLink" }] : /* istanbul ignore next */ []));
|
|
351
|
+
btnPrimaryRouterQueryParams = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryRouterQueryParams" }] : /* istanbul ignore next */ []));
|
|
352
|
+
btnPrimaryRouterFragment = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryRouterFragment" }] : /* istanbul ignore next */ []));
|
|
353
|
+
btnPrimaryRouterState = input(null, ...(ngDevMode ? [{ debugName: "btnPrimaryRouterState" }] : /* istanbul ignore next */ []));
|
|
289
354
|
btnSecondaryLabelText = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryLabelText" }] : /* istanbul ignore next */ []));
|
|
355
|
+
btnSecondaryRouterLink = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryRouterLink" }] : /* istanbul ignore next */ []));
|
|
356
|
+
btnSecondaryRouterQueryParams = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryRouterQueryParams" }] : /* istanbul ignore next */ []));
|
|
357
|
+
btnSecondaryRouterFragment = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryRouterFragment" }] : /* istanbul ignore next */ []));
|
|
358
|
+
btnSecondaryRouterState = input(null, ...(ngDevMode ? [{ debugName: "btnSecondaryRouterState" }] : /* istanbul ignore next */ []));
|
|
290
359
|
titleLinkClickEvent = output();
|
|
291
360
|
btnPrimaryClickEvent = output();
|
|
292
361
|
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.
|
|
362
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
363
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 }, btnPrimaryRouterLink: { classPropertyName: "btnPrimaryRouterLink", publicName: "btnPrimaryRouterLink", isSignal: true, isRequired: false, transformFunction: null }, btnPrimaryRouterQueryParams: { classPropertyName: "btnPrimaryRouterQueryParams", publicName: "btnPrimaryRouterQueryParams", isSignal: true, isRequired: false, transformFunction: null }, btnPrimaryRouterFragment: { classPropertyName: "btnPrimaryRouterFragment", publicName: "btnPrimaryRouterFragment", isSignal: true, isRequired: false, transformFunction: null }, btnPrimaryRouterState: { classPropertyName: "btnPrimaryRouterState", publicName: "btnPrimaryRouterState", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryLabelText: { classPropertyName: "btnSecondaryLabelText", publicName: "btnSecondaryLabelText", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryRouterLink: { classPropertyName: "btnSecondaryRouterLink", publicName: "btnSecondaryRouterLink", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryRouterQueryParams: { classPropertyName: "btnSecondaryRouterQueryParams", publicName: "btnSecondaryRouterQueryParams", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryRouterFragment: { classPropertyName: "btnSecondaryRouterFragment", publicName: "btnSecondaryRouterFragment", isSignal: true, isRequired: false, transformFunction: null }, btnSecondaryRouterState: { classPropertyName: "btnSecondaryRouterState", publicName: "btnSecondaryRouterState", 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\n (clickEvent)=\"btnPrimaryClickEvent.emit($event)\"\n [routerLink]=\"btnPrimaryRouterLink()\"\n [routerQueryParams]=\"btnPrimaryRouterQueryParams()\"\n [routerFragment]=\"btnPrimaryRouterFragment()\"\n [routerState]=\"btnPrimaryRouterState()\"\n >\n {{ btnPrimaryLabelText() }}\n </kern-button>\n }\n @if (btnSecondaryLabelText()) {\n <kern-button\n variant=\"secondary\"\n (clickEvent)=\"btnSecondaryClickEvent.emit($event)\"\n [routerLink]=\"btnSecondaryRouterLink()\"\n [routerQueryParams]=\"btnSecondaryRouterQueryParams()\"\n [routerFragment]=\"btnSecondaryRouterFragment()\"\n [routerState]=\"btnSecondaryRouterState()\"\n >\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", "routerLink", "routerQueryParams", "routerFragment", "routerState"], outputs: ["clickEvent"] }] });
|
|
295
364
|
}
|
|
296
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
365
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernCard, decorators: [{
|
|
297
366
|
type: Component,
|
|
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
|
|
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"] }] } });
|
|
367
|
+
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\n (clickEvent)=\"btnPrimaryClickEvent.emit($event)\"\n [routerLink]=\"btnPrimaryRouterLink()\"\n [routerQueryParams]=\"btnPrimaryRouterQueryParams()\"\n [routerFragment]=\"btnPrimaryRouterFragment()\"\n [routerState]=\"btnPrimaryRouterState()\"\n >\n {{ btnPrimaryLabelText() }}\n </kern-button>\n }\n @if (btnSecondaryLabelText()) {\n <kern-button\n variant=\"secondary\"\n (clickEvent)=\"btnSecondaryClickEvent.emit($event)\"\n [routerLink]=\"btnSecondaryRouterLink()\"\n [routerQueryParams]=\"btnSecondaryRouterQueryParams()\"\n [routerFragment]=\"btnSecondaryRouterFragment()\"\n [routerState]=\"btnSecondaryRouterState()\"\n >\n {{ btnSecondaryLabelText() }}\n </kern-button>\n }\n </footer>\n }\n </div>\n</article>\n", styles: [":host{display:contents}\n"] }]
|
|
368
|
+
}], 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 }] }], btnPrimaryRouterLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnPrimaryRouterLink", required: false }] }], btnPrimaryRouterQueryParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnPrimaryRouterQueryParams", required: false }] }], btnPrimaryRouterFragment: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnPrimaryRouterFragment", required: false }] }], btnPrimaryRouterState: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnPrimaryRouterState", required: false }] }], btnSecondaryLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryLabelText", required: false }] }], btnSecondaryRouterLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryRouterLink", required: false }] }], btnSecondaryRouterQueryParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryRouterQueryParams", required: false }] }], btnSecondaryRouterFragment: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryRouterFragment", required: false }] }], btnSecondaryRouterState: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSecondaryRouterState", required: false }] }], titleLinkClickEvent: [{ type: i0.Output, args: ["titleLinkClickEvent"] }], btnPrimaryClickEvent: [{ type: i0.Output, args: ["btnPrimaryClickEvent"] }], btnSecondaryClickEvent: [{ type: i0.Output, args: ["btnSecondaryClickEvent"] }] } });
|
|
300
369
|
|
|
301
370
|
class KernDivider {
|
|
302
371
|
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : /* istanbul ignore next */ []));
|
|
303
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
304
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
372
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
373
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
374
|
}
|
|
306
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
375
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernDivider, decorators: [{
|
|
307
376
|
type: Component,
|
|
308
377
|
args: [{ selector: 'kern-divider', template: "<hr class=\"kern-divider\" [attr.aria-hidden]=\"ariaHidden()\" />\n" }]
|
|
309
378
|
}], propDecorators: { ariaHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaHidden", required: false }] }] } });
|
|
@@ -311,19 +380,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
311
380
|
class KernLink {
|
|
312
381
|
href = input(null, ...(ngDevMode ? [{ debugName: "href" }] : /* istanbul ignore next */ []));
|
|
313
382
|
target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
|
|
383
|
+
routerLink = input(null, ...(ngDevMode ? [{ debugName: "routerLink" }] : /* istanbul ignore next */ []));
|
|
384
|
+
routerQueryParams = input(null, ...(ngDevMode ? [{ debugName: "routerQueryParams" }] : /* istanbul ignore next */ []));
|
|
385
|
+
routerFragment = input(null, ...(ngDevMode ? [{ debugName: "routerFragment" }] : /* istanbul ignore next */ []));
|
|
386
|
+
routerState = input(null, ...(ngDevMode ? [{ debugName: "routerState" }] : /* istanbul ignore next */ []));
|
|
314
387
|
small = input(false, ...(ngDevMode ? [{ debugName: "small" }] : /* istanbul ignore next */ []));
|
|
315
388
|
stretched = input(false, ...(ngDevMode ? [{ debugName: "stretched" }] : /* istanbul ignore next */ []));
|
|
316
389
|
iconLeft = input(null, ...(ngDevMode ? [{ debugName: "iconLeft" }] : /* istanbul ignore next */ []));
|
|
317
390
|
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
|
|
318
391
|
linkDescribedBy = input(null, ...(ngDevMode ? [{ debugName: "linkDescribedBy" }] : /* istanbul ignore next */ []));
|
|
392
|
+
navigationService = inject(NavigationService);
|
|
319
393
|
clickEvent = output();
|
|
320
|
-
|
|
321
|
-
|
|
394
|
+
effectiveHref = computed(() => {
|
|
395
|
+
return (this.navigationService.serialize(this.routerLink(), this.routerQueryParams(), this.routerFragment()) ?? this.href());
|
|
396
|
+
}, ...(ngDevMode ? [{ debugName: "effectiveHref" }] : /* istanbul ignore next */ []));
|
|
397
|
+
onClick(event) {
|
|
398
|
+
if (this.target() === '_self') {
|
|
399
|
+
this.navigationService.navigate(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.routerState(), event);
|
|
400
|
+
}
|
|
401
|
+
this.clickEvent.emit(event);
|
|
402
|
+
}
|
|
403
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernLink, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
404
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, routerQueryParams: { classPropertyName: "routerQueryParams", publicName: "routerQueryParams", isSignal: true, isRequired: false, transformFunction: null }, routerFragment: { classPropertyName: "routerFragment", publicName: "routerFragment", isSignal: true, isRequired: false, transformFunction: null }, routerState: { classPropertyName: "routerState", publicName: "routerState", 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]=\"effectiveHref()\"\n [target]=\"target()\"\n [attr.rel]=\"target() === '_blank' ? 'noopener noreferrer' : null\"\n [attr.aria-describedby]=\"linkDescribedBy() || null\"\n (click)=\"onClick($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
405
|
}
|
|
323
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
406
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernLink, decorators: [{
|
|
324
407
|
type: Component,
|
|
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]=\"
|
|
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"] }] } });
|
|
408
|
+
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]=\"effectiveHref()\"\n [target]=\"target()\"\n [attr.rel]=\"target() === '_blank' ? 'noopener noreferrer' : null\"\n [attr.aria-describedby]=\"linkDescribedBy() || null\"\n (click)=\"onClick($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"] }]
|
|
409
|
+
}], propDecorators: { href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], routerLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerLink", required: false }] }], routerQueryParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerQueryParams", required: false }] }], routerFragment: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerFragment", required: false }] }], routerState: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerState", 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
410
|
|
|
328
411
|
class KernProgress {
|
|
329
412
|
progressId = input(...(ngDevMode ? [undefined, { debugName: "progressId" }] : /* istanbul ignore next */ []));
|
|
@@ -333,20 +416,20 @@ class KernProgress {
|
|
|
333
416
|
labelPosition = input('top', ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
|
|
334
417
|
generatedId = inject(UniqueIdService).getUniqueId('progress');
|
|
335
418
|
effectiveId = computed(() => this.progressId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
336
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
337
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
419
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
420
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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
421
|
}
|
|
339
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
422
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernProgress, decorators: [{
|
|
340
423
|
type: Component,
|
|
341
424
|
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
425
|
}], 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
426
|
|
|
344
427
|
class KernContainer {
|
|
345
428
|
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : /* istanbul ignore next */ []));
|
|
346
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
347
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
429
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
430
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
431
|
}
|
|
349
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernContainer, decorators: [{
|
|
350
433
|
type: Component,
|
|
351
434
|
args: [{ selector: 'kern-container', host: {
|
|
352
435
|
'[class.kern-container]': '!fluid()',
|
|
@@ -356,10 +439,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
356
439
|
|
|
357
440
|
class KernKopfzeile {
|
|
358
441
|
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : /* istanbul ignore next */ []));
|
|
359
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
360
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
442
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernKopfzeile, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
443
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
444
|
}
|
|
362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
445
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernKopfzeile, decorators: [{
|
|
363
446
|
type: Component,
|
|
364
447
|
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
448
|
}], propDecorators: { fluid: [{ type: i0.Input, args: [{ isSignal: true, alias: "fluid", required: false }] }] } });
|
|
@@ -420,10 +503,10 @@ class KernHeading {
|
|
|
420
503
|
};
|
|
421
504
|
return levelToSizeMap[level] || 'medium';
|
|
422
505
|
}
|
|
423
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
424
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
506
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernHeading, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
507
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
508
|
}
|
|
426
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
509
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernHeading, decorators: [{
|
|
427
510
|
type: Component,
|
|
428
511
|
args: [{ selector: 'kern-heading', template: `<ng-content />`, styles: [":host{display:contents}\n"] }]
|
|
429
512
|
}], propDecorators: { level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
@@ -431,10 +514,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
431
514
|
class KernBody {
|
|
432
515
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
433
516
|
weight = input('default', ...(ngDevMode ? [{ debugName: "weight" }] : /* istanbul ignore next */ []));
|
|
434
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
435
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
517
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernBody, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
518
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", 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
519
|
}
|
|
437
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
520
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernBody, decorators: [{
|
|
438
521
|
type: Directive,
|
|
439
522
|
args: [{
|
|
440
523
|
host: {
|
|
@@ -452,10 +535,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
452
535
|
class KernList {
|
|
453
536
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
454
537
|
type = input('simple', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
455
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
456
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
538
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernList, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
539
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", 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
540
|
}
|
|
458
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
541
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernList, decorators: [{
|
|
459
542
|
type: Directive,
|
|
460
543
|
args: [{
|
|
461
544
|
host: {
|
|
@@ -496,8 +579,8 @@ class ControlValueAccessorDirective {
|
|
|
496
579
|
setDisabledState(isDisabled) {
|
|
497
580
|
this.disabled.set(isDisabled);
|
|
498
581
|
}
|
|
499
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
500
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
582
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ControlValueAccessorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
583
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: ControlValueAccessorDirective, isStandalone: true, selector: "[kernControlValueAccessor]", providers: [
|
|
501
584
|
{
|
|
502
585
|
provide: NG_VALUE_ACCESSOR,
|
|
503
586
|
useExisting: forwardRef(() => ControlValueAccessorDirective),
|
|
@@ -505,7 +588,7 @@ class ControlValueAccessorDirective {
|
|
|
505
588
|
}
|
|
506
589
|
], ngImport: i0 });
|
|
507
590
|
}
|
|
508
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
591
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ControlValueAccessorDirective, decorators: [{
|
|
509
592
|
type: Directive,
|
|
510
593
|
args: [{
|
|
511
594
|
selector: '[kernControlValueAccessor]',
|
|
@@ -532,10 +615,10 @@ class KernInputCheckbox {
|
|
|
532
615
|
const { checked } = event.target;
|
|
533
616
|
this.cva.changeValue(checked);
|
|
534
617
|
}
|
|
535
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
536
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
618
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
619
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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
620
|
}
|
|
538
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
621
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputCheckbox, decorators: [{
|
|
539
622
|
type: Component,
|
|
540
623
|
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
624
|
}], 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 }] }] } });
|
|
@@ -543,13 +626,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
543
626
|
class KernInputError {
|
|
544
627
|
effectiveId = input.required(...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
545
628
|
text = input.required(...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
546
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
547
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
629
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputError, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
630
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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
631
|
<kern-icon name="danger" />
|
|
549
632
|
<span kernBody>{{ text() }}</span>
|
|
550
633
|
</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
634
|
}
|
|
552
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
635
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputError, decorators: [{
|
|
553
636
|
type: Component,
|
|
554
637
|
args: [{ selector: 'kern-input-error', imports: [KernIcon, KernBody], template: `<p class="kern-error" [id]="effectiveId() + '-error'" role="alert">
|
|
555
638
|
<kern-icon name="danger" />
|
|
@@ -564,14 +647,14 @@ class KernInputHint {
|
|
|
564
647
|
text: typeof value === 'string' ? value : ''
|
|
565
648
|
};
|
|
566
649
|
} });
|
|
567
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
568
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
650
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputHint, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
651
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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
652
|
<ng-container [ngTemplateOutlet]="templateRef" />
|
|
570
653
|
} @else {
|
|
571
654
|
{{ hint().text }}
|
|
572
655
|
}`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
573
656
|
}
|
|
574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
657
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputHint, decorators: [{
|
|
575
658
|
type: Component,
|
|
576
659
|
args: [{
|
|
577
660
|
selector: 'kern-input-hint',
|
|
@@ -602,10 +685,10 @@ class KernFieldset {
|
|
|
602
685
|
? this.effectiveId() + '-hint'
|
|
603
686
|
: null;
|
|
604
687
|
}, ...(ngDevMode ? [{ debugName: "fieldsetDescribedBy" }] : /* istanbul ignore next */ []));
|
|
605
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
606
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
688
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernFieldset, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
689
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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
690
|
}
|
|
608
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
691
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernFieldset, decorators: [{
|
|
609
692
|
type: Component,
|
|
610
693
|
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
694
|
}], 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 }] }] } });
|
|
@@ -793,8 +876,8 @@ class KernInputDate {
|
|
|
793
876
|
}
|
|
794
877
|
}
|
|
795
878
|
}
|
|
796
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
797
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.
|
|
879
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputDate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
880
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", 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
881
|
{
|
|
799
882
|
provide: NG_VALUE_ACCESSOR,
|
|
800
883
|
multi: true,
|
|
@@ -802,7 +885,7 @@ class KernInputDate {
|
|
|
802
885
|
}
|
|
803
886
|
], 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
887
|
}
|
|
805
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputDate, decorators: [{
|
|
806
889
|
type: Component,
|
|
807
890
|
args: [{ selector: 'kern-input-date', imports: [FormsModule, KernLabel, KernFieldset], providers: [
|
|
808
891
|
{
|
|
@@ -850,10 +933,10 @@ class KernInputEmail {
|
|
|
850
933
|
this.cva.markTouched();
|
|
851
934
|
}
|
|
852
935
|
}
|
|
853
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
854
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
936
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputEmail, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
937
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
855
938
|
}
|
|
856
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
939
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputEmail, decorators: [{
|
|
857
940
|
type: Component,
|
|
858
941
|
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" }]
|
|
859
942
|
}], 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 }] }] } });
|
|
@@ -891,10 +974,10 @@ class KernInputFile {
|
|
|
891
974
|
const { value } = event.target;
|
|
892
975
|
this.cva.changeValue(value);
|
|
893
976
|
}
|
|
894
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
895
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
977
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputFile, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
978
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
896
979
|
}
|
|
897
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
980
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputFile, decorators: [{
|
|
898
981
|
type: Component,
|
|
899
982
|
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" }]
|
|
900
983
|
}], 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 }] }] } });
|
|
@@ -939,10 +1022,10 @@ class KernInputNumber {
|
|
|
939
1022
|
this.cva.markTouched();
|
|
940
1023
|
}
|
|
941
1024
|
}
|
|
942
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
943
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1025
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputNumber, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1026
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
944
1027
|
}
|
|
945
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1028
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputNumber, decorators: [{
|
|
946
1029
|
type: Component,
|
|
947
1030
|
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" }]
|
|
948
1031
|
}], 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 }] }] } });
|
|
@@ -984,10 +1067,10 @@ class KernInputPassword {
|
|
|
984
1067
|
this.cva.markTouched();
|
|
985
1068
|
}
|
|
986
1069
|
}
|
|
987
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
988
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1070
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputPassword, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1071
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
989
1072
|
}
|
|
990
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1073
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputPassword, decorators: [{
|
|
991
1074
|
type: Component,
|
|
992
1075
|
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" }]
|
|
993
1076
|
}], 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 }] }] } });
|
|
@@ -1013,10 +1096,10 @@ class KernInputRadio {
|
|
|
1013
1096
|
this.cva.markTouched();
|
|
1014
1097
|
}
|
|
1015
1098
|
}
|
|
1016
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1017
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1099
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputRadio, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1100
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
1018
1101
|
}
|
|
1019
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1102
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputRadio, decorators: [{
|
|
1020
1103
|
type: Component,
|
|
1021
1104
|
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" }]
|
|
1022
1105
|
}], 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 }] }] } });
|
|
@@ -1057,10 +1140,10 @@ class KernInputSelect {
|
|
|
1057
1140
|
this.cva.markTouched();
|
|
1058
1141
|
}
|
|
1059
1142
|
}
|
|
1060
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1061
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1143
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1144
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
1062
1145
|
}
|
|
1063
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1146
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputSelect, decorators: [{
|
|
1064
1147
|
type: Component,
|
|
1065
1148
|
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" }]
|
|
1066
1149
|
}], 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 }] }] } });
|
|
@@ -1102,10 +1185,10 @@ class KernInputTel {
|
|
|
1102
1185
|
this.cva.markTouched();
|
|
1103
1186
|
}
|
|
1104
1187
|
}
|
|
1105
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1106
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1188
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputTel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1189
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
1107
1190
|
}
|
|
1108
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1191
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputTel, decorators: [{
|
|
1109
1192
|
type: Component,
|
|
1110
1193
|
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" }]
|
|
1111
1194
|
}], 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 }] }] } });
|
|
@@ -1149,10 +1232,10 @@ class KernInputText {
|
|
|
1149
1232
|
this.cva.markTouched();
|
|
1150
1233
|
}
|
|
1151
1234
|
}
|
|
1152
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1153
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1235
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1236
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 });
|
|
1154
1237
|
}
|
|
1155
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputText, decorators: [{
|
|
1156
1239
|
type: Component,
|
|
1157
1240
|
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" }]
|
|
1158
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 }] }], 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 }] }] } });
|
|
@@ -1187,10 +1270,10 @@ class KernInputTextarea {
|
|
|
1187
1270
|
const { value } = event.target;
|
|
1188
1271
|
this.cva.changeValue(value);
|
|
1189
1272
|
}
|
|
1190
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1191
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1273
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1274
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 });
|
|
1192
1275
|
}
|
|
1193
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1276
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputTextarea, decorators: [{
|
|
1194
1277
|
type: Component,
|
|
1195
1278
|
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" }]
|
|
1196
1279
|
}], 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 }] }] } });
|
|
@@ -1232,10 +1315,10 @@ class KernInputUrl {
|
|
|
1232
1315
|
this.cva.markTouched();
|
|
1233
1316
|
}
|
|
1234
1317
|
}
|
|
1235
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1236
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1318
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputUrl, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1319
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 });
|
|
1237
1320
|
}
|
|
1238
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernInputUrl, decorators: [{
|
|
1239
1322
|
type: Component,
|
|
1240
1323
|
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" }]
|
|
1241
1324
|
}], 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 }] }] } });
|
|
@@ -1252,10 +1335,10 @@ class KernTable {
|
|
|
1252
1335
|
getCellText(row, key) {
|
|
1253
1336
|
return row[key] ?? '';
|
|
1254
1337
|
}
|
|
1255
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1256
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1338
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1339
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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"] }] });
|
|
1257
1340
|
}
|
|
1258
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernTable, decorators: [{
|
|
1259
1342
|
type: Component,
|
|
1260
1343
|
args: [{ selector: 'kern-table', imports: [KernTitle], host: {
|
|
1261
1344
|
'[class.kern-table-responsive]': 'responsive()',
|
|
@@ -1266,10 +1349,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
1266
1349
|
class KernDescriptionList {
|
|
1267
1350
|
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
1268
1351
|
column = input(false, ...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1269
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1270
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1352
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernDescriptionList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1353
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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" });
|
|
1271
1354
|
}
|
|
1272
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernDescriptionList, decorators: [{
|
|
1273
1356
|
type: Component,
|
|
1274
1357
|
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" }]
|
|
1275
1358
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: false }] }] } });
|
|
@@ -1282,12 +1365,12 @@ class KernTasklist {
|
|
|
1282
1365
|
getGeneratedStatusId(taskIndex, itemIndex) {
|
|
1283
1366
|
return (this.generatedId + '_' + taskIndex.toString() + '_' + itemIndex.toString());
|
|
1284
1367
|
}
|
|
1285
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1286
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1368
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernTasklist, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1369
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 || item.routerLink) {\n <kern-link\n [href]=\"item.linkHref || null\"\n [routerLink]=\"item.routerLink || null\"\n [routerQueryParams]=\"item.routerQueryParams ?? null\"\n [routerFragment]=\"item.routerFragment || null\"\n [routerState]=\"item.routerState ?? null\"\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", "routerLink", "routerQueryParams", "routerFragment", "routerState", "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"] }] });
|
|
1287
1370
|
}
|
|
1288
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1371
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernTasklist, decorators: [{
|
|
1289
1372
|
type: Component,
|
|
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" }]
|
|
1373
|
+
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 || item.routerLink) {\n <kern-link\n [href]=\"item.linkHref || null\"\n [routerLink]=\"item.routerLink || null\"\n [routerQueryParams]=\"item.routerQueryParams ?? null\"\n [routerFragment]=\"item.routerFragment || null\"\n [routerState]=\"item.routerState ?? null\"\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" }]
|
|
1291
1374
|
}], 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 }] }] } });
|
|
1292
1375
|
|
|
1293
1376
|
class KernSummary {
|
|
@@ -1298,22 +1381,26 @@ class KernSummary {
|
|
|
1298
1381
|
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
1299
1382
|
actionLinkHref = input(null, ...(ngDevMode ? [{ debugName: "actionLinkHref" }] : /* istanbul ignore next */ []));
|
|
1300
1383
|
actionLinkTarget = input('_self', ...(ngDevMode ? [{ debugName: "actionLinkTarget" }] : /* istanbul ignore next */ []));
|
|
1384
|
+
actionLinkRouterLink = input(null, ...(ngDevMode ? [{ debugName: "actionLinkRouterLink" }] : /* istanbul ignore next */ []));
|
|
1385
|
+
actionLinkRouterQueryParams = input(null, ...(ngDevMode ? [{ debugName: "actionLinkRouterQueryParams" }] : /* istanbul ignore next */ []));
|
|
1386
|
+
actionLinkRouterFragment = input(null, ...(ngDevMode ? [{ debugName: "actionLinkRouterFragment" }] : /* istanbul ignore next */ []));
|
|
1387
|
+
actionLinkRouterState = input(null, ...(ngDevMode ? [{ debugName: "actionLinkRouterState" }] : /* istanbul ignore next */ []));
|
|
1301
1388
|
actionLinkClickEvent = output();
|
|
1302
1389
|
generatedTitleId = inject(UniqueIdService).getUniqueId('title');
|
|
1303
1390
|
effectiveTitleId = computed(() => this.titleId() ?? this.generatedTitleId, ...(ngDevMode ? [{ debugName: "effectiveTitleId" }] : /* istanbul ignore next */ []));
|
|
1304
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1305
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1391
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernSummary, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1392
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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 }, actionLinkRouterLink: { classPropertyName: "actionLinkRouterLink", publicName: "actionLinkRouterLink", isSignal: true, isRequired: false, transformFunction: null }, actionLinkRouterQueryParams: { classPropertyName: "actionLinkRouterQueryParams", publicName: "actionLinkRouterQueryParams", isSignal: true, isRequired: false, transformFunction: null }, actionLinkRouterFragment: { classPropertyName: "actionLinkRouterFragment", publicName: "actionLinkRouterFragment", isSignal: true, isRequired: false, transformFunction: null }, actionLinkRouterState: { classPropertyName: "actionLinkRouterState", publicName: "actionLinkRouterState", 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 [routerLink]=\"actionLinkRouterLink()\"\n [routerQueryParams]=\"actionLinkRouterQueryParams()\"\n [routerFragment]=\"actionLinkRouterFragment()\"\n [routerState]=\"actionLinkRouterState()\"\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", "routerLink", "routerQueryParams", "routerFragment", "routerState", "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"] }] });
|
|
1306
1393
|
}
|
|
1307
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1394
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernSummary, decorators: [{
|
|
1308
1395
|
type: Component,
|
|
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" }]
|
|
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"] }] } });
|
|
1396
|
+
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 [routerLink]=\"actionLinkRouterLink()\"\n [routerQueryParams]=\"actionLinkRouterQueryParams()\"\n [routerFragment]=\"actionLinkRouterFragment()\"\n [routerState]=\"actionLinkRouterState()\"\n (clickEvent)=\"actionLinkClickEvent.emit($event)\"\n >\n <span i18n=\"@@kernAngularKit.summary.actionLink\">Bearbeiten</span>\n </kern-link>\n </div>\n }\n</div>\n" }]
|
|
1397
|
+
}], 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 }] }], actionLinkRouterLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLinkRouterLink", required: false }] }], actionLinkRouterQueryParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLinkRouterQueryParams", required: false }] }], actionLinkRouterFragment: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLinkRouterFragment", required: false }] }], actionLinkRouterState: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLinkRouterState", required: false }] }], actionLinkClickEvent: [{ type: i0.Output, args: ["actionLinkClickEvent"] }] } });
|
|
1311
1398
|
|
|
1312
1399
|
class KernSummaryGroup {
|
|
1313
1400
|
heading = input(null, ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
|
|
1314
1401
|
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
1315
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1316
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1402
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernSummaryGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1403
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", 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: `
|
|
1317
1404
|
@if (heading()) {
|
|
1318
1405
|
<div class="kern-summary-group__header">
|
|
1319
1406
|
<kern-heading [level]="headingLevel()" size="medium">{{
|
|
@@ -1324,7 +1411,7 @@ class KernSummaryGroup {
|
|
|
1324
1411
|
<ng-content />
|
|
1325
1412
|
`, isInline: true, dependencies: [{ kind: "component", type: KernHeading, selector: "kern-heading", inputs: ["level", "size"] }] });
|
|
1326
1413
|
}
|
|
1327
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1414
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernSummaryGroup, decorators: [{
|
|
1328
1415
|
type: Component,
|
|
1329
1416
|
args: [{
|
|
1330
1417
|
selector: 'kern-summary-group',
|
|
@@ -1346,10 +1433,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
1346
1433
|
class KernRow {
|
|
1347
1434
|
verticalAlign = input(null, ...(ngDevMode ? [{ debugName: "verticalAlign" }] : /* istanbul ignore next */ []));
|
|
1348
1435
|
horizontalAlign = input(null, ...(ngDevMode ? [{ debugName: "horizontalAlign" }] : /* istanbul ignore next */ []));
|
|
1349
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1350
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
1436
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernRow, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1437
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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 });
|
|
1351
1438
|
}
|
|
1352
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1439
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernRow, decorators: [{
|
|
1353
1440
|
type: Component,
|
|
1354
1441
|
args: [{
|
|
1355
1442
|
selector: 'kern-row',
|
|
@@ -1399,10 +1486,10 @@ class KernCol {
|
|
|
1399
1486
|
}
|
|
1400
1487
|
return classes;
|
|
1401
1488
|
}
|
|
1402
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1403
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
1489
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernCol, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1490
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", 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 });
|
|
1404
1491
|
}
|
|
1405
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1492
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernCol, decorators: [{
|
|
1406
1493
|
type: Component,
|
|
1407
1494
|
args: [{
|
|
1408
1495
|
selector: 'kern-col',
|
|
@@ -1415,8 +1502,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.2", ngImpor
|
|
|
1415
1502
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }] } });
|
|
1416
1503
|
|
|
1417
1504
|
class KernAngularKitModule {
|
|
1418
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1419
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.
|
|
1505
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAngularKitModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1506
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.4", ngImport: i0, type: KernAngularKitModule, imports: [KernAccordion,
|
|
1420
1507
|
KernAccordionGroup,
|
|
1421
1508
|
KernAlert,
|
|
1422
1509
|
KernDialog,
|
|
@@ -1497,10 +1584,10 @@ class KernAngularKitModule {
|
|
|
1497
1584
|
KernTitle,
|
|
1498
1585
|
KernPreline,
|
|
1499
1586
|
KernSubline] });
|
|
1500
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.
|
|
1587
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAngularKitModule, imports: [KernInputDate,
|
|
1501
1588
|
KernInputFile] });
|
|
1502
1589
|
}
|
|
1503
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1590
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KernAngularKitModule, decorators: [{
|
|
1504
1591
|
type: NgModule,
|
|
1505
1592
|
args: [{
|
|
1506
1593
|
imports: [
|