@kern-ux-annex/kern-angular-kit 1.3.0 → 1.4.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,15 +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 { Router,
|
|
3
|
+
import { Router, UrlTree, ActivatedRoute } from '@angular/router';
|
|
4
4
|
import { LocationStrategy, NgTemplateOutlet } from '@angular/common';
|
|
5
5
|
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
|
|
6
6
|
|
|
7
7
|
class KernTitle {
|
|
8
8
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
9
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
10
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
9
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
10
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
11
11
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernTitle, decorators: [{
|
|
13
13
|
type: Directive,
|
|
14
14
|
args: [{
|
|
15
15
|
host: {
|
|
@@ -25,19 +25,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
25
25
|
class KernAccordion {
|
|
26
26
|
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
27
27
|
open = input(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
28
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
29
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
28
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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"] }] });
|
|
30
30
|
}
|
|
31
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAccordion, decorators: [{
|
|
32
32
|
type: Component,
|
|
33
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"] }]
|
|
34
34
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }] } });
|
|
35
35
|
|
|
36
36
|
class KernAccordionGroup {
|
|
37
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
38
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
37
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAccordionGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
38
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: KernAccordionGroup, isStandalone: true, selector: "kern-accordion-group", host: { classAttribute: "kern-accordion-group" }, ngImport: i0, template: `<ng-content />`, isInline: true });
|
|
39
39
|
}
|
|
40
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
40
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAccordionGroup, decorators: [{
|
|
41
41
|
type: Component,
|
|
42
42
|
args: [{
|
|
43
43
|
selector: 'kern-accordion-group',
|
|
@@ -50,10 +50,10 @@ class KernIcon {
|
|
|
50
50
|
name = input.required(...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
51
51
|
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : /* istanbul ignore next */ []));
|
|
52
52
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
53
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
54
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
53
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
54
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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"] });
|
|
55
55
|
}
|
|
56
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernIcon, decorators: [{
|
|
57
57
|
type: Component,
|
|
58
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"] }]
|
|
59
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 }] }] } });
|
|
@@ -61,10 +61,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
61
61
|
class KernAlert {
|
|
62
62
|
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
63
63
|
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
64
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
65
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
64
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAlert, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
65
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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"] }] });
|
|
66
66
|
}
|
|
67
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
67
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAlert, decorators: [{
|
|
68
68
|
type: Component,
|
|
69
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"] }]
|
|
70
70
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
|
|
@@ -74,10 +74,10 @@ class UniqueIdService {
|
|
|
74
74
|
getUniqueId(prefix = '') {
|
|
75
75
|
return prefix + '_' + (this.counter++).toString();
|
|
76
76
|
}
|
|
77
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
78
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
77
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: UniqueIdService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
78
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: UniqueIdService, providedIn: 'root' });
|
|
79
79
|
}
|
|
80
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
80
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: UniqueIdService, decorators: [{
|
|
81
81
|
type: Injectable,
|
|
82
82
|
args: [{
|
|
83
83
|
providedIn: 'root'
|
|
@@ -108,10 +108,10 @@ class KernLabel {
|
|
|
108
108
|
}
|
|
109
109
|
}
|
|
110
110
|
}
|
|
111
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
112
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
111
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
112
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
113
113
|
}
|
|
114
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernLabel, decorators: [{
|
|
115
115
|
type: Directive,
|
|
116
116
|
args: [{
|
|
117
117
|
host: {
|
|
@@ -127,11 +127,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
127
127
|
|
|
128
128
|
class NavigationService {
|
|
129
129
|
router = inject(Router, { optional: true });
|
|
130
|
-
route = inject(ActivatedRoute, { optional: true });
|
|
131
130
|
locationStrategy = inject(LocationStrategy, {
|
|
132
131
|
optional: true
|
|
133
132
|
});
|
|
134
|
-
serialize(routerLink, routerQueryParams = null, routerFragment = null) {
|
|
133
|
+
serialize(routerLink, routerQueryParams = null, routerFragment = null, activatedRoute = null) {
|
|
135
134
|
if (!routerLink || !this.router || !this.locationStrategy) {
|
|
136
135
|
return null;
|
|
137
136
|
}
|
|
@@ -141,14 +140,14 @@ class NavigationService {
|
|
|
141
140
|
}
|
|
142
141
|
else {
|
|
143
142
|
urlTree = this.router.createUrlTree(Array.isArray(routerLink) ? routerLink : [routerLink], {
|
|
144
|
-
relativeTo:
|
|
143
|
+
relativeTo: activatedRoute ?? undefined,
|
|
145
144
|
queryParams: routerQueryParams,
|
|
146
145
|
fragment: routerFragment || undefined
|
|
147
146
|
});
|
|
148
147
|
}
|
|
149
148
|
return this.locationStrategy.prepareExternalUrl(this.router.serializeUrl(urlTree));
|
|
150
149
|
}
|
|
151
|
-
navigate(routerLink, routerQueryParams = null, routerFragment = null, routerState = null, clickEvent = null) {
|
|
150
|
+
navigate(routerLink, routerQueryParams = null, routerFragment = null, routerState = null, clickEvent = null, activatedRoute = null) {
|
|
152
151
|
if (!routerLink || !this.router) {
|
|
153
152
|
return;
|
|
154
153
|
}
|
|
@@ -159,17 +158,17 @@ class NavigationService {
|
|
|
159
158
|
}
|
|
160
159
|
else {
|
|
161
160
|
this.router.navigate(Array.isArray(routerLink) ? routerLink : [routerLink], {
|
|
162
|
-
relativeTo:
|
|
161
|
+
relativeTo: activatedRoute ?? undefined,
|
|
163
162
|
queryParams: routerQueryParams,
|
|
164
163
|
fragment: routerFragment || undefined,
|
|
165
164
|
state: state
|
|
166
165
|
});
|
|
167
166
|
}
|
|
168
167
|
}
|
|
169
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
170
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
168
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: NavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
169
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: NavigationService, providedIn: 'root' });
|
|
171
170
|
}
|
|
172
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
171
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: NavigationService, decorators: [{
|
|
173
172
|
type: Injectable,
|
|
174
173
|
args: [{
|
|
175
174
|
providedIn: 'root'
|
|
@@ -189,16 +188,17 @@ class KernButton {
|
|
|
189
188
|
routerQueryParams = input(null, ...(ngDevMode ? [{ debugName: "routerQueryParams" }] : /* istanbul ignore next */ []));
|
|
190
189
|
routerFragment = input(null, ...(ngDevMode ? [{ debugName: "routerFragment" }] : /* istanbul ignore next */ []));
|
|
191
190
|
routerState = input(null, ...(ngDevMode ? [{ debugName: "routerState" }] : /* istanbul ignore next */ []));
|
|
191
|
+
activatedRoute = inject(ActivatedRoute, { optional: true });
|
|
192
192
|
navigationService = inject(NavigationService);
|
|
193
193
|
clickEvent = output();
|
|
194
194
|
onClick(event) {
|
|
195
|
-
this.navigationService.navigate(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.routerState(), event);
|
|
195
|
+
this.navigationService.navigate(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.routerState(), event, this.activatedRoute);
|
|
196
196
|
this.clickEvent.emit(event);
|
|
197
197
|
}
|
|
198
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
199
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
198
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
199
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
200
200
|
}
|
|
201
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
201
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernButton, decorators: [{
|
|
202
202
|
type: Component,
|
|
203
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
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"] }] } });
|
|
@@ -225,10 +225,10 @@ class ScrollLockService {
|
|
|
225
225
|
isLocked() {
|
|
226
226
|
return this.lockCount > 0;
|
|
227
227
|
}
|
|
228
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
229
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
228
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ScrollLockService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
229
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ScrollLockService, providedIn: 'root' });
|
|
230
230
|
}
|
|
231
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
231
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ScrollLockService, decorators: [{
|
|
232
232
|
type: Injectable,
|
|
233
233
|
args: [{
|
|
234
234
|
providedIn: 'root'
|
|
@@ -271,20 +271,20 @@ class KernDialog {
|
|
|
271
271
|
this.scrollLockService.unlock();
|
|
272
272
|
}
|
|
273
273
|
}
|
|
274
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
275
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
274
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
275
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
276
276
|
}
|
|
277
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
277
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernDialog, decorators: [{
|
|
278
278
|
type: Component,
|
|
279
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" }]
|
|
280
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 }] }] } });
|
|
281
281
|
|
|
282
282
|
class KernLoader {
|
|
283
283
|
text = input('Wird geladen...', ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
284
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
285
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
284
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernLoader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
285
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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" });
|
|
286
286
|
}
|
|
287
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernLoader, decorators: [{
|
|
288
288
|
type: Component,
|
|
289
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" }]
|
|
290
290
|
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }] } });
|
|
@@ -292,20 +292,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
292
292
|
class KernBadge {
|
|
293
293
|
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
294
294
|
icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
295
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
296
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
295
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
296
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
297
297
|
}
|
|
298
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
298
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernBadge, decorators: [{
|
|
299
299
|
type: Component,
|
|
300
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" }]
|
|
301
301
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
|
|
302
302
|
|
|
303
303
|
class KernPreline {
|
|
304
304
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
305
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
306
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
305
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernPreline, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
306
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
307
307
|
}
|
|
308
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
308
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernPreline, decorators: [{
|
|
309
309
|
type: Directive,
|
|
310
310
|
args: [{
|
|
311
311
|
host: {
|
|
@@ -320,10 +320,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
320
320
|
|
|
321
321
|
class KernSubline {
|
|
322
322
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
323
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
324
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
323
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernSubline, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
324
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
325
325
|
}
|
|
326
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
326
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernSubline, decorators: [{
|
|
327
327
|
type: Directive,
|
|
328
328
|
args: [{
|
|
329
329
|
host: {
|
|
@@ -359,20 +359,20 @@ class KernCard {
|
|
|
359
359
|
titleLinkClickEvent = output();
|
|
360
360
|
btnPrimaryClickEvent = output();
|
|
361
361
|
btnSecondaryClickEvent = output();
|
|
362
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
363
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
362
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
363
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
364
364
|
}
|
|
365
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
365
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernCard, decorators: [{
|
|
366
366
|
type: Component,
|
|
367
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
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"] }] } });
|
|
369
369
|
|
|
370
370
|
class KernDivider {
|
|
371
371
|
ariaHidden = input(true, ...(ngDevMode ? [{ debugName: "ariaHidden" }] : /* istanbul ignore next */ []));
|
|
372
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
373
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
372
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
373
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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" });
|
|
374
374
|
}
|
|
375
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
375
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernDivider, decorators: [{
|
|
376
376
|
type: Component,
|
|
377
377
|
args: [{ selector: 'kern-divider', template: "<hr class=\"kern-divider\" [attr.aria-hidden]=\"ariaHidden()\" />\n" }]
|
|
378
378
|
}], propDecorators: { ariaHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaHidden", required: false }] }] } });
|
|
@@ -389,21 +389,22 @@ class KernLink {
|
|
|
389
389
|
iconLeft = input(null, ...(ngDevMode ? [{ debugName: "iconLeft" }] : /* istanbul ignore next */ []));
|
|
390
390
|
iconRight = input(null, ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
|
|
391
391
|
linkDescribedBy = input(null, ...(ngDevMode ? [{ debugName: "linkDescribedBy" }] : /* istanbul ignore next */ []));
|
|
392
|
+
activatedRoute = inject(ActivatedRoute, { optional: true });
|
|
392
393
|
navigationService = inject(NavigationService);
|
|
393
394
|
clickEvent = output();
|
|
394
395
|
effectiveHref = computed(() => {
|
|
395
|
-
return (this.navigationService.serialize(this.routerLink(), this.routerQueryParams(), this.routerFragment()) ?? this.href());
|
|
396
|
+
return (this.navigationService.serialize(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.activatedRoute) ?? this.href());
|
|
396
397
|
}, ...(ngDevMode ? [{ debugName: "effectiveHref" }] : /* istanbul ignore next */ []));
|
|
397
398
|
onClick(event) {
|
|
398
399
|
if (this.target() === '_self') {
|
|
399
|
-
this.navigationService.navigate(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.routerState(), event);
|
|
400
|
+
this.navigationService.navigate(this.routerLink(), this.routerQueryParams(), this.routerFragment(), this.routerState(), event, this.activatedRoute);
|
|
400
401
|
}
|
|
401
402
|
this.clickEvent.emit(event);
|
|
402
403
|
}
|
|
403
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
404
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
404
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernLink, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
405
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
405
406
|
}
|
|
406
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
407
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernLink, decorators: [{
|
|
407
408
|
type: Component,
|
|
408
409
|
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
410
|
}], 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"] }] } });
|
|
@@ -416,20 +417,20 @@ class KernProgress {
|
|
|
416
417
|
labelPosition = input('top', ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
|
|
417
418
|
generatedId = inject(UniqueIdService).getUniqueId('progress');
|
|
418
419
|
effectiveId = computed(() => this.progressId() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
419
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
420
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
420
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
421
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
421
422
|
}
|
|
422
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
423
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernProgress, decorators: [{
|
|
423
424
|
type: Component,
|
|
424
425
|
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" }]
|
|
425
426
|
}], 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 }] }] } });
|
|
426
427
|
|
|
427
428
|
class KernContainer {
|
|
428
429
|
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : /* istanbul ignore next */ []));
|
|
429
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
430
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
430
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
431
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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"] });
|
|
431
432
|
}
|
|
432
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
433
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernContainer, decorators: [{
|
|
433
434
|
type: Component,
|
|
434
435
|
args: [{ selector: 'kern-container', host: {
|
|
435
436
|
'[class.kern-container]': '!fluid()',
|
|
@@ -439,10 +440,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
439
440
|
|
|
440
441
|
class KernKopfzeile {
|
|
441
442
|
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid" }] : /* istanbul ignore next */ []));
|
|
442
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
443
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
443
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernKopfzeile, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
444
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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"] }] });
|
|
444
445
|
}
|
|
445
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
446
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernKopfzeile, decorators: [{
|
|
446
447
|
type: Component,
|
|
447
448
|
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"] }]
|
|
448
449
|
}], propDecorators: { fluid: [{ type: i0.Input, args: [{ isSignal: true, alias: "fluid", required: false }] }] } });
|
|
@@ -503,10 +504,10 @@ class KernHeading {
|
|
|
503
504
|
};
|
|
504
505
|
return levelToSizeMap[level] || 'medium';
|
|
505
506
|
}
|
|
506
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
507
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
507
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernHeading, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
508
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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"] });
|
|
508
509
|
}
|
|
509
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
510
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernHeading, decorators: [{
|
|
510
511
|
type: Component,
|
|
511
512
|
args: [{ selector: 'kern-heading', template: `<ng-content />`, styles: [":host{display:contents}\n"] }]
|
|
512
513
|
}], propDecorators: { level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
@@ -514,10 +515,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
514
515
|
class KernBody {
|
|
515
516
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
516
517
|
weight = input('default', ...(ngDevMode ? [{ debugName: "weight" }] : /* istanbul ignore next */ []));
|
|
517
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
518
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
518
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernBody, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
519
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
519
520
|
}
|
|
520
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
521
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernBody, decorators: [{
|
|
521
522
|
type: Directive,
|
|
522
523
|
args: [{
|
|
523
524
|
host: {
|
|
@@ -535,10 +536,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
535
536
|
class KernList {
|
|
536
537
|
size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
537
538
|
type = input('simple', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
538
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
539
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
539
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernList, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
540
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
540
541
|
}
|
|
541
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
542
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernList, decorators: [{
|
|
542
543
|
type: Directive,
|
|
543
544
|
args: [{
|
|
544
545
|
host: {
|
|
@@ -579,8 +580,8 @@ class ControlValueAccessorDirective {
|
|
|
579
580
|
setDisabledState(isDisabled) {
|
|
580
581
|
this.disabled.set(isDisabled);
|
|
581
582
|
}
|
|
582
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
583
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
583
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ControlValueAccessorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
584
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: ControlValueAccessorDirective, isStandalone: true, selector: "[kernControlValueAccessor]", providers: [
|
|
584
585
|
{
|
|
585
586
|
provide: NG_VALUE_ACCESSOR,
|
|
586
587
|
useExisting: forwardRef(() => ControlValueAccessorDirective),
|
|
@@ -588,7 +589,7 @@ class ControlValueAccessorDirective {
|
|
|
588
589
|
}
|
|
589
590
|
], ngImport: i0 });
|
|
590
591
|
}
|
|
591
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
592
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ControlValueAccessorDirective, decorators: [{
|
|
592
593
|
type: Directive,
|
|
593
594
|
args: [{
|
|
594
595
|
selector: '[kernControlValueAccessor]',
|
|
@@ -615,10 +616,10 @@ class KernInputCheckbox {
|
|
|
615
616
|
const { checked } = event.target;
|
|
616
617
|
this.cva.changeValue(checked);
|
|
617
618
|
}
|
|
618
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
619
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
619
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
620
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
620
621
|
}
|
|
621
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
622
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputCheckbox, decorators: [{
|
|
622
623
|
type: Component,
|
|
623
624
|
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" }]
|
|
624
625
|
}], 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 }] }] } });
|
|
@@ -626,13 +627,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
626
627
|
class KernInputError {
|
|
627
628
|
effectiveId = input.required(...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
|
|
628
629
|
text = input.required(...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
629
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
630
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
630
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputError, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
631
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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">
|
|
631
632
|
<kern-icon name="danger" />
|
|
632
633
|
<span kernBody>{{ text() }}</span>
|
|
633
634
|
</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"] }] });
|
|
634
635
|
}
|
|
635
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
636
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputError, decorators: [{
|
|
636
637
|
type: Component,
|
|
637
638
|
args: [{ selector: 'kern-input-error', imports: [KernIcon, KernBody], template: `<p class="kern-error" [id]="effectiveId() + '-error'" role="alert">
|
|
638
639
|
<kern-icon name="danger" />
|
|
@@ -647,30 +648,25 @@ class KernInputHint {
|
|
|
647
648
|
text: typeof value === 'string' ? value : ''
|
|
648
649
|
};
|
|
649
650
|
} });
|
|
650
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
651
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
651
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputHint, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
652
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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) {
|
|
652
653
|
<ng-container [ngTemplateOutlet]="templateRef" />
|
|
653
654
|
} @else {
|
|
654
655
|
{{ hint().text }}
|
|
655
|
-
}`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
656
|
+
}`, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
656
657
|
}
|
|
657
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
658
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputHint, decorators: [{
|
|
658
659
|
type: Component,
|
|
659
|
-
args: [{
|
|
660
|
-
selector: 'kern-input-hint',
|
|
661
|
-
imports: [NgTemplateOutlet],
|
|
662
|
-
host: { class: 'kern-hint' },
|
|
663
|
-
template: `@if (hint().template; as templateRef) {
|
|
660
|
+
args: [{ selector: 'kern-input-hint', imports: [NgTemplateOutlet], host: { class: 'kern-hint' }, template: `@if (hint().template; as templateRef) {
|
|
664
661
|
<ng-container [ngTemplateOutlet]="templateRef" />
|
|
665
662
|
} @else {
|
|
666
663
|
{{ hint().text }}
|
|
667
|
-
}
|
|
668
|
-
}]
|
|
664
|
+
}`, styles: [":host{display:block}\n"] }]
|
|
669
665
|
}], propDecorators: { hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: true }] }] } });
|
|
670
666
|
|
|
671
667
|
class KernFieldset {
|
|
672
668
|
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : /* istanbul ignore next */ []));
|
|
673
|
-
legendText = input
|
|
669
|
+
legendText = input(null, ...(ngDevMode ? [{ debugName: "legendText" }] : /* istanbul ignore next */ []));
|
|
674
670
|
legendSize = input('large', ...(ngDevMode ? [{ debugName: "legendSize" }] : /* istanbul ignore next */ []));
|
|
675
671
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
676
672
|
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
@@ -685,17 +681,17 @@ class KernFieldset {
|
|
|
685
681
|
? this.effectiveId() + '-hint'
|
|
686
682
|
: null;
|
|
687
683
|
}, ...(ngDevMode ? [{ debugName: "fieldsetDescribedBy" }] : /* istanbul ignore next */ []));
|
|
688
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
689
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
684
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernFieldset, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
685
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (legendText()) {\n <legend kernLabel [size]=\"legendSize()\" [optional]=\"optional()\">\n {{ legendText() }}\n </legend>\n }\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"] }] });
|
|
690
686
|
}
|
|
691
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
687
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernFieldset, decorators: [{
|
|
692
688
|
type: Component,
|
|
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
|
|
694
|
-
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], legendText: [{ type: i0.Input, args: [{ isSignal: true, alias: "legendText", required:
|
|
689
|
+
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 @if (legendText()) {\n <legend kernLabel [size]=\"legendSize()\" [optional]=\"optional()\">\n {{ legendText() }}\n </legend>\n }\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" }]
|
|
690
|
+
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], legendText: [{ type: i0.Input, args: [{ isSignal: true, alias: "legendText", required: false }] }], 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 }] }] } });
|
|
695
691
|
|
|
696
692
|
class KernInputDate {
|
|
697
693
|
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : /* istanbul ignore next */ []));
|
|
698
|
-
labelText = input
|
|
694
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
699
695
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
700
696
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
701
697
|
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
@@ -876,8 +872,8 @@ class KernInputDate {
|
|
|
876
872
|
}
|
|
877
873
|
}
|
|
878
874
|
}
|
|
879
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
880
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.
|
|
875
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputDate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
876
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.6", 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: false, 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: [
|
|
881
877
|
{
|
|
882
878
|
provide: NG_VALUE_ACCESSOR,
|
|
883
879
|
multi: true,
|
|
@@ -885,7 +881,7 @@ class KernInputDate {
|
|
|
885
881
|
}
|
|
886
882
|
], 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"] }] });
|
|
887
883
|
}
|
|
888
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
884
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputDate, decorators: [{
|
|
889
885
|
type: Component,
|
|
890
886
|
args: [{ selector: 'kern-input-date', imports: [FormsModule, KernLabel, KernFieldset], providers: [
|
|
891
887
|
{
|
|
@@ -894,12 +890,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
894
890
|
useExisting: forwardRef(() => KernInputDate)
|
|
895
891
|
}
|
|
896
892
|
], 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" }]
|
|
897
|
-
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
893
|
+
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", 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 }] }], dayInput: [{ type: i0.ViewChild, args: ['dayInput', { isSignal: true }] }], monthInput: [{ type: i0.ViewChild, args: ['monthInput', { isSignal: true }] }], yearInput: [{ type: i0.ViewChild, args: ['yearInput', { isSignal: true }] }] } });
|
|
898
894
|
|
|
899
895
|
class KernInputEmail {
|
|
900
896
|
cva = inject(ControlValueAccessorDirective);
|
|
901
897
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
902
|
-
labelText = input
|
|
898
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
903
899
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
904
900
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
905
901
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -933,18 +929,18 @@ class KernInputEmail {
|
|
|
933
929
|
this.cva.markTouched();
|
|
934
930
|
}
|
|
935
931
|
}
|
|
936
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
937
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
932
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputEmail, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
933
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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"] }] });
|
|
938
934
|
}
|
|
939
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
935
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputEmail, decorators: [{
|
|
940
936
|
type: Component,
|
|
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
|
|
942
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
937
|
+
args: [{ selector: 'kern-input-email', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n @if (labelText()) {\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
938
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
943
939
|
|
|
944
940
|
class KernInputFile {
|
|
945
941
|
cva = inject(ControlValueAccessorDirective);
|
|
946
942
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
947
|
-
labelText = input
|
|
943
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
948
944
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
949
945
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
950
946
|
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
@@ -974,18 +970,18 @@ class KernInputFile {
|
|
|
974
970
|
const { value } = event.target;
|
|
975
971
|
this.cva.changeValue(value);
|
|
976
972
|
}
|
|
977
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
978
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
973
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputFile, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
974
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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"] }] });
|
|
979
975
|
}
|
|
980
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
976
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputFile, decorators: [{
|
|
981
977
|
type: Component,
|
|
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
|
|
983
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
978
|
+
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 @if (labelText()) {\n <label kernLabel [for]=\"effectiveId()\" [id]=\"effectiveId() + '-label'\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
979
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
984
980
|
|
|
985
981
|
class KernInputNumber {
|
|
986
982
|
cva = inject(ControlValueAccessorDirective);
|
|
987
983
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
988
|
-
labelText = input
|
|
984
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
989
985
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
990
986
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
991
987
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -1022,18 +1018,18 @@ class KernInputNumber {
|
|
|
1022
1018
|
this.cva.markTouched();
|
|
1023
1019
|
}
|
|
1024
1020
|
}
|
|
1025
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1026
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1021
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputNumber, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1022
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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"] }] });
|
|
1027
1023
|
}
|
|
1028
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1024
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputNumber, decorators: [{
|
|
1029
1025
|
type: Component,
|
|
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
|
|
1031
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1026
|
+
args: [{ selector: 'kern-input-number', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1027
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1032
1028
|
|
|
1033
1029
|
class KernInputPassword {
|
|
1034
1030
|
cva = inject(ControlValueAccessorDirective);
|
|
1035
1031
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1036
|
-
labelText = input
|
|
1032
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1037
1033
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1038
1034
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1039
1035
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -1067,18 +1063,18 @@ class KernInputPassword {
|
|
|
1067
1063
|
this.cva.markTouched();
|
|
1068
1064
|
}
|
|
1069
1065
|
}
|
|
1070
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1071
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1066
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputPassword, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1067
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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"] }] });
|
|
1072
1068
|
}
|
|
1073
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1069
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputPassword, decorators: [{
|
|
1074
1070
|
type: Component,
|
|
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
|
|
1076
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1071
|
+
args: [{ selector: 'kern-input-password', imports: [KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1072
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1077
1073
|
|
|
1078
1074
|
class KernInputRadio {
|
|
1079
1075
|
cva = inject(ControlValueAccessorDirective);
|
|
1080
1076
|
fieldsetId = input(...(ngDevMode ? [undefined, { debugName: "fieldsetId" }] : /* istanbul ignore next */ []));
|
|
1081
|
-
labelText = input
|
|
1077
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1082
1078
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1083
1079
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1084
1080
|
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
@@ -1096,18 +1092,18 @@ class KernInputRadio {
|
|
|
1096
1092
|
this.cva.markTouched();
|
|
1097
1093
|
}
|
|
1098
1094
|
}
|
|
1099
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1100
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1095
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputRadio, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1096
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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"] }] });
|
|
1101
1097
|
}
|
|
1102
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1098
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputRadio, decorators: [{
|
|
1103
1099
|
type: Component,
|
|
1104
1100
|
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" }]
|
|
1105
|
-
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1101
|
+
}], propDecorators: { fieldsetId: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldsetId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1106
1102
|
|
|
1107
1103
|
class KernInputSelect {
|
|
1108
1104
|
cva = inject(ControlValueAccessorDirective);
|
|
1109
1105
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1110
|
-
labelText = input
|
|
1106
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1111
1107
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1112
1108
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1113
1109
|
hintTemplate = input(null, ...(ngDevMode ? [{ debugName: "hintTemplate" }] : /* istanbul ignore next */ []));
|
|
@@ -1140,18 +1136,18 @@ class KernInputSelect {
|
|
|
1140
1136
|
this.cva.markTouched();
|
|
1141
1137
|
}
|
|
1142
1138
|
}
|
|
1143
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1144
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1139
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1140
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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"] }] });
|
|
1145
1141
|
}
|
|
1146
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputSelect, decorators: [{
|
|
1147
1143
|
type: Component,
|
|
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
|
|
1149
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1144
|
+
args: [{ selector: 'kern-input-select', imports: [KernInputError, KernInputHint, KernLabel], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1145
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1150
1146
|
|
|
1151
1147
|
class KernInputTel {
|
|
1152
1148
|
cva = inject(ControlValueAccessorDirective);
|
|
1153
1149
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1154
|
-
labelText = input
|
|
1150
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1155
1151
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1156
1152
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1157
1153
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -1185,18 +1181,18 @@ class KernInputTel {
|
|
|
1185
1181
|
this.cva.markTouched();
|
|
1186
1182
|
}
|
|
1187
1183
|
}
|
|
1188
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1189
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1184
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputTel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1185
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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"] }] });
|
|
1190
1186
|
}
|
|
1191
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1187
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputTel, decorators: [{
|
|
1192
1188
|
type: Component,
|
|
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
|
|
1194
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1189
|
+
args: [{ selector: 'kern-input-tel', imports: [KernInputError, KernLabel, KernInputHint], hostDirectives: [ControlValueAccessorDirective], template: "<div class=\"kern-form-input\" [class.kern-form-input--error]=\"errorText()\">\n @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1190
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1195
1191
|
|
|
1196
1192
|
class KernInputText {
|
|
1197
1193
|
cva = inject(ControlValueAccessorDirective);
|
|
1198
1194
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1199
|
-
labelText = input
|
|
1195
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1200
1196
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1201
1197
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1202
1198
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -1232,18 +1228,18 @@ class KernInputText {
|
|
|
1232
1228
|
this.cva.markTouched();
|
|
1233
1229
|
}
|
|
1234
1230
|
}
|
|
1235
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1236
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1231
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1232
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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 });
|
|
1237
1233
|
}
|
|
1238
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1234
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputText, decorators: [{
|
|
1239
1235
|
type: Component,
|
|
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
|
|
1241
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1236
|
+
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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1237
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1242
1238
|
|
|
1243
1239
|
class KernInputTextarea {
|
|
1244
1240
|
cva = inject(ControlValueAccessorDirective);
|
|
1245
1241
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1246
|
-
labelText = input
|
|
1242
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1247
1243
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1248
1244
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1249
1245
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -1270,18 +1266,18 @@ class KernInputTextarea {
|
|
|
1270
1266
|
const { value } = event.target;
|
|
1271
1267
|
this.cva.changeValue(value);
|
|
1272
1268
|
}
|
|
1273
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1274
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1269
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1270
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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 });
|
|
1275
1271
|
}
|
|
1276
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputTextarea, decorators: [{
|
|
1277
1273
|
type: Component,
|
|
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
|
|
1279
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1274
|
+
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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1275
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1280
1276
|
|
|
1281
1277
|
class KernInputUrl {
|
|
1282
1278
|
cva = inject(ControlValueAccessorDirective);
|
|
1283
1279
|
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1284
|
-
labelText = input
|
|
1280
|
+
labelText = input(null, ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
|
|
1285
1281
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
1286
1282
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1287
1283
|
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
@@ -1315,13 +1311,13 @@ class KernInputUrl {
|
|
|
1315
1311
|
this.cva.markTouched();
|
|
1316
1312
|
}
|
|
1317
1313
|
}
|
|
1318
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1319
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1314
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputUrl, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1315
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: false, 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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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 });
|
|
1320
1316
|
}
|
|
1321
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1317
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernInputUrl, decorators: [{
|
|
1322
1318
|
type: Component,
|
|
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
|
|
1324
|
-
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required:
|
|
1319
|
+
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 @if (labelText()) {\n <label kernLabel [id]=\"effectiveId() + '-label'\" [for]=\"effectiveId()\" [optional]=\"optional()\">\n {{ labelText() }}\n </label>\n }\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" }]
|
|
1320
|
+
}], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], 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 }] }] } });
|
|
1325
1321
|
|
|
1326
1322
|
class KernTable {
|
|
1327
1323
|
responsive = input(true, ...(ngDevMode ? [{ debugName: "responsive" }] : /* istanbul ignore next */ []));
|
|
@@ -1335,10 +1331,10 @@ class KernTable {
|
|
|
1335
1331
|
getCellText(row, key) {
|
|
1336
1332
|
return row[key] ?? '';
|
|
1337
1333
|
}
|
|
1338
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1339
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1334
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1335
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
1340
1336
|
}
|
|
1341
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1337
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernTable, decorators: [{
|
|
1342
1338
|
type: Component,
|
|
1343
1339
|
args: [{ selector: 'kern-table', imports: [KernTitle], host: {
|
|
1344
1340
|
'[class.kern-table-responsive]': 'responsive()',
|
|
@@ -1349,10 +1345,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
1349
1345
|
class KernDescriptionList {
|
|
1350
1346
|
items = input.required(...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
1351
1347
|
column = input(false, ...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1352
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1353
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1348
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernDescriptionList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1349
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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" });
|
|
1354
1350
|
}
|
|
1355
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1351
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernDescriptionList, decorators: [{
|
|
1356
1352
|
type: Component,
|
|
1357
1353
|
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" }]
|
|
1358
1354
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: false }] }] } });
|
|
@@ -1365,10 +1361,10 @@ class KernTasklist {
|
|
|
1365
1361
|
getGeneratedStatusId(taskIndex, itemIndex) {
|
|
1366
1362
|
return (this.generatedId + '_' + taskIndex.toString() + '_' + itemIndex.toString());
|
|
1367
1363
|
}
|
|
1368
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1369
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1364
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernTasklist, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1365
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
1370
1366
|
}
|
|
1371
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1367
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernTasklist, decorators: [{
|
|
1372
1368
|
type: Component,
|
|
1373
1369
|
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" }]
|
|
1374
1370
|
}], 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 }] }] } });
|
|
@@ -1388,10 +1384,10 @@ class KernSummary {
|
|
|
1388
1384
|
actionLinkClickEvent = output();
|
|
1389
1385
|
generatedTitleId = inject(UniqueIdService).getUniqueId('title');
|
|
1390
1386
|
effectiveTitleId = computed(() => this.titleId() ?? this.generatedTitleId, ...(ngDevMode ? [{ debugName: "effectiveTitleId" }] : /* istanbul ignore next */ []));
|
|
1391
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1392
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1387
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernSummary, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1388
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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"] }] });
|
|
1393
1389
|
}
|
|
1394
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1390
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernSummary, decorators: [{
|
|
1395
1391
|
type: Component,
|
|
1396
1392
|
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
1393
|
}], 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"] }] } });
|
|
@@ -1399,8 +1395,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
1399
1395
|
class KernSummaryGroup {
|
|
1400
1396
|
heading = input(null, ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
|
|
1401
1397
|
headingLevel = input('2', ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
|
|
1402
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1403
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1398
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernSummaryGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1399
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", 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: `
|
|
1404
1400
|
@if (heading()) {
|
|
1405
1401
|
<div class="kern-summary-group__header">
|
|
1406
1402
|
<kern-heading [level]="headingLevel()" size="medium">{{
|
|
@@ -1411,7 +1407,7 @@ class KernSummaryGroup {
|
|
|
1411
1407
|
<ng-content />
|
|
1412
1408
|
`, isInline: true, dependencies: [{ kind: "component", type: KernHeading, selector: "kern-heading", inputs: ["level", "size"] }] });
|
|
1413
1409
|
}
|
|
1414
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1410
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernSummaryGroup, decorators: [{
|
|
1415
1411
|
type: Component,
|
|
1416
1412
|
args: [{
|
|
1417
1413
|
selector: 'kern-summary-group',
|
|
@@ -1433,10 +1429,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
1433
1429
|
class KernRow {
|
|
1434
1430
|
verticalAlign = input(null, ...(ngDevMode ? [{ debugName: "verticalAlign" }] : /* istanbul ignore next */ []));
|
|
1435
1431
|
horizontalAlign = input(null, ...(ngDevMode ? [{ debugName: "horizontalAlign" }] : /* istanbul ignore next */ []));
|
|
1436
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1437
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
1432
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernRow, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1433
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
1438
1434
|
}
|
|
1439
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1435
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernRow, decorators: [{
|
|
1440
1436
|
type: Component,
|
|
1441
1437
|
args: [{
|
|
1442
1438
|
selector: 'kern-row',
|
|
@@ -1486,10 +1482,10 @@ class KernCol {
|
|
|
1486
1482
|
}
|
|
1487
1483
|
return classes;
|
|
1488
1484
|
}
|
|
1489
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1490
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
1485
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernCol, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1486
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", 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 });
|
|
1491
1487
|
}
|
|
1492
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1488
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernCol, decorators: [{
|
|
1493
1489
|
type: Component,
|
|
1494
1490
|
args: [{
|
|
1495
1491
|
selector: 'kern-col',
|
|
@@ -1502,8 +1498,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
1502
1498
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }] } });
|
|
1503
1499
|
|
|
1504
1500
|
class KernAngularKitModule {
|
|
1505
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1506
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.
|
|
1501
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAngularKitModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1502
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.6", ngImport: i0, type: KernAngularKitModule, imports: [KernAccordion,
|
|
1507
1503
|
KernAccordionGroup,
|
|
1508
1504
|
KernAlert,
|
|
1509
1505
|
KernDialog,
|
|
@@ -1584,10 +1580,10 @@ class KernAngularKitModule {
|
|
|
1584
1580
|
KernTitle,
|
|
1585
1581
|
KernPreline,
|
|
1586
1582
|
KernSubline] });
|
|
1587
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.
|
|
1583
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAngularKitModule, imports: [KernInputDate,
|
|
1588
1584
|
KernInputFile] });
|
|
1589
1585
|
}
|
|
1590
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1586
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: KernAngularKitModule, decorators: [{
|
|
1591
1587
|
type: NgModule,
|
|
1592
1588
|
args: [{
|
|
1593
1589
|
imports: [
|