@energinet/watt 4.3.32 → 4.3.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/core/styles/spacing/+storybook/storybook-spacing-overview.component.scss +11 -0
- package/core/styles/spacing/_baseline.scss +1 -0
- package/core/styles/spacing/_inset.scss +9 -0
- package/core/styles/spacing/_spacing.import.scss +9 -0
- package/fesm2022/energinet-watt-badge.mjs +3 -3
- package/fesm2022/energinet-watt-breadcrumbs.mjs +6 -6
- package/fesm2022/energinet-watt-button.mjs +3 -3
- package/fesm2022/energinet-watt-card.mjs +6 -6
- package/fesm2022/energinet-watt-checkbox.mjs +3 -3
- package/fesm2022/energinet-watt-chip.mjs +27 -27
- package/fesm2022/energinet-watt-clipboard.mjs +6 -6
- package/fesm2022/energinet-watt-code.mjs +6 -6
- package/fesm2022/energinet-watt-core-breakpoints.mjs +3 -3
- package/fesm2022/energinet-watt-core-color.mjs +3 -3
- package/fesm2022/energinet-watt-core-date.mjs +12 -7
- package/fesm2022/energinet-watt-core-date.mjs.map +1 -1
- package/fesm2022/energinet-watt-data.mjs +12 -12
- package/fesm2022/energinet-watt-datetime-field.mjs +3 -3
- package/fesm2022/energinet-watt-description-list.mjs +6 -6
- package/fesm2022/energinet-watt-drawer.mjs +15 -15
- package/fesm2022/energinet-watt-dropdown.mjs +3 -3
- package/fesm2022/energinet-watt-dropzone.mjs +12 -12
- package/fesm2022/energinet-watt-empty-state.mjs +18 -18
- package/fesm2022/energinet-watt-expandable-card.mjs +9 -9
- package/fesm2022/energinet-watt-field.mjs +15 -15
- package/fesm2022/energinet-watt-file-field.mjs +3 -3
- package/fesm2022/energinet-watt-heading.mjs +3 -3
- package/fesm2022/energinet-watt-icon-flags.mjs +30 -30
- package/fesm2022/energinet-watt-icon.mjs +3 -3
- package/fesm2022/energinet-watt-json-viewer.mjs +9 -9
- package/fesm2022/energinet-watt-menu.mjs +12 -12
- package/fesm2022/energinet-watt-modal.mjs +9 -9
- package/fesm2022/energinet-watt-paginator.mjs +6 -6
- package/fesm2022/energinet-watt-phone-field.mjs +6 -6
- package/fesm2022/energinet-watt-picker-__shared.mjs +6 -6
- package/fesm2022/energinet-watt-picker-datepicker.mjs +6 -6
- package/fesm2022/energinet-watt-picker-timepicker.mjs +3 -3
- package/fesm2022/energinet-watt-progress-tracker.mjs +6 -6
- package/fesm2022/energinet-watt-query-params.mjs +3 -3
- package/fesm2022/energinet-watt-radio.mjs +6 -6
- package/fesm2022/energinet-watt-search.mjs +6 -6
- package/fesm2022/energinet-watt-segmented-buttons.mjs +6 -6
- package/fesm2022/energinet-watt-separator.mjs +3 -3
- package/fesm2022/energinet-watt-shell.mjs +12 -12
- package/fesm2022/energinet-watt-slide-toggle.mjs +3 -3
- package/fesm2022/energinet-watt-slider.mjs +3 -3
- package/fesm2022/energinet-watt-spinner.mjs +3 -3
- package/fesm2022/energinet-watt-stepper.mjs +6 -6
- package/fesm2022/energinet-watt-table.mjs +9 -9
- package/fesm2022/energinet-watt-tabs.mjs +15 -15
- package/fesm2022/energinet-watt-text-field.mjs +3 -3
- package/fesm2022/energinet-watt-textarea-field.mjs +6 -6
- package/fesm2022/energinet-watt-toast.mjs +6 -6
- package/fesm2022/energinet-watt-tooltip.mjs +6 -6
- package/fesm2022/energinet-watt-utils-css.mjs +3 -3
- package/fesm2022/energinet-watt-utils-intersection-observer.mjs +3 -3
- package/fesm2022/energinet-watt-utils-resize-observer.mjs +6 -6
- package/fesm2022/energinet-watt-validation-message.mjs +3 -3
- package/fesm2022/energinet-watt-vater.mjs +24 -24
- package/fesm2022/energinet-watt-year-field.mjs +3 -3
- package/fesm2022/energinet-watt-yearmonth-field.mjs +3 -3
- package/package.json +9 -9
- package/types/energinet-watt-core-date.d.ts +11 -26
|
@@ -40,8 +40,8 @@ class WattRadioComponent {
|
|
|
40
40
|
setDisabledState = (isDisabled) => this.disabled.set(isDisabled);
|
|
41
41
|
registerOnTouched = (fn) => this.touched.subscribe(fn);
|
|
42
42
|
registerOnChange = (fn) => this.isChecked.subscribe(() => fn(this.value()));
|
|
43
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
44
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.
|
|
43
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
44
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.6", type: WattRadioComponent, isStandalone: true, selector: "watt-radio", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", checked: "checkedChange", isChecked: "isChecked", touched: "touched" }, host: { properties: { "class.disabled": "disabled()" } }, providers: [
|
|
45
45
|
{
|
|
46
46
|
provide: NG_VALUE_ACCESSOR,
|
|
47
47
|
useExisting: forwardRef(() => WattRadioComponent),
|
|
@@ -62,7 +62,7 @@ class WattRadioComponent {
|
|
|
62
62
|
</label>
|
|
63
63
|
`, isInline: true, styles: [":root{--watt-radio-color: var(--watt-on-light-low-emphasis);--watt-radio-color-hover: var(--watt-on-light-medium-emphasis);--watt-radio-color-focus: var(--watt-color-primary);--watt-radio-color-checked: var(--watt-color-primary);--watt-radio-color-checked-hover: var(--watt-color-primary-dark);--watt-radio-color-checked-focus: var(--watt-color-primary-dark);--watt-disabled-radio-color: var(--watt-color-neutral-grey-500);--watt-radio-label-color: var(--watt-on-light-high-emphasis);--watt-disabled-radio-label-color: var(--watt-on-light-low-emphasis)}watt-radio{padding:2px 0}watt-radio:not(:has(:disabled)) label,watt-radio:not(:has(:disabled)) input{cursor:pointer}watt-radio label{display:flex;align-items:center;color:var(--watt-radio-label-color)}watt-radio label.disabled{color:var(--watt-radio-disabled-label-color)}watt-radio input[type=radio]{width:16px;height:16px;min-width:16px;min-height:16px;appearance:none;margin:0 var(--watt-space-s) 0 0;background:var(--watt-radio-color);border-radius:50%;display:grid;place-content:center}watt-radio input[type=radio]:before{content:\"\";width:14px;height:14px;border-radius:50%;transform:scale(1);transition:var(--watt-time-extra-short) transform var(--watt-ease-linear);background:var(--watt-color-neutral-white)}watt-radio input[type=radio]:checked{background:var(--watt-radio-color-checked)}watt-radio input[type=radio]:checked:before{transform:scale(.33)}watt-radio input:focus{outline:none}watt-radio input:not(:disabled):hover{background:var(--watt-radio-color-hover)}watt-radio input:not(:disabled):hover:checked{background:var(--watt-radio-color-checked-hover)}watt-radio input:not(:disabled):focus-visible{background:var(--watt-radio-color-focus)}watt-radio input:not(:disabled):focus-visible:checked{background:var(--watt-radio-color-checked-focus)}watt-radio.disabled{--watt-radio-label-color: var(--watt-disabled-radio-label-color);--watt-radio-color: var(--watt-disabled-radio-color);--watt-radio-color-checked: var(--watt-disabled-radio-color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
64
64
|
}
|
|
65
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattRadioComponent, decorators: [{
|
|
66
66
|
type: Component,
|
|
67
67
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
68
68
|
{
|
|
@@ -170,8 +170,8 @@ class WattRadioGroupComponent {
|
|
|
170
170
|
setDisabledState = (isDisabled) => this.disabled.set(isDisabled);
|
|
171
171
|
registerOnTouched = (fn) => this.touched.subscribe(fn);
|
|
172
172
|
registerOnChange = (fn) => this.value.subscribe(fn);
|
|
173
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
174
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.
|
|
173
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
174
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.6", type: WattRadioGroupComponent, isStandalone: true, selector: "watt-radio-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, formControl: { classPropertyName: "formControl", publicName: "formControl", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", disabled: "disabledChange", touched: "touched" }, host: { properties: { "class.disabled": "disabled()", "class.readonly": "readonly()" } }, providers: [
|
|
175
175
|
{
|
|
176
176
|
provide: NG_VALUE_ACCESSOR,
|
|
177
177
|
useExisting: forwardRef(() => WattRadioGroupComponent),
|
|
@@ -183,7 +183,7 @@ class WattRadioGroupComponent {
|
|
|
183
183
|
</watt-field>
|
|
184
184
|
`, isInline: true, styles: ["watt-radio-group.readonly watt-radio{pointer-events:none}watt-radio-group.readonly watt-radio input,watt-radio-group.readonly watt-radio:has(input:not(:checked)){display:none}\n"], dependencies: [{ kind: "component", type: WattFieldComponent, selector: "watt-field", inputs: ["control", "label", "id", "chipMode", "tooltip", "placeholder", "anchorName", "displayMode", "autoFocus", "showErrors"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
185
185
|
}
|
|
186
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
186
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattRadioGroupComponent, decorators: [{
|
|
187
187
|
type: Component,
|
|
188
188
|
args: [{ imports: [WattFieldComponent], providers: [
|
|
189
189
|
{
|
|
@@ -69,8 +69,8 @@ class WattSearchComponent {
|
|
|
69
69
|
element.value = '';
|
|
70
70
|
this.onInput(element.value);
|
|
71
71
|
}
|
|
72
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
73
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.
|
|
72
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
73
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.6", type: WattSearchComponent, isStandalone: true, selector: "watt-search", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null }, trim: { classPropertyName: "trim", publicName: "trim", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { search: "search" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
74
74
|
<label>
|
|
75
75
|
<input
|
|
76
76
|
#input
|
|
@@ -91,7 +91,7 @@ class WattSearchComponent {
|
|
|
91
91
|
</label>
|
|
92
92
|
`, isInline: true, styles: [":host{height:44px}label{display:inline-block;width:100%;position:relative;text-transform:none;overflow:hidden;pointer-events:none}input{font-size:.875rem;line-height:1.25rem;font-weight:400;text-transform:none;letter-spacing:0;font-family:inherit;width:100%;height:44px;padding-left:var(--watt-space-l);padding-right:12px;border:1px solid var(--watt-on-light-low-emphasis);border-radius:4px;outline:0;opacity:0;transition-property:opacity}.wrapper{display:inline-flex;position:absolute;left:100%;width:100%;height:100%;transition-property:transform}.button{display:inline-flex;gap:var(--watt-space-xs);align-items:center;height:44px;padding:0 16px;color:var(--watt-color-primary);transform:translate(-100%);transition-property:transform;pointer-events:auto;cursor:pointer}.button:hover{color:var(--watt-color-primary-dark)}.text{opacity:1;transition-property:opacity}.clear{position:absolute;top:50%;right:var(--watt-space-s);padding:var(--watt-space-xs);border:none;border-radius:4px;background:none;color:var(--watt-color-primary);transform:translateY(-50%);cursor:pointer;pointer-events:auto}.clear:focus-visible{outline:2px solid var(--watt-color-primary)}input:placeholder-shown~.clear{display:none}input,.wrapper,.button,.text{transition-duration:.3s;transition-timing-function:cubic-bezier(.75,0,.25,1)}input{transition-timing-function:cubic-bezier(0,.5,0,1)}input:focus{border:1px solid var(--watt-color-primary)}input:not(:placeholder-shown),input:focus{pointer-events:auto;opacity:1;transition-timing-function:cubic-bezier(1,0,.5,0)}input:not(:placeholder-shown)+.wrapper,input:focus+.wrapper{transform:translate(-100%)}input:not(:placeholder-shown)+.wrapper .button,input:focus+.wrapper .button{pointer-events:none;transform:translate(-6px)}input:not(:placeholder-shown)+.wrapper .text,input:focus+.wrapper .text{opacity:0}\n"], dependencies: [{ kind: "component", type: WattIconComponent, selector: "watt-icon", inputs: ["name", "label", "size", "state"] }] });
|
|
93
93
|
}
|
|
94
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
94
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSearchComponent, decorators: [{
|
|
95
95
|
type: Component,
|
|
96
96
|
args: [{ imports: [WattIconComponent], selector: 'watt-search', template: `
|
|
97
97
|
<label>
|
|
@@ -158,8 +158,8 @@ class WattSimpleSearchComponent {
|
|
|
158
158
|
element.value = '';
|
|
159
159
|
this.onInput(element.value);
|
|
160
160
|
}
|
|
161
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
162
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.
|
|
161
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSimpleSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
162
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.6", type: WattSimpleSearchComponent, isStandalone: true, selector: "watt-simple-search", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null }, trim: { classPropertyName: "trim", publicName: "trim", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { search: "search" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
163
163
|
<watt-field>
|
|
164
164
|
<watt-icon name="search" [size]="size()" />
|
|
165
165
|
<input
|
|
@@ -175,7 +175,7 @@ class WattSimpleSearchComponent {
|
|
|
175
175
|
</watt-field>
|
|
176
176
|
`, isInline: true, styles: [":host{height:44px;min-height:44px}.clear{position:absolute;top:50%;right:var(--watt-space-s);padding:var(--watt-space-xs);border:none;border-radius:4px;background:none;color:var(--watt-color-primary);transform:translateY(-50%);cursor:pointer;pointer-events:auto}.clear:focus-visible{outline:2px solid var(--watt-color-primary)}input:placeholder-shown~.clear{display:none}\n"], dependencies: [{ kind: "component", type: WattIconComponent, selector: "watt-icon", inputs: ["name", "label", "size", "state"] }, { kind: "component", type: WattFieldComponent, selector: "watt-field", inputs: ["control", "label", "id", "chipMode", "tooltip", "placeholder", "anchorName", "displayMode", "autoFocus", "showErrors"] }] });
|
|
177
177
|
}
|
|
178
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
178
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSimpleSearchComponent, decorators: [{
|
|
179
179
|
type: Component,
|
|
180
180
|
args: [{ imports: [WattIconComponent, WattFieldComponent], selector: 'watt-simple-search', template: `
|
|
181
181
|
<watt-field>
|
|
@@ -29,12 +29,12 @@ class WattSegmentedButtonComponent {
|
|
|
29
29
|
templateRef = viewChild.required(TemplateRef);
|
|
30
30
|
value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
|
|
31
31
|
link = input(...(ngDevMode ? [undefined, { debugName: "link" }] : []));
|
|
32
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
33
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.
|
|
32
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSegmentedButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
33
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.6", type: WattSegmentedButtonComponent, isStandalone: true, selector: "watt-segmented-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: ` <ng-template>
|
|
34
34
|
<ng-content />
|
|
35
35
|
</ng-template>`, isInline: true });
|
|
36
36
|
}
|
|
37
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
37
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSegmentedButtonComponent, decorators: [{
|
|
38
38
|
type: Component,
|
|
39
39
|
args: [{
|
|
40
40
|
selector: 'watt-segmented-button',
|
|
@@ -82,8 +82,8 @@ class WattSegmentedButtonsComponent {
|
|
|
82
82
|
setDisabledState(isDisabled) {
|
|
83
83
|
this.disabled.set(isDisabled);
|
|
84
84
|
}
|
|
85
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
86
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.
|
|
85
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSegmentedButtonsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
86
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: WattSegmentedButtonsComponent, isStandalone: true, selector: "watt-segmented-buttons", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, providers: [
|
|
87
87
|
{
|
|
88
88
|
provide: NG_VALUE_ACCESSOR,
|
|
89
89
|
useExisting: forwardRef(() => WattSegmentedButtonsComponent),
|
|
@@ -110,7 +110,7 @@ class WattSegmentedButtonsComponent {
|
|
|
110
110
|
</mat-button-toggle-group>
|
|
111
111
|
`, isInline: true, styles: ["@use \"@energinet/watt/utils\" as watt;@use \"@angular/material\" as mat;:root{@include mat.button-toggle-overrides((selected-state-text-color: white,selected-state-background-color: var(--watt-color-primary),height: 2.5rem,));}:root mat-button-toggle-group{border-color:var(--watt-color-neutral-grey-700)}:root mat-button-toggle-group mat-button-toggle{border-color:var(--watt-color-neutral-grey-700)!important}:root mat-button-toggle-group mat-button-toggle button{min-width:6.5rem}:root mat-button-toggle-group mat-button-toggle button span{font-size:.875rem;font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLinkWithHref, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
112
112
|
}
|
|
113
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
113
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSegmentedButtonsComponent, decorators: [{
|
|
114
114
|
type: Component,
|
|
115
115
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
|
|
116
116
|
MatButtonToggleModule,
|
|
@@ -26,10 +26,10 @@ import { input, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@a
|
|
|
26
26
|
class WattSeparatorComponent {
|
|
27
27
|
weight = input('regular', ...(ngDevMode ? [{ debugName: "weight" }] : []));
|
|
28
28
|
orientation = input('horizontal', ...(ngDevMode ? [{ debugName: "orientation" }] : []));
|
|
29
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
30
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.
|
|
29
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.6", type: WattSeparatorComponent, isStandalone: true, selector: "watt-separator", inputs: { weight: { classPropertyName: "weight", publicName: "weight", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-orientation": "orientation()", "attr.role": "\"separator\"", "class": "\"watt-separator--\" + orientation() + \" watt-separator--\" + weight()" } }, ngImport: i0, template: '', isInline: true, styles: ["watt-separator{display:block;border-color:var(--watt-color-neutral-grey-300);border-style:solid;border-width:0}watt-separator.watt-separator--horizontal{width:100%;border-top-width:1px}watt-separator.watt-separator--horizontal.watt-separator--bold{border-top-width:2px}watt-separator.watt-separator--vertical{align-self:stretch;height:auto;border-left-width:1px}watt-separator.watt-separator--vertical.watt-separator--bold{border-left-width:2px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSeparatorComponent, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
34
|
args: [{ selector: 'watt-separator', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
35
35
|
'[attr.aria-orientation]': 'orientation()',
|
|
@@ -53,10 +53,10 @@ class WattShellComponent {
|
|
|
53
53
|
}
|
|
54
54
|
});
|
|
55
55
|
}
|
|
56
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
57
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.
|
|
56
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
57
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: WattShellComponent, isStandalone: true, selector: "watt-shell", viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["drawer"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<mat-sidenav-container class=\"watt-sidenav-container\">\n <mat-sidenav\n #drawer\n class=\"watt-sidenav\"\n [disableClose]=\"isHandset() === false\"\n [mode]=\"isHandset() ? 'over' : 'side'\"\n [opened]=\"isHandset() === false\"\n role=\"navigation\"\n >\n @if (isHandset()) {\n <watt-button\n variant=\"icon\"\n icon=\"close\"\n class=\"watt-sidenav-close-button\"\n (click)=\"drawer.toggle()\"\n />\n }\n <ng-content select=\"[watt-shell-sidenav]\" />\n </mat-sidenav>\n\n <mat-sidenav-content class=\"watt-sidenav-content\">\n <mat-toolbar class=\"watt-toolbar\">\n @if (isHandset()) {\n <watt-button variant=\"icon\" icon=\"menu\" (click)=\"drawer.toggle()\" />\n }\n\n <ng-content select=\"[watt-shell-toolbar]\" />\n </mat-toolbar>\n\n <main class=\"watt-main-content\">\n <ng-content />\n </main>\n </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:block}.watt-sidenav-container{height:100vh}.watt-sidenav-close-button{position:absolute;top:10px;right:0}.mat-drawer{overflow-y:visible}.watt-sidenav{width:245px;background-color:var(--watt-sidenav-background-color)}@media(max-width:1279.98px){.watt-sidenav{width:289px}}.watt-sidenav.mat-drawer-over.mat-drawer-opened .watt-sidenav-close-button{opacity:1}.watt-sidenav.mat-drawer-over .watt-sidenav-close-button{opacity:0;transition:opacity 50ms linear}.watt-sidenav.mat-drawer-over .watt-sidenav-close-button ::ng-deep .mat-mdc-button.mat-icon{color:var(--watt-color-neutral-white)}.watt-sidenav-content{display:grid;grid-template-rows:auto minmax(30rem,1fr)}.watt-main-content{position:relative;height:100%}.watt-toolbar{position:sticky;top:0;background-color:var(--watt-color-neutral-white);border-bottom:1px solid var(--watt-color-neutral-grey-300);height:var(--watt-space-xl);z-index:2}.watt-main-content,.watt-toolbar{width:100vw}@media(min-width:1280px){.watt-main-content,.watt-toolbar{width:calc(100vw - 245px)}}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i1.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i1.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i1.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: WattButtonComponent, selector: "watt-button", inputs: ["icon", "variant", "size", "type", "formId", "disabled", "loading"] }] });
|
|
58
58
|
}
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattShellComponent, decorators: [{
|
|
60
60
|
type: Component,
|
|
61
61
|
args: [{ selector: 'watt-shell', imports: [MatSidenavModule, MatToolbarModule, WattButtonComponent], template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<mat-sidenav-container class=\"watt-sidenav-container\">\n <mat-sidenav\n #drawer\n class=\"watt-sidenav\"\n [disableClose]=\"isHandset() === false\"\n [mode]=\"isHandset() ? 'over' : 'side'\"\n [opened]=\"isHandset() === false\"\n role=\"navigation\"\n >\n @if (isHandset()) {\n <watt-button\n variant=\"icon\"\n icon=\"close\"\n class=\"watt-sidenav-close-button\"\n (click)=\"drawer.toggle()\"\n />\n }\n <ng-content select=\"[watt-shell-sidenav]\" />\n </mat-sidenav>\n\n <mat-sidenav-content class=\"watt-sidenav-content\">\n <mat-toolbar class=\"watt-toolbar\">\n @if (isHandset()) {\n <watt-button variant=\"icon\" icon=\"menu\" (click)=\"drawer.toggle()\" />\n }\n\n <ng-content select=\"[watt-shell-toolbar]\" />\n </mat-toolbar>\n\n <main class=\"watt-main-content\">\n <ng-content />\n </main>\n </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:block}.watt-sidenav-container{height:100vh}.watt-sidenav-close-button{position:absolute;top:10px;right:0}.mat-drawer{overflow-y:visible}.watt-sidenav{width:245px;background-color:var(--watt-sidenav-background-color)}@media(max-width:1279.98px){.watt-sidenav{width:289px}}.watt-sidenav.mat-drawer-over.mat-drawer-opened .watt-sidenav-close-button{opacity:1}.watt-sidenav.mat-drawer-over .watt-sidenav-close-button{opacity:0;transition:opacity 50ms linear}.watt-sidenav.mat-drawer-over .watt-sidenav-close-button ::ng-deep .mat-mdc-button.mat-icon{color:var(--watt-color-neutral-white)}.watt-sidenav-content{display:grid;grid-template-rows:auto minmax(30rem,1fr)}.watt-main-content{position:relative;height:100%}.watt-toolbar{position:sticky;top:0;background-color:var(--watt-color-neutral-white);border-bottom:1px solid var(--watt-color-neutral-grey-300);height:var(--watt-space-xl);z-index:2}.watt-main-content,.watt-toolbar{width:100vw}@media(min-width:1280px){.watt-main-content,.watt-toolbar{width:calc(100vw - 245px)}}\n"] }]
|
|
62
62
|
}], ctorParameters: () => [], propDecorators: { sidenav: [{ type: i0.ViewChild, args: ['drawer', { isSignal: true }] }] } });
|
|
@@ -94,10 +94,10 @@ class WattExpandOnActiveLinkDirective {
|
|
|
94
94
|
}
|
|
95
95
|
}, ...(ngDevMode ? [{ debugName: "navListItemsEffect" }] : []));
|
|
96
96
|
wattNavListItemComponents = input([], ...(ngDevMode ? [{ debugName: "wattNavListItemComponents" }] : []));
|
|
97
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
98
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.
|
|
97
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattExpandOnActiveLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
98
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.6", type: WattExpandOnActiveLinkDirective, isStandalone: true, selector: "[wattExpandOnActiveLink]", inputs: { wattNavListItemComponents: { classPropertyName: "wattNavListItemComponents", publicName: "wattNavListItemComponents", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["wattExpandOnActiveLink"], ngImport: i0 });
|
|
99
99
|
}
|
|
100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattExpandOnActiveLinkDirective, decorators: [{
|
|
101
101
|
type: Directive,
|
|
102
102
|
args: [{
|
|
103
103
|
selector: '[wattExpandOnActiveLink]',
|
|
@@ -137,8 +137,8 @@ class WattNavListItemComponent {
|
|
|
137
137
|
onRouterLinkActive(isActive) {
|
|
138
138
|
this.isActive.emit(isActive);
|
|
139
139
|
}
|
|
140
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
141
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.
|
|
140
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattNavListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
141
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: WattNavListItemComponent, isStandalone: true, selector: "watt-nav-list-item", inputs: { link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: true, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isActive: "isActive" }, ngImport: i0, template: `
|
|
142
142
|
@if (isExternalLink()) {
|
|
143
143
|
<a [href]="link()" [attr.target]="target()"
|
|
144
144
|
><ng-container *ngTemplateOutlet="templateContent"
|
|
@@ -157,7 +157,7 @@ class WattNavListItemComponent {
|
|
|
157
157
|
</ng-template>
|
|
158
158
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
159
159
|
}
|
|
160
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
160
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattNavListItemComponent, decorators: [{
|
|
161
161
|
type: Component,
|
|
162
162
|
args: [{
|
|
163
163
|
selector: 'watt-nav-list-item',
|
|
@@ -209,8 +209,8 @@ class WattNavListComponent {
|
|
|
209
209
|
navListItemComponents = contentChildren(WattNavListItemComponent, ...(ngDevMode ? [{ debugName: "navListItemComponents" }] : []));
|
|
210
210
|
expandable = input(false, ...(ngDevMode ? [{ debugName: "expandable" }] : []));
|
|
211
211
|
title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
212
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
213
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.
|
|
212
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
213
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: WattNavListComponent, isStandalone: true, selector: "watt-nav-list", inputs: { expandable: { classPropertyName: "expandable", publicName: "expandable", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.watt-nav-list--expandable": "expandable()" } }, queries: [{ propertyName: "navListItemComponents", predicate: WattNavListItemComponent, isSignal: true }], ngImport: i0, template: `
|
|
214
214
|
@if (expandable()) {
|
|
215
215
|
<mat-expansion-panel
|
|
216
216
|
wattExpandOnActiveLink
|
|
@@ -231,7 +231,7 @@ class WattNavListComponent {
|
|
|
231
231
|
</ng-template>
|
|
232
232
|
`, isInline: true, styles: ["watt-nav-list{background-color:var(--watt-sidenav-background-color)}watt-nav-list watt-nav-list-item{display:block}watt-nav-list watt-nav-list-item a{padding:var(--watt-space-s) var(--watt-space-m);padding:var(--watt-space-s);display:block;border-left:var(--watt-space-xs) solid transparent;border-radius:var(--watt-space-s);color:var(--watt-color-neutral-white);text-decoration:none}watt-nav-list watt-nav-list-item a:hover{transition:background-color linear var(--watt-faster-than-a-blink-of-an-eye)}watt-nav-list watt-nav-list-item a:hover{background-color:var(--watt-nav-list-hover-background-color)}watt-nav-list watt-nav-list-item a.active{background-color:var(--watt-nav-list-active-background-color)}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel{background-color:var(--watt-sidenav-background-color);margin:0;border-radius:0}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel-header.mat-expanded:hover,watt-nav-list.watt-nav-list--expandable .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover:not([aria-disabled=true]){transition:background-color linear var(--watt-faster-than-a-blink-of-an-eye);background-color:var(--watt-nav-list-hover-background-color)}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel-header{border-radius:var(--watt-space-s);padding-left:calc(var(--watt-space-xs) + var(--watt-space-s));height:40px}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel-header-title{color:var(--watt-color-neutral-white)}watt-nav-list.watt-nav-list--expandable .mat-expansion-indicator:after{color:var(--watt-color-neutral-white);position:relative;top:-3px}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel-body{padding:0}watt-nav-list.watt-nav-list--expandable watt-nav-list-item a{padding-left:var(--watt-space-m)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i1$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: WattExpandOnActiveLinkDirective, selector: "[wattExpandOnActiveLink]", inputs: ["wattNavListItemComponents"], exportAs: ["wattExpandOnActiveLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
233
233
|
}
|
|
234
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
234
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattNavListComponent, decorators: [{
|
|
235
235
|
type: Component,
|
|
236
236
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, selector: 'watt-nav-list', host: {
|
|
237
237
|
'[class.watt-nav-list--expandable]': 'expandable()',
|
|
@@ -43,8 +43,8 @@ class WattSlideToggleComponent {
|
|
|
43
43
|
setDisabledState(isDisabled) {
|
|
44
44
|
this.isDisabled.set(isDisabled);
|
|
45
45
|
}
|
|
46
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
47
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.
|
|
46
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSlideToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
47
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.6", type: WattSlideToggleComponent, isStandalone: true, selector: "watt-slide-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, providers: [
|
|
48
48
|
{
|
|
49
49
|
provide: NG_VALUE_ACCESSOR,
|
|
50
50
|
useExisting: forwardRef(() => WattSlideToggleComponent),
|
|
@@ -59,7 +59,7 @@ class WattSlideToggleComponent {
|
|
|
59
59
|
><ng-content
|
|
60
60
|
/></mat-slide-toggle>`, isInline: true, styles: ["watt-slide-toggle .mat-mdc-slide-toggle{--mat-slide-toggle-track-outline-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-selected-track-outline-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-unselected-handle-horizontal-margin: 0 8px;--mat-slide-toggle-unselected-pressed-handle-horizontal-margin: 0 8px;--mat-slide-toggle-selected-handle-horizontal-margin: 0 -8px;--mat-slide-toggle-selected-pressed-handle-horizontal-margin: 0 -8px;--mat-slide-toggle-unselected-hover-handle-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-unselected-pressed-handle-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-unselected-handle-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-unselected-focus-handle-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-selected-track-outline-width: 0px}watt-slide-toggle .mat-mdc-slide-toggle:focus-within{--mat-slide-toggle-track-outline-color: var(--watt-color-primary)}watt-slide-toggle .mat-mdc-slide-toggle * label{font-size:.875rem;line-height:1.25rem;font-weight:400;text-transform:none;letter-spacing:0;padding-left:8px}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch__track{--mat-slide-toggle-track-shape: 100px;--mat-slide-toggle-track-height: 32px;--mat-slide-toggle-unselected-track-color: var(--watt-color-neutral-white);--mat-slide-toggle-unselected-hover-track-color: var(--watt-color-neutral-white);--mat-slide-toggle-unselected-focus-track-color: var(--watt-color-neutral-white);--mat-slide-toggle-unselected-pressed-track-color: var(--watt-color-neutral-white);--mat-slide-toggle-selected-track-color: var(--watt-color-primary);--mat-slide-toggle-selected-pressed-track-color: var(--watt-color-primary);--mat-slide-toggle-selected-hover-track-color: var(--watt-color-primary);--mat-slide-toggle-selected-focus-track-color: var(--watt-color-primary)}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch{--mat-slide-toggle-track-width: 52px;--mat-slide-toggle-handle-elevation-shadow: none}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch__handle{--mat-slide-toggle-handle-surface-color: var(--watt-on-light-low-emphasis);--mat-slide-toggle-handle-width: 16px;--mat-slide-toggle-handle-height: 16px;--mat-slide-toggle-handle-shape: 24px;--mat-slide-toggle-unselected-handle-size: 16px;--mat-slide-toggle-pressed-handle-size: 16px;--mat-slide-toggle-selected-handle-size: 16px;--mat-slide-toggle-selected-pressed-handle-size: 16px}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch__handle,watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch--selected{--mat-slide-toggle-selected-handle-color: var(--watt-color-neutral-white);--mat-slide-toggle-selected-hover-handle-color: var(--watt-color-neutral-white);--mat-slide-toggle-selected-focus-handle-color: var(--watt-color-neutral-white);--mat-slide-toggle-handle-surface-color: var(--watt-color-neutral-white)}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch__handle,watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch--unselected:enabled:hover:not(:focus):not(:active){--mat-slide-toggle-unselected-hover-handle-color: var(--watt-on-light-low-emphasis)}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch__handle-track{--mat-slide-toggle-handle-width: 16px}watt-slide-toggle .mat-mdc-slide-toggle .mdc-switch__ripple{display:none}\n"], dependencies: [{ kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
61
61
|
}
|
|
62
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
62
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSlideToggleComponent, decorators: [{
|
|
63
63
|
type: Component,
|
|
64
64
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MatSlideToggleModule, FormsModule], providers: [
|
|
65
65
|
{
|
|
@@ -111,10 +111,10 @@ class WattSliderComponent {
|
|
|
111
111
|
${this.sliderColor} ${(toPosition / rangeDistance) * 100}%,
|
|
112
112
|
${this.sliderColor} 100%)`;
|
|
113
113
|
}
|
|
114
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
115
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.
|
|
114
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
115
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.6", type: WattSliderComponent, isStandalone: true, selector: "watt-slider", inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "maxRange", first: true, predicate: ["maxRange"], descendants: true, isSignal: true }, { propertyName: "minRange", first: true, predicate: ["minRange"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<div class=\"controls\">\n <input\n #minRange\n class=\"min-range\"\n [style.z-index]=\"1\"\n [style.height]=\"0\"\n type=\"range\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()?.min\"\n />\n <input\n #maxRange\n class=\"max-range\"\n type=\"range\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()?.max\"\n />\n</div>\n", styles: ["watt-slider{display:flex;flex-direction:column;margin:var(--watt-space-m) 0}watt-slider .controls{position:relative}watt-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:all;width:var(--watt-space-ml);height:var(--watt-space-ml);background-color:var(--watt-color-primary-dark);border-radius:50%;box-shadow:0 0 0 1px var(--watt-color-primary);cursor:pointer}watt-slider input[type=range]::-moz-range-thumb{pointer-events:all;width:24px;height:24px;background-color:var(--watt-color-primary-dark);border-radius:50%;box-shadow:0 0 0 1px var(--watt-color-primary);cursor:pointer}watt-slider input[type=range]::-webkit-slider-thumb:active{box-shadow:inset 0 0 3px var(--watt-color-primary-dark),0 0 9px var(--watt-color-primary-dark);-webkit-box-shadow:inset 0 0 3px var(--watt-color-primary-dark),0 0 9px var(--watt-color-primary-dark);cursor:ew-resize}watt-slider input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:var(--watt-space-s);top:var(--watt-space-s)/2;left:0;right:0;position:absolute;transform:translateY(-50%);background-color:var(--watt-color-secondary-light);pointer-events:none;border-radius:var(--watt-space-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
116
116
|
}
|
|
117
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
117
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSliderComponent, decorators: [{
|
|
118
118
|
type: Component,
|
|
119
119
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, selector: 'watt-slider', template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<div class=\"controls\">\n <input\n #minRange\n class=\"min-range\"\n [style.z-index]=\"1\"\n [style.height]=\"0\"\n type=\"range\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()?.min\"\n />\n <input\n #maxRange\n class=\"max-range\"\n type=\"range\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()?.max\"\n />\n</div>\n", styles: ["watt-slider{display:flex;flex-direction:column;margin:var(--watt-space-m) 0}watt-slider .controls{position:relative}watt-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:all;width:var(--watt-space-ml);height:var(--watt-space-ml);background-color:var(--watt-color-primary-dark);border-radius:50%;box-shadow:0 0 0 1px var(--watt-color-primary);cursor:pointer}watt-slider input[type=range]::-moz-range-thumb{pointer-events:all;width:24px;height:24px;background-color:var(--watt-color-primary-dark);border-radius:50%;box-shadow:0 0 0 1px var(--watt-color-primary);cursor:pointer}watt-slider input[type=range]::-webkit-slider-thumb:active{box-shadow:inset 0 0 3px var(--watt-color-primary-dark),0 0 9px var(--watt-color-primary-dark);-webkit-box-shadow:inset 0 0 3px var(--watt-color-primary-dark),0 0 9px var(--watt-color-primary-dark);cursor:ew-resize}watt-slider input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:var(--watt-space-s);top:var(--watt-space-s)/2;left:0;right:0;position:absolute;transform:translateY(-50%);background-color:var(--watt-color-secondary-light);pointer-events:none;border-radius:var(--watt-space-s)}\n"] }]
|
|
120
120
|
}], ctorParameters: () => [], propDecorators: { min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: true }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: true }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], maxRange: [{ type: i0.ViewChild, args: ['maxRange', { isSignal: true }] }], minRange: [{ type: i0.ViewChild, args: ['minRange', { isSignal: true }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
|
|
@@ -30,12 +30,12 @@ class WattSpinnerComponent {
|
|
|
30
30
|
diameterSize = computed(() => `--watt-spinner-diameter: ${this.diameter()}px`, ...(ngDevMode ? [{ debugName: "diameterSize" }] : []));
|
|
31
31
|
diameter = input(44, ...(ngDevMode ? [{ debugName: "diameter" }] : []));
|
|
32
32
|
strokeWidth = input(5, ...(ngDevMode ? [{ debugName: "strokeWidth" }] : []));
|
|
33
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
34
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.
|
|
33
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
34
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.6", type: WattSpinnerComponent, isStandalone: true, selector: "watt-spinner", inputs: { diameter: { classPropertyName: "diameter", publicName: "diameter", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar" }, properties: { "style": "diameterSize()" } }, ngImport: i0, template: `<svg class="spinner" viewBox="0 0 50 50">
|
|
35
35
|
<circle class="path" cx="25" cy="25" r="20" fill="none" [attr.stroke-width]="strokeWidth()" />
|
|
36
36
|
</svg>`, isInline: true, styles: [":host{--watt-spinner-circle-color: var(--watt-color-primary);display:block;width:var(--watt-spinner-diameter);height:var(--watt-spinner-diameter);position:relative}.spinner{animation:rotate 2s linear infinite;z-index:2;position:absolute;top:50%;left:50%;margin:calc(var(--watt-spinner-diameter) / 2 * -1) 0 0 calc(var(--watt-spinner-diameter) / 2 * -1);width:var(--watt-spinner-diameter);height:var(--watt-spinner-diameter)}.spinner .path{stroke:var(--watt-spinner-circle-color);stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}\n"] });
|
|
37
37
|
}
|
|
38
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattSpinnerComponent, decorators: [{
|
|
39
39
|
type: Component,
|
|
40
40
|
args: [{ selector: 'watt-spinner', host: {
|
|
41
41
|
role: 'progressbar',
|
|
@@ -39,12 +39,12 @@ class WattStepperStepComponent extends MatStep {
|
|
|
39
39
|
entering = output();
|
|
40
40
|
leaving = output();
|
|
41
41
|
next = output();
|
|
42
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
43
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.
|
|
42
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattStepperStepComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
43
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.6", type: WattStepperStepComponent, isStandalone: true, selector: "watt-stepper-step", inputs: { nextButtonLabel: { classPropertyName: "nextButtonLabel", publicName: "nextButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, disableNextButton: { classPropertyName: "disableNextButton", publicName: "disableNextButton", isSignal: true, isRequired: false, transformFunction: null }, loadingNextButton: { classPropertyName: "loadingNextButton", publicName: "loadingNextButton", isSignal: true, isRequired: false, transformFunction: null }, previousButtonLabel: { classPropertyName: "previousButtonLabel", publicName: "previousButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, enabled: { classPropertyName: "enabled", publicName: "enabled", isSignal: true, isRequired: false, transformFunction: null }, disablePreviousButton: { classPropertyName: "disablePreviousButton", publicName: "disablePreviousButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { entering: "entering", leaving: "leaving", next: "next" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: ` <ng-template #templateRef>
|
|
44
44
|
<ng-content />
|
|
45
45
|
</ng-template>`, isInline: true });
|
|
46
46
|
}
|
|
47
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
47
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattStepperStepComponent, decorators: [{
|
|
48
48
|
type: Component,
|
|
49
49
|
args: [{
|
|
50
50
|
selector: 'watt-stepper-step',
|
|
@@ -106,8 +106,8 @@ class WattStepperComponent extends MatStepper {
|
|
|
106
106
|
this.stepper().selected?.stepControl?.markAllAsTouched();
|
|
107
107
|
this.completed.emit();
|
|
108
108
|
}
|
|
109
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
110
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.
|
|
109
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
110
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: WattStepperComponent, isStandalone: true, selector: "watt-stepper", inputs: { isCompleting: { classPropertyName: "isCompleting", publicName: "isCompleting", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { completed: "completed" }, providers: [
|
|
111
111
|
{
|
|
112
112
|
provide: STEPPER_GLOBAL_OPTIONS,
|
|
113
113
|
useValue: { showError: true, displayDefaultIndicatorType: false },
|
|
@@ -116,7 +116,7 @@ class WattStepperComponent extends MatStepper {
|
|
|
116
116
|
{ provide: MatStepper, useExisting: WattStepperComponent },
|
|
117
117
|
], queries: [{ propertyName: "wattSteps", predicate: WattStepperStepComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "stepper", first: true, predicate: MatStepper, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<mat-stepper\n #stepper\n [disableRipple]=\"disableRipple\"\n [linear]=\"true\"\n animationDuration=\"0\"\n class=\"watt-stepper\"\n>\n <ng-template let-index=\"index\" matStepperIcon=\"edit\">\n {{ index + 1 }}\n </ng-template>\n <ng-template matStepperIcon=\"done\">\n <watt-icon name=\"checkmark\" />\n </ng-template>\n <ng-template let-index=\"index\" matStepperIcon=\"number\">\n @if (\n stepper.steps.get(index)?.completed &&\n stepper.steps.get(index)?.interacted &&\n index !== stepper.selectedIndex\n ) {\n <watt-icon name=\"checkmark\" />\n } @else {\n {{ index + 1 }}\n }\n </ng-template>\n <ng-template let-index=\"index\" matStepperIcon=\"error\">\n {{ index + 1 }}\n </ng-template>\n @for (step of wattSteps(); track step) {\n @if (step.enabled()) {\n <mat-step [editable]=\"step.editable\" [stepControl]=\"step.stepControl\">\n <ng-template matStepLabel>{{ step.label }}</ng-template>\n <div class=\"watt-stepper-content-wrapper\">\n <ng-container *ngTemplateOutlet=\"step.templateRef()\" />\n </div>\n <div class=\"watt-stepper-button-wrapper\">\n @if (!onFirstStep()) {\n <watt-button\n [disabled]=\"step.disablePreviousButton()\"\n variant=\"secondary\"\n (click)=\"previousStep()\"\n >\n <watt-icon name=\"left\" />\n {{ step.previousButtonLabel() }}\n </watt-button>\n }\n\n @if (!onLastStep()) {\n <watt-button\n variant=\"secondary\"\n (click)=\"nextStep(step)\"\n [loading]=\"step.loadingNextButton()\"\n [disabled]=\"step.disableNextButton()\"\n >\n {{ step.nextButtonLabel() }}\n <watt-icon name=\"right\" />\n </watt-button>\n }\n\n @if (onLastStep()) {\n <watt-button\n variant=\"primary\"\n [loading]=\"isCompleting()\"\n (click)=\"complete()\"\n [disabled]=\"step.disableNextButton()\"\n >{{ step.nextButtonLabel() }}\n </watt-button>\n }\n </div>\n </mat-step>\n }\n }\n</mat-stepper>\n", styles: [".watt-stepper .mat-horizontal-stepper-header-container{padding-bottom:var(--watt-space-ml)}.watt-stepper .mat-step-label.mat-step-label-selected{color:var(--watt-color-primary)}.watt-stepper .mat-form-field-suffix{padding-right:var(--watt-space-s);color:var(--watt-color-neutral-grey-600)}.watt-stepper .mat-step-label{color:var(--watt-typography-label-color);font-size:1rem;line-height:1.5rem;font-weight:600;text-transform:none}.watt-stepper .mat-step-header .mat-step-icon-selected{border:solid 1px var(--watt-color-primary);background-color:var(--watt-color-neutral-white);color:var(--watt-color-primary)}.watt-stepper .mat-stepper-horizontal-line{margin:0 5px}.watt-stepper .watt-stepper-button-wrapper{display:flex;justify-content:flex-end;gap:var(--watt-space-m);width:100%;padding-top:var(--watt-space-ml)}.watt-stepper .mat-step-icon-state-error{color:var(--watt-color-state-danger);border:solid 1px var(--watt-color-state-danger)}@media(max-width:719.98px){.watt-stepper .mat-horizontal-stepper-header{padding:0}.watt-stepper .mat-step-label:not(.mat-step-label-selected){display:none}.watt-stepper .mat-horizontal-content-container{padding:0 0 24px}}.watt-modal--medium watt-stepper,.watt-modal--medium .watt-stepper,.watt-modal--large watt-stepper,.watt-modal--large .watt-stepper{height:100%}.watt-modal--medium .mat-horizontal-stepper-content,.watt-modal--large .mat-horizontal-stepper-content{display:grid;align-items:center;grid-template-rows:1fr auto;grid-template-areas:\"content\" \"actions\"}.watt-modal--medium .mat-horizontal-stepper-content .watt-stepper-content-wrapper,.watt-modal--large .mat-horizontal-stepper-content .watt-stepper-content-wrapper{align-self:stretch;grid-area:content;overflow:auto}.watt-modal--medium .mat-horizontal-stepper-content .watt-stepper-button-wrapper,.watt-modal--large .mat-horizontal-stepper-content .watt-stepper-button-wrapper{grid-area:actions}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i1.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i1.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i1.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "headerPrefix", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: i1.MatStepperIcon, selector: "ng-template[matStepperIcon]", inputs: ["matStepperIcon"] }, { kind: "component", type: WattIconComponent, selector: "watt-icon", inputs: ["name", "label", "size", "state"] }, { kind: "component", type: WattButtonComponent, selector: "watt-button", inputs: ["icon", "variant", "size", "type", "formId", "disabled", "loading"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
118
118
|
}
|
|
119
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
119
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattStepperComponent, decorators: [{
|
|
120
120
|
type: Component,
|
|
121
121
|
args: [{ selector: 'watt-stepper', encapsulation: ViewEncapsulation.None, imports: [NgTemplateOutlet, MatStepperModule, WattIconComponent, WattButtonComponent], providers: [
|
|
122
122
|
{
|
|
@@ -125,10 +125,10 @@ class WattTableCellDirective {
|
|
|
125
125
|
static ngTemplateContextGuard(_directive, context) {
|
|
126
126
|
return true;
|
|
127
127
|
}
|
|
128
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
129
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.
|
|
128
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattTableCellDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
129
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.6", type: WattTableCellDirective, isStandalone: true, selector: "[wattTableCell]", inputs: { column: { classPropertyName: "column", publicName: "wattTableCell", isSignal: true, isRequired: true, transformFunction: null }, header: { classPropertyName: "header", publicName: "wattTableCellHeader", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
130
130
|
}
|
|
131
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
131
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattTableCellDirective, decorators: [{
|
|
132
132
|
type: Directive,
|
|
133
133
|
args: [{
|
|
134
134
|
selector: '[wattTableCell]',
|
|
@@ -139,10 +139,10 @@ class WattTableToolbarDirective {
|
|
|
139
139
|
static ngTemplateContextGuard(_directive, context) {
|
|
140
140
|
return true;
|
|
141
141
|
}
|
|
142
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
143
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.
|
|
142
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattTableToolbarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
143
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.6", type: WattTableToolbarDirective, isStandalone: true, selector: "[wattTableToolbar]", ngImport: i0 });
|
|
144
144
|
}
|
|
145
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
145
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattTableToolbarDirective, decorators: [{
|
|
146
146
|
type: Directive,
|
|
147
147
|
args: [{
|
|
148
148
|
selector: '[wattTableToolbar]',
|
|
@@ -390,10 +390,10 @@ class WattTableComponent {
|
|
|
390
390
|
* Toggles the selection of a row.
|
|
391
391
|
*/
|
|
392
392
|
toggleSelection = (row) => this.selection.update((s) => (s.includes(row) ? s.filter((r) => r !== row) : s.concat(row)));
|
|
393
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.
|
|
394
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: WattTableComponent, isStandalone: true, selector: "watt-table", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, displayedColumns: { classPropertyName: "displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, stickyFooter: { classPropertyName: "stickyFooter", publicName: "stickyFooter", isSignal: true, isRequired: false, transformFunction: null }, resolveHeader: { classPropertyName: "resolveHeader", publicName: "resolveHeader", isSignal: true, isRequired: false, transformFunction: null }, sortBy: { classPropertyName: "sortBy", publicName: "sortBy", isSignal: true, isRequired: false, transformFunction: null }, sortDirection: { classPropertyName: "sortDirection", publicName: "sortDirection", isSignal: true, isRequired: false, transformFunction: null }, sortClear: { classPropertyName: "sortClear", publicName: "sortClear", isSignal: true, isRequired: false, transformFunction: null }, rowClass: { classPropertyName: "rowClass", publicName: "rowClass", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, suppressRowHoverHighlight: { classPropertyName: "suppressRowHoverHighlight", publicName: "suppressRowHoverHighlight", isSignal: true, isRequired: false, transformFunction: null }, activeRow: { classPropertyName: "activeRow", publicName: "activeRow", isSignal: true, isRequired: false, transformFunction: null }, activeRowComparator: { classPropertyName: "activeRowComparator", publicName: "activeRowComparator", isSignal: true, isRequired: false, transformFunction: null }, hideColumnHeaders: { classPropertyName: "hideColumnHeaders", publicName: "hideColumnHeaders", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", expanded: "expandedChange", rowClick: "rowClick", sortChange: "sortChange" }, host: { properties: { "class.watt-table-variant-zebra": "variant() === \"zebra\"", "style.--watt-table-grid-template-columns": "sizing().join(\" \")" } }, queries: [{ propertyName: "cells", predicate: (WattTableCellDirective), isSignal: true }, { propertyName: "toolbar", first: true, predicate: (WattTableToolbarDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "tableCellElements", predicate: ["td"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<table\n mat-table\n matSort\n role=\"treegrid\"\n [class]=\"{ 'watt-table-has-selection': getSelectionState() !== false }\"\n [matSortActive]=\"sortBy()\"\n [matSortDirection]=\"sortDirection()\"\n [matSortDisableClear]=\"!sortClear()\"\n [dataSource]=\"dataSource()\"\n [attr.aria-label]=\"description()\"\n (matSortChange)=\"sortChange.emit($event)\"\n>\n @if (selectable()) {\n <ng-container [matColumnDef]=\"checkboxColumn\" [sticky]=\"true\">\n <th mat-header-cell *matHeaderCellDef class=\"watt-table-checkbox-cell\">\n <watt-checkbox\n [ngModel]=\"getSelectionState()\"\n (ngModelChange)=\"$event ? selection.set(dataSource().filteredData) : clearSelection()\"\n />\n </th>\n <td mat-cell *matCellDef=\"let row\" class=\"watt-table-checkbox-cell\">\n <watt-checkbox\n [ngModel]=\"selection().includes(row)\"\n (ngModelChange)=\"toggleSelection(row)\"\n (click)=\"$event.stopPropagation()\"\n />\n </td>\n </ng-container>\n }\n\n <ng-container [matColumnDef]=\"expandableColumn\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td\n #td\n mat-cell\n *matCellDef=\"let row; let index = index\"\n [attr.data-key]=\"getRowKey(index, row)\"\n [attr.data-row-index]=\"index\"\n (click)=\"onRowClick(row)\"\n [class.watt-table-cell--expanded]=\"expanded().includes(row)\"\n >\n <watt-icon name=\"right\" size=\"xs\" />\n </td>\n </ng-container>\n\n @for (column of columns() | keyvalue; track column.key) {\n <ng-container [matColumnDef]=\"column.key\" [stickyEnd]=\"column.value.stickyEnd?.()\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [class.watt-table-cell--expandable]=\"column.value.expandable\"\n class=\"watt-table-align-{{ column.value.align ?? 'left' }} {{\n column.value.headerCellClass\n }}\"\n >\n @if (column.value.helperAction; as action) {\n <watt-icon name=\"help\" (click)=\"action()\" />\n }\n\n <div\n class=\"watt-table-header-cell\"\n mat-sort-header\n [arrowPosition]=\"column.value.align === 'right' ? 'before' : 'after'\"\n [disabled]=\"!column.value.accessor || column.value.sort === false\"\n >\n {{ getColumnHeader(column) }}\n @if (column.value.tooltip; as tooltip) {\n <watt-icon [title]=\"tooltip\" name=\"info\" state=\"default\" />\n }\n </div>\n </th>\n\n <td\n #td\n mat-cell\n *matCellDef=\"let row; let index = index\"\n [attr.data-key]=\"getRowKey(index, row)\"\n [attr.data-row-index]=\"index\"\n [class.watt-table-cell--expanded]=\"expanded().includes(row)\"\n [class.watt-table-cell--expandable]=\"column.value.expandable\"\n class=\"watt-table-align-{{ column.value.align ?? 'left' }} {{ column.value.dataCellClass }}\"\n (click)=\"!column.value.expandable && onRowClick(row)\"\n >\n @if (isExpandable()) {\n @defer (when !column.value.expandable || expanded().includes(row)) {\n @if (getColumnTemplate(column.value); as template) {\n <div class=\"watt-table-cell-wrapper\">\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: row, index }\" />\n </div>\n } @else {\n {{ getColumnCell(column.value, row) }}\n }\n }\n } @else {\n @if (getColumnTemplate(column.value); as template) {\n <div class=\"watt-table-cell-wrapper\">\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: row, index }\" />\n </div>\n } @else {\n {{ getColumnCell(column.value, row) }}\n }\n }\n </td>\n\n @if (hasFooter()) {\n <td\n mat-footer-cell\n *matFooterCellDef\n class=\"{{ column.value.footer?.class }} watt-table-align-{{\n column.value.align ?? 'left'\n }} \"\n >\n {{ column.value.footer?.value?.() }}\n </td>\n }\n </ng-container>\n }\n\n <ng-container matColumnDef=\"spacer\">\n <td class=\"watt-table-footer-spacer\" mat-footer-cell *matFooterCellDef></td>\n </ng-container>\n\n @if (!hideColumnHeaders()) {\n <tr mat-header-row *matHeaderRowDef=\"renderedColumns()\"></tr>\n }\n <tr\n mat-row\n *matRowDef=\"let row; columns: renderedColumns()\"\n [attr.aria-selected]=\"row === activeRow()\"\n [class]=\"getRowClass(row)\"\n [class]=\"{\n 'watt-table-highlight-row': !disabled() && !suppressRowHoverHighlight(),\n 'watt-table-clickable-row': !disabled() && rowClick$.observed,\n 'watt-table-active-row': isActiveRow(row),\n }\"\n ></tr>\n\n @if (toolbar()) {\n <tr mat-footer-row *matFooterRowDef=\"['spacer']\"></tr>\n }\n\n @if (hasFooter()) {\n <tr\n mat-footer-row\n [class.watt-table-hide-footer]=\"loading() || dataSource().filteredData.length === 0\"\n *matFooterRowDef=\"renderedColumns(); sticky: stickyFooter()\"\n ></tr>\n }\n\n <ng-container *matNoDataRow>\n @if (loading()) {\n @for (i of [1, 2, 3]; track i) {\n <tr class=\"mat-mdc-row\">\n @for (_ of renderedColumns(); track _; let i = $index) {\n <td class=\"mat-mdc-cell\" [class.watt-table-loading-cell]=\"i > 0 || !selectable()\"></td>\n }\n </tr>\n }\n }\n </ng-container>\n</table>\n\n@if (toolbar(); as toolbar) {\n <div class=\"watt-table-toolbar\" role=\"toolbar\">\n <ng-container\n *ngTemplateOutlet=\"\n toolbar.templateRef;\n context: { $implicit: filterSelectionBy(dataSource().filteredData) }\n \"\n />\n </div>\n}\n", styles: ["watt-table{--mat-table-row-item-label-text-font: $primary-font-family;--mat-table-row-item-outline-color: var(--watt-color-neutral-grey-300);--mat-table-header-headline-font: $primary-font-family}watt-table,watt-table .mat-mdc-table{display:grid;position:relative;overflow:auto;min-height:44px}watt-table .mat-mdc-table{grid-template-columns:var(--watt-table-grid-template-columns);grid-auto-rows:max-content;max-height:100%;z-index:1}watt-table .mat-mdc-table thead,watt-table .mat-mdc-table tbody,watt-table .mat-mdc-table tfoot,watt-table .mat-mdc-table tr.mat-mdc-row,watt-table .mat-mdc-table tr.mat-mdc-header-row,watt-table .mat-mdc-table tr.mat-mdc-footer-row{display:contents}watt-table .mat-mdc-table tr.watt-table-hide-footer{display:none}watt-table .mat-mdc-table tr.mat-mdc-header-row{flex:0 0 auto}watt-table .mat-mdc-table th.mat-mdc-header-cell{color:var(--watt-typography-label-color);font-size:.875rem;line-height:1.25rem;font-weight:600;box-sizing:border-box;display:flex;position:sticky;top:0;padding:0 var(--watt-space-s);height:auto;background:var(--watt-color-primary-ultralight);box-shadow:0 -1px #0000001f inset;border:0;z-index:2!important;white-space:nowrap;-webkit-user-select:none;user-select:none}watt-table .mat-mdc-table td.mat-mdc-footer-cell,watt-table .mat-mdc-table td.mat-mdc-cell{display:flex;align-items:center;min-height:48px;padding:var(--watt-space-xs) var(--watt-space-m);line-height:18px}watt-table .mat-mdc-table td.mat-mdc-cell.watt-table-cell--expandable{padding:0}watt-table .mat-mdc-table td.mat-mdc-footer-cell:not(.watt-table-footer-spacer){border-bottom:1px solid var(--watt-color-neutral-grey-300)}watt-table .mat-mdc-table td.mat-mdc-footer-cell:not(.watt-table-footer-spacer){font-size:.875rem;line-height:1.25rem;font-weight:600;text-transform:none;letter-spacing:0;border-top:2px solid var(--watt-color-neutral-grey-300);background-color:var(--watt-color-neutral-grey-100)}watt-table .mat-mdc-table .watt-table-clickable-row>td:not(.watt-table-cell--expandable),watt-table .mat-mdc-table tr:has(>.watt-table-cell--expandable)>td:not(.watt-table-cell--expandable){cursor:pointer;-webkit-user-select:text;user-select:text}watt-table .mat-mdc-table .watt-table-highlight-row:hover:not(.watt-table-active-row,:has(>.watt-table-cell--expandable:hover))>td{background:var(--watt-color-neutral-grey-100)}watt-table .mat-mdc-table .watt-table-active-row>td{background:var(--watt-color-secondary-ultralight)}watt-table .mat-mdc-table .mat-column-__expandableColumn__>watt-icon{transition:transform .2s}watt-table .mat-mdc-table .mat-column-__expandableColumn__.watt-table-cell--expanded>watt-icon{transform:rotate(90deg)}watt-table .mat-mdc-table .mat-sort-header-arrow{margin:0}watt-table .mat-mdc-table .watt-table-align-right .mat-sort-header-arrow{margin-right:var(--watt-space-s)}watt-table .mat-mdc-table .watt-table-align-center .mat-sort-header-arrow,watt-table .mat-mdc-table .watt-table-align-left .mat-sort-header-arrow{margin-left:var(--watt-space-s)}watt-table .mat-mdc-table .watt-table-header-cell{padding:.75rem var(--watt-space-s)}watt-table .mat-mdc-table .watt-table-checkbox-cell{justify-content:center}watt-table .mat-mdc-table th.watt-table-checkbox-cell{display:flex;align-items:center}watt-table .mat-mdc-table .watt-table-align-center,watt-table .mat-mdc-table .watt-table-align-center .mat-sort-header-container{justify-content:center;text-align:center}watt-table .mat-mdc-table .watt-table-align-right,watt-table .mat-mdc-table .watt-table-align-right .mat-sort-header-container{justify-content:right;text-align:right}.watt-table-variant-zebra>table>tbody>tr:nth-child(2n):not(.watt-table-active-row)>td{background-color:var(--watt-color-neutral-grey-50)}watt-table .mat-mdc-table th.watt-table-cell--expandable{display:none}watt-table .mat-mdc-table tr.mat-mdc-row td.mat-mdc-cell.watt-table-cell--expandable{position:relative;min-height:0;max-height:0;border-bottom-width:0;overflow:hidden;pointer-events:none;grid-column:1/-1;background:transparent;flex:1 1 auto;opacity:0;will-change:opacity;transition:opacity .2s cubic-bezier(.4,0,.2,1),overflow 0s .3s allow-discrete}watt-table .mat-mdc-table tr.mat-mdc-row td.mat-mdc-cell.watt-table-cell--expandable>.watt-table-cell-wrapper{position:absolute;top:0;width:100%}watt-table .mat-mdc-table tr.mat-mdc-row td.watt-table-cell--expandable.watt-table-cell--expanded{height:auto;max-height:initial;opacity:1;border-bottom-width:1px;pointer-events:all;overflow:visible}watt-table .mat-mdc-table tr.mat-mdc-row td.watt-table-cell--expandable.watt-table-cell--expanded>.watt-table-cell-wrapper{position:relative}.watt-table-cell-wrapper{width:100%}.watt-table-footer-spacer{display:none;height:76px;border:0}.watt-table-has-selection .watt-table-footer-spacer{display:block}.watt-table-has-selection+.watt-table-toolbar{opacity:1;visibility:visible;transition:opacity .3s cubic-bezier(0,0,.2,1),visibility .5s}.watt-table-toolbar{position:absolute;bottom:var(--watt-space-m);left:50%;transform:translate(-50%);display:flex;align-items:center;padding:0 var(--watt-space-m);min-height:44px;border-radius:22px;color:var(--watt-color-primary-contrast);background-color:var(--watt-color-primary);z-index:1;opacity:0;visibility:hidden;transition:none}.watt-table-toolbar .watt-button--disabled{opacity:.4;--watt-button-primary-disabled-color: #fff}.watt-table-loading-cell:before{content:\"\";flex:1;display:block;max-width:200px;height:var(--watt-space-m);border-radius:var(--watt-space-m);opacity:.75;animation:shine 2s infinite linear;background-color:var(--watt-color-neutral-grey-200);background-size:300px;background-position:-100px;background-image:linear-gradient(90deg,var(--watt-color-neutral-grey-300) 0px,var(--watt-color-neutral-grey-200) 40px,var(--watt-color-neutral-grey-300) 80px)}@keyframes shine{40%,to{background-position:200px}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i3.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i3.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i3.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "directive", type: i3.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: WattIconComponent, selector: "watt-icon", inputs: ["name", "label", "size", "state"] }, { kind: "component", type: WattCheckboxComponent, selector: "watt-checkbox", inputs: ["required"] }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [NgTemplateOutlet]] });
|
|
393
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
394
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: WattTableComponent, isStandalone: true, selector: "watt-table", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, displayedColumns: { classPropertyName: "displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, stickyFooter: { classPropertyName: "stickyFooter", publicName: "stickyFooter", isSignal: true, isRequired: false, transformFunction: null }, resolveHeader: { classPropertyName: "resolveHeader", publicName: "resolveHeader", isSignal: true, isRequired: false, transformFunction: null }, sortBy: { classPropertyName: "sortBy", publicName: "sortBy", isSignal: true, isRequired: false, transformFunction: null }, sortDirection: { classPropertyName: "sortDirection", publicName: "sortDirection", isSignal: true, isRequired: false, transformFunction: null }, sortClear: { classPropertyName: "sortClear", publicName: "sortClear", isSignal: true, isRequired: false, transformFunction: null }, rowClass: { classPropertyName: "rowClass", publicName: "rowClass", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, suppressRowHoverHighlight: { classPropertyName: "suppressRowHoverHighlight", publicName: "suppressRowHoverHighlight", isSignal: true, isRequired: false, transformFunction: null }, activeRow: { classPropertyName: "activeRow", publicName: "activeRow", isSignal: true, isRequired: false, transformFunction: null }, activeRowComparator: { classPropertyName: "activeRowComparator", publicName: "activeRowComparator", isSignal: true, isRequired: false, transformFunction: null }, hideColumnHeaders: { classPropertyName: "hideColumnHeaders", publicName: "hideColumnHeaders", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", expanded: "expandedChange", rowClick: "rowClick", sortChange: "sortChange" }, host: { properties: { "class.watt-table-variant-zebra": "variant() === \"zebra\"", "style.--watt-table-grid-template-columns": "sizing().join(\" \")" } }, queries: [{ propertyName: "cells", predicate: (WattTableCellDirective), isSignal: true }, { propertyName: "toolbar", first: true, predicate: (WattTableToolbarDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "tableCellElements", predicate: ["td"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n@license\nCopyright 2020 Energinet DataHub A/S\n\nLicensed under the Apache License, Version 2.0 (the \"License2\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n-->\n<table\n mat-table\n matSort\n role=\"treegrid\"\n [class]=\"{ 'watt-table-has-selection': getSelectionState() !== false }\"\n [matSortActive]=\"sortBy()\"\n [matSortDirection]=\"sortDirection()\"\n [matSortDisableClear]=\"!sortClear()\"\n [dataSource]=\"dataSource()\"\n [attr.aria-label]=\"description()\"\n (matSortChange)=\"sortChange.emit($event)\"\n>\n @if (selectable()) {\n <ng-container [matColumnDef]=\"checkboxColumn\" [sticky]=\"true\">\n <th mat-header-cell *matHeaderCellDef class=\"watt-table-checkbox-cell\">\n <watt-checkbox\n [ngModel]=\"getSelectionState()\"\n (ngModelChange)=\"$event ? selection.set(dataSource().filteredData) : clearSelection()\"\n />\n </th>\n <td mat-cell *matCellDef=\"let row\" class=\"watt-table-checkbox-cell\">\n <watt-checkbox\n [ngModel]=\"selection().includes(row)\"\n (ngModelChange)=\"toggleSelection(row)\"\n (click)=\"$event.stopPropagation()\"\n />\n </td>\n </ng-container>\n }\n\n <ng-container [matColumnDef]=\"expandableColumn\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td\n #td\n mat-cell\n *matCellDef=\"let row; let index = index\"\n [attr.data-key]=\"getRowKey(index, row)\"\n [attr.data-row-index]=\"index\"\n (click)=\"onRowClick(row)\"\n [class.watt-table-cell--expanded]=\"expanded().includes(row)\"\n >\n <watt-icon name=\"right\" size=\"xs\" />\n </td>\n </ng-container>\n\n @for (column of columns() | keyvalue; track column.key) {\n <ng-container [matColumnDef]=\"column.key\" [stickyEnd]=\"column.value.stickyEnd?.()\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [class.watt-table-cell--expandable]=\"column.value.expandable\"\n class=\"watt-table-align-{{ column.value.align ?? 'left' }} {{\n column.value.headerCellClass\n }}\"\n >\n @if (column.value.helperAction; as action) {\n <watt-icon name=\"help\" (click)=\"action()\" />\n }\n\n <div\n class=\"watt-table-header-cell\"\n mat-sort-header\n [arrowPosition]=\"column.value.align === 'right' ? 'before' : 'after'\"\n [disabled]=\"!column.value.accessor || column.value.sort === false\"\n >\n {{ getColumnHeader(column) }}\n @if (column.value.tooltip; as tooltip) {\n <watt-icon [title]=\"tooltip\" name=\"info\" state=\"default\" />\n }\n </div>\n </th>\n\n <td\n #td\n mat-cell\n *matCellDef=\"let row; let index = index\"\n [attr.data-key]=\"getRowKey(index, row)\"\n [attr.data-row-index]=\"index\"\n [class.watt-table-cell--expanded]=\"expanded().includes(row)\"\n [class.watt-table-cell--expandable]=\"column.value.expandable\"\n class=\"watt-table-align-{{ column.value.align ?? 'left' }} {{ column.value.dataCellClass }}\"\n (click)=\"!column.value.expandable && onRowClick(row)\"\n >\n @if (isExpandable()) {\n @defer (when !column.value.expandable || expanded().includes(row)) {\n @if (getColumnTemplate(column.value); as template) {\n <div class=\"watt-table-cell-wrapper\">\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: row, index }\" />\n </div>\n } @else {\n {{ getColumnCell(column.value, row) }}\n }\n }\n } @else {\n @if (getColumnTemplate(column.value); as template) {\n <div class=\"watt-table-cell-wrapper\">\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: row, index }\" />\n </div>\n } @else {\n {{ getColumnCell(column.value, row) }}\n }\n }\n </td>\n\n @if (hasFooter()) {\n <td\n mat-footer-cell\n *matFooterCellDef\n class=\"{{ column.value.footer?.class }} watt-table-align-{{\n column.value.align ?? 'left'\n }} \"\n >\n {{ column.value.footer?.value?.() }}\n </td>\n }\n </ng-container>\n }\n\n <ng-container matColumnDef=\"spacer\">\n <td class=\"watt-table-footer-spacer\" mat-footer-cell *matFooterCellDef></td>\n </ng-container>\n\n @if (!hideColumnHeaders()) {\n <tr mat-header-row *matHeaderRowDef=\"renderedColumns()\"></tr>\n }\n <tr\n mat-row\n *matRowDef=\"let row; columns: renderedColumns()\"\n [attr.aria-selected]=\"row === activeRow()\"\n [class]=\"getRowClass(row)\"\n [class]=\"{\n 'watt-table-highlight-row': !disabled() && !suppressRowHoverHighlight(),\n 'watt-table-clickable-row': !disabled() && rowClick$.observed,\n 'watt-table-active-row': isActiveRow(row),\n }\"\n ></tr>\n\n @if (toolbar()) {\n <tr mat-footer-row *matFooterRowDef=\"['spacer']\"></tr>\n }\n\n @if (hasFooter()) {\n <tr\n mat-footer-row\n [class.watt-table-hide-footer]=\"loading() || dataSource().filteredData.length === 0\"\n *matFooterRowDef=\"renderedColumns(); sticky: stickyFooter()\"\n ></tr>\n }\n\n <ng-container *matNoDataRow>\n @if (loading()) {\n @for (i of [1, 2, 3]; track i) {\n <tr class=\"mat-mdc-row\">\n @for (_ of renderedColumns(); track _; let i = $index) {\n <td class=\"mat-mdc-cell\" [class.watt-table-loading-cell]=\"i > 0 || !selectable()\"></td>\n }\n </tr>\n }\n }\n </ng-container>\n</table>\n\n@if (toolbar(); as toolbar) {\n <div class=\"watt-table-toolbar\" role=\"toolbar\">\n <ng-container\n *ngTemplateOutlet=\"\n toolbar.templateRef;\n context: { $implicit: filterSelectionBy(dataSource().filteredData) }\n \"\n />\n </div>\n}\n", styles: ["watt-table{--mat-table-row-item-label-text-font: $primary-font-family;--mat-table-row-item-outline-color: var(--watt-color-neutral-grey-300);--mat-table-header-headline-font: $primary-font-family}watt-table,watt-table .mat-mdc-table{display:grid;position:relative;overflow:auto;min-height:44px}watt-table .mat-mdc-table{grid-template-columns:var(--watt-table-grid-template-columns);grid-auto-rows:max-content;max-height:100%;z-index:1}watt-table .mat-mdc-table thead,watt-table .mat-mdc-table tbody,watt-table .mat-mdc-table tfoot,watt-table .mat-mdc-table tr.mat-mdc-row,watt-table .mat-mdc-table tr.mat-mdc-header-row,watt-table .mat-mdc-table tr.mat-mdc-footer-row{display:contents}watt-table .mat-mdc-table tr.watt-table-hide-footer{display:none}watt-table .mat-mdc-table tr.mat-mdc-header-row{flex:0 0 auto}watt-table .mat-mdc-table th.mat-mdc-header-cell{color:var(--watt-typography-label-color);font-size:.875rem;line-height:1.25rem;font-weight:600;box-sizing:border-box;display:flex;position:sticky;top:0;padding:0 var(--watt-space-s);height:auto;background:var(--watt-color-primary-ultralight);box-shadow:0 -1px #0000001f inset;border:0;z-index:2!important;white-space:nowrap;-webkit-user-select:none;user-select:none}watt-table .mat-mdc-table td.mat-mdc-footer-cell,watt-table .mat-mdc-table td.mat-mdc-cell{display:flex;align-items:center;min-height:48px;padding:var(--watt-space-xs) var(--watt-space-m);line-height:18px}watt-table .mat-mdc-table td.mat-mdc-cell.watt-table-cell--expandable{padding:0}watt-table .mat-mdc-table td.mat-mdc-footer-cell:not(.watt-table-footer-spacer){border-bottom:1px solid var(--watt-color-neutral-grey-300)}watt-table .mat-mdc-table td.mat-mdc-footer-cell:not(.watt-table-footer-spacer){font-size:.875rem;line-height:1.25rem;font-weight:600;text-transform:none;letter-spacing:0;border-top:2px solid var(--watt-color-neutral-grey-300);background-color:var(--watt-color-neutral-grey-100)}watt-table .mat-mdc-table .watt-table-clickable-row>td:not(.watt-table-cell--expandable),watt-table .mat-mdc-table tr:has(>.watt-table-cell--expandable)>td:not(.watt-table-cell--expandable){cursor:pointer;-webkit-user-select:text;user-select:text}watt-table .mat-mdc-table .watt-table-highlight-row:hover:not(.watt-table-active-row,:has(>.watt-table-cell--expandable:hover))>td{background:var(--watt-color-neutral-grey-100)}watt-table .mat-mdc-table .watt-table-active-row>td{background:var(--watt-color-secondary-ultralight)}watt-table .mat-mdc-table .mat-column-__expandableColumn__>watt-icon{transition:transform .2s}watt-table .mat-mdc-table .mat-column-__expandableColumn__.watt-table-cell--expanded>watt-icon{transform:rotate(90deg)}watt-table .mat-mdc-table .mat-sort-header-arrow{margin:0}watt-table .mat-mdc-table .watt-table-align-right .mat-sort-header-arrow{margin-right:var(--watt-space-s)}watt-table .mat-mdc-table .watt-table-align-center .mat-sort-header-arrow,watt-table .mat-mdc-table .watt-table-align-left .mat-sort-header-arrow{margin-left:var(--watt-space-s)}watt-table .mat-mdc-table .watt-table-header-cell{padding:.75rem var(--watt-space-s)}watt-table .mat-mdc-table .watt-table-checkbox-cell{justify-content:center}watt-table .mat-mdc-table th.watt-table-checkbox-cell{display:flex;align-items:center}watt-table .mat-mdc-table .watt-table-align-center,watt-table .mat-mdc-table .watt-table-align-center .mat-sort-header-container{justify-content:center;text-align:center}watt-table .mat-mdc-table .watt-table-align-right,watt-table .mat-mdc-table .watt-table-align-right .mat-sort-header-container{justify-content:right;text-align:right}.watt-table-variant-zebra>table>tbody>tr:nth-child(2n):not(.watt-table-active-row)>td{background-color:var(--watt-color-neutral-grey-50)}watt-table .mat-mdc-table th.watt-table-cell--expandable{display:none}watt-table .mat-mdc-table tr.mat-mdc-row td.mat-mdc-cell.watt-table-cell--expandable{position:relative;min-height:0;max-height:0;border-bottom-width:0;overflow:hidden;pointer-events:none;grid-column:1/-1;background:transparent;flex:1 1 auto;opacity:0;will-change:opacity;transition:opacity .2s cubic-bezier(.4,0,.2,1),overflow 0s .3s allow-discrete}watt-table .mat-mdc-table tr.mat-mdc-row td.mat-mdc-cell.watt-table-cell--expandable>.watt-table-cell-wrapper{position:absolute;top:0;width:100%}watt-table .mat-mdc-table tr.mat-mdc-row td.watt-table-cell--expandable.watt-table-cell--expanded{height:auto;max-height:initial;opacity:1;border-bottom-width:1px;pointer-events:all;overflow:visible}watt-table .mat-mdc-table tr.mat-mdc-row td.watt-table-cell--expandable.watt-table-cell--expanded>.watt-table-cell-wrapper{position:relative}.watt-table-cell-wrapper{width:100%}.watt-table-footer-spacer{display:none;height:76px;border:0}.watt-table-has-selection .watt-table-footer-spacer{display:block}.watt-table-has-selection+.watt-table-toolbar{opacity:1;visibility:visible;transition:opacity .3s cubic-bezier(0,0,.2,1),visibility .5s}.watt-table-toolbar{position:absolute;bottom:var(--watt-space-m);left:50%;transform:translate(-50%);display:flex;align-items:center;padding:0 var(--watt-space-m);min-height:44px;border-radius:22px;color:var(--watt-color-primary-contrast);background-color:var(--watt-color-primary);z-index:1;opacity:0;visibility:hidden;transition:none}.watt-table-toolbar .watt-button--disabled{opacity:.4;--watt-button-primary-disabled-color: #fff}.watt-table-loading-cell:before{content:\"\";flex:1;display:block;max-width:200px;height:var(--watt-space-m);border-radius:var(--watt-space-m);opacity:.75;animation:shine 2s infinite linear;background-color:var(--watt-color-neutral-grey-200);background-size:300px;background-position:-100px;background-image:linear-gradient(90deg,var(--watt-color-neutral-grey-300) 0px,var(--watt-color-neutral-grey-200) 40px,var(--watt-color-neutral-grey-300) 80px)}@keyframes shine{40%,to{background-position:200px}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i3.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i3.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i3.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "directive", type: i3.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: WattIconComponent, selector: "watt-icon", inputs: ["name", "label", "size", "state"] }, { kind: "component", type: WattCheckboxComponent, selector: "watt-checkbox", inputs: ["required"] }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [NgTemplateOutlet]] });
|
|
395
395
|
}
|
|
396
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.
|
|
396
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: WattTableComponent, decorators: [{
|
|
397
397
|
type: Component,
|
|
398
398
|
args: [{ imports: [
|
|
399
399
|
NgTemplateOutlet,
|