@energinet/watt 0.0.1
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/LICENSE +201 -0
- package/badge/index.d.ts +17 -0
- package/badge/watt-badge.component.d.ts +15 -0
- package/breadcrumbs/index.d.ts +17 -0
- package/breadcrumbs/watt-breadcrumbs.component.d.ts +23 -0
- package/button/index.d.ts +17 -0
- package/button/watt-button.component.d.ts +20 -0
- package/card/index.d.ts +18 -0
- package/card/watt-card-title.component.d.ts +6 -0
- package/card/watt-card.component.d.ts +15 -0
- package/checkbox/index.d.ts +17 -0
- package/checkbox/watt-checkbox.component.d.ts +17 -0
- package/chip/index.d.ts +23 -0
- package/chip/watt-action-chip.component.d.ts +8 -0
- package/chip/watt-chip.component.d.ts +8 -0
- package/chip/watt-chip.directive.d.ts +16 -0
- package/chip/watt-date-chip.component.d.ts +29 -0
- package/chip/watt-date-range-chip.component.d.ts +50 -0
- package/chip/watt-filter-chip.component.d.ts +30 -0
- package/chip/watt-menu-chip.component.d.ts +30 -0
- package/clipboard/index.d.ts +18 -0
- package/clipboard/watt-clipboard-intl.service.d.ts +7 -0
- package/clipboard/watt-copy-to-clipboard.directive.d.ts +12 -0
- package/code/index.d.ts +18 -0
- package/code/watt-code.component.d.ts +32 -0
- package/code/watt-code.worker.token.d.ts +18 -0
- package/core/breakpoints/_breakpoints.import.scss +53 -0
- package/core/breakpoints/_include-media.scss +568 -0
- package/core/breakpoints/breakpoints-observer.d.ts +39 -0
- package/core/breakpoints/breakpoints.d.ts +29 -0
- package/core/breakpoints/index.d.ts +18 -0
- package/core/color/+storybook/storybook-colors-overview.component.scss +50 -0
- package/core/color/color-helper.service.d.ts +12 -0
- package/core/color/colors.d.ts +51 -0
- package/core/color/index.d.ts +18 -0
- package/core/date/dayjs.d.ts +22 -0
- package/core/date/index.d.ts +23 -0
- package/core/date/watt-danish-datetime.providers.d.ts +1 -0
- package/core/date/watt-date-adapter.d.ts +31 -0
- package/core/date/watt-date-range.d.ts +25 -0
- package/core/date/watt-date.pipe.d.ts +28 -0
- package/core/date/watt-format-date.d.ts +11 -0
- package/core/date/watt-locale.service.d.ts +13 -0
- package/core/styles/@energinet-datahub/watt/_index.scss +52 -0
- package/core/styles/@energinet-datahub/watt/_utils.scss +16 -0
- package/core/styles/@energinet-datahub/watt/theme/light-theme.scss +71 -0
- package/core/styles/@energinet-datahub/watt/theme/material-overwrites/datepicker.scss +69 -0
- package/core/styles/@energinet-datahub/watt/theme/material-overwrites/snack-bar.scss +26 -0
- package/core/styles/_box-sizing.scss +22 -0
- package/core/styles/_chips.scss +22 -0
- package/core/styles/_elevation.scss +18 -0
- package/core/styles/_hr.scss +20 -0
- package/core/styles/_table.scss +89 -0
- package/core/styles/_tokens.scss +134 -0
- package/core/styles/_tooltip.scss +64 -0
- package/core/styles/_variables.scss +106 -0
- package/core/styles/_vater.scss +69 -0
- package/core/styles/spacing/+storybook/storybook-spacing-overview.component.scss +25 -0
- package/core/styles/spacing/_baseline.scss +23 -0
- package/core/styles/spacing/_inline.scss +38 -0
- package/core/styles/spacing/_inset.scss +61 -0
- package/core/styles/spacing/_spacing.import.scss +113 -0
- package/core/styles/spacing/_stack.scss +38 -0
- package/core/styles/spacing/_variables.scss +14 -0
- package/core/styles/spacing/index.scss +18 -0
- package/core/styles/typography/+storybook/storybook-typography-overview.component.scss +78 -0
- package/core/styles/typography/_rem.scss +24 -0
- package/core/styles/typography/_typography.import.scss +195 -0
- package/core/styles/typography/index.scss +118 -0
- package/data/index.d.ts +20 -0
- package/data/watt-data-actions.component.d.ts +5 -0
- package/data/watt-data-filters.component.d.ts +5 -0
- package/data/watt-data-intl.service.d.ts +15 -0
- package/data/watt-data-table.component.d.ts +27 -0
- package/datetime-field/index.d.ts +17 -0
- package/datetime-field/watt-datetime-field.component.d.ts +39 -0
- package/description-list/index.d.ts +17 -0
- package/description-list/watt-description-list-item.component.d.ts +27 -0
- package/description-list/watt-description-list.component.d.ts +19 -0
- package/drawer/index.d.ts +21 -0
- package/drawer/watt-drawer-actions.component.d.ts +5 -0
- package/drawer/watt-drawer-content.component.d.ts +5 -0
- package/drawer/watt-drawer-heading.component.d.ts +5 -0
- package/drawer/watt-drawer-topbar.component.d.ts +5 -0
- package/drawer/watt-drawer.component.d.ts +61 -0
- package/dropdown/index.d.ts +19 -0
- package/dropdown/watt-dropdown-option.d.ts +22 -0
- package/dropdown/watt-dropdown-value.d.ts +17 -0
- package/dropdown/watt-dropdown.component.d.ts +195 -0
- package/empty-state/icons/explore.d.ts +5 -0
- package/empty-state/icons/no-results.d.ts +5 -0
- package/empty-state/icons/power.d.ts +5 -0
- package/empty-state/index.d.ts +20 -0
- package/empty-state/watt-empty-state.component.d.ts +16 -0
- package/expandable-card/index.d.ts +19 -0
- package/expandable-card/watt-expandable-card.component.d.ts +34 -0
- package/expansion/expansion.component.d.ts +18 -0
- package/expansion/index.d.ts +17 -0
- package/fesm2022/energinet-watt-badge.mjs +66 -0
- package/fesm2022/energinet-watt-badge.mjs.map +1 -0
- package/fesm2022/energinet-watt-breadcrumbs.mjs +116 -0
- package/fesm2022/energinet-watt-breadcrumbs.mjs.map +1 -0
- package/fesm2022/energinet-watt-button.mjs +120 -0
- package/fesm2022/energinet-watt-button.mjs.map +1 -0
- package/fesm2022/energinet-watt-card.mjs +117 -0
- package/fesm2022/energinet-watt-card.mjs.map +1 -0
- package/fesm2022/energinet-watt-checkbox.mjs +118 -0
- package/fesm2022/energinet-watt-checkbox.mjs.map +1 -0
- package/fesm2022/energinet-watt-chip.mjs +760 -0
- package/fesm2022/energinet-watt-chip.mjs.map +1 -0
- package/fesm2022/energinet-watt-clipboard.mjs +118 -0
- package/fesm2022/energinet-watt-clipboard.mjs.map +1 -0
- package/fesm2022/energinet-watt-code.mjs +119 -0
- package/fesm2022/energinet-watt-code.mjs.map +1 -0
- package/fesm2022/energinet-watt-core-breakpoints.mjs +100 -0
- package/fesm2022/energinet-watt-core-breakpoints.mjs.map +1 -0
- package/fesm2022/energinet-watt-core-color.mjs +127 -0
- package/fesm2022/energinet-watt-core-color.mjs.map +1 -0
- package/fesm2022/energinet-watt-core-date.mjs +260 -0
- package/fesm2022/energinet-watt-core-date.mjs.map +1 -0
- package/fesm2022/energinet-watt-data.mjs +286 -0
- package/fesm2022/energinet-watt-data.mjs.map +1 -0
- package/fesm2022/energinet-watt-datetime-field.mjs +233 -0
- package/fesm2022/energinet-watt-datetime-field.mjs.map +1 -0
- package/fesm2022/energinet-watt-description-list.mjs +130 -0
- package/fesm2022/energinet-watt-description-list.mjs.map +1 -0
- package/fesm2022/energinet-watt-drawer.mjs +271 -0
- package/fesm2022/energinet-watt-drawer.mjs.map +1 -0
- package/fesm2022/energinet-watt-dropdown.mjs +423 -0
- package/fesm2022/energinet-watt-dropdown.mjs.map +1 -0
- package/fesm2022/energinet-watt-empty-state.mjs +299 -0
- package/fesm2022/energinet-watt-empty-state.mjs.map +1 -0
- package/fesm2022/energinet-watt-expandable-card.mjs +151 -0
- package/fesm2022/energinet-watt-expandable-card.mjs.map +1 -0
- package/fesm2022/energinet-watt-expansion.mjs +78 -0
- package/fesm2022/energinet-watt-expansion.mjs.map +1 -0
- package/fesm2022/energinet-watt-field.mjs +249 -0
- package/fesm2022/energinet-watt-field.mjs.map +1 -0
- package/fesm2022/energinet-watt-icon-flags.mjs +376 -0
- package/fesm2022/energinet-watt-icon-flags.mjs.map +1 -0
- package/fesm2022/energinet-watt-icon.mjs +195 -0
- package/fesm2022/energinet-watt-icon.mjs.map +1 -0
- package/fesm2022/energinet-watt-modal.mjs +260 -0
- package/fesm2022/energinet-watt-modal.mjs.map +1 -0
- package/fesm2022/energinet-watt-paginator.mjs +164 -0
- package/fesm2022/energinet-watt-paginator.mjs.map +1 -0
- package/fesm2022/energinet-watt-phone-field.mjs +322 -0
- package/fesm2022/energinet-watt-phone-field.mjs.map +1 -0
- package/fesm2022/energinet-watt-picker-__shared.mjs +384 -0
- package/fesm2022/energinet-watt-picker-__shared.mjs.map +1 -0
- package/fesm2022/energinet-watt-picker-datepicker.mjs +430 -0
- package/fesm2022/energinet-watt-picker-datepicker.mjs.map +1 -0
- package/fesm2022/energinet-watt-picker-timepicker.mjs +394 -0
- package/fesm2022/energinet-watt-picker-timepicker.mjs.map +1 -0
- package/fesm2022/energinet-watt-progress-tracker.mjs +141 -0
- package/fesm2022/energinet-watt-progress-tracker.mjs.map +1 -0
- package/fesm2022/energinet-watt-query-params.mjs +95 -0
- package/fesm2022/energinet-watt-query-params.mjs.map +1 -0
- package/fesm2022/energinet-watt-radio.mjs +125 -0
- package/fesm2022/energinet-watt-radio.mjs.map +1 -0
- package/fesm2022/energinet-watt-search.mjs +126 -0
- package/fesm2022/energinet-watt-search.mjs.map +1 -0
- package/fesm2022/energinet-watt-shell.mjs +315 -0
- package/fesm2022/energinet-watt-shell.mjs.map +1 -0
- package/fesm2022/energinet-watt-slider.mjs +159 -0
- package/fesm2022/energinet-watt-slider.mjs.map +1 -0
- package/fesm2022/energinet-watt-spinner.mjs +72 -0
- package/fesm2022/energinet-watt-spinner.mjs.map +1 -0
- package/fesm2022/energinet-watt-stepper.mjs +185 -0
- package/fesm2022/energinet-watt-stepper.mjs.map +1 -0
- package/fesm2022/energinet-watt-table.mjs +423 -0
- package/fesm2022/energinet-watt-table.mjs.map +1 -0
- package/fesm2022/energinet-watt-tabs.mjs +254 -0
- package/fesm2022/energinet-watt-tabs.mjs.map +1 -0
- package/fesm2022/energinet-watt-text-field.mjs +316 -0
- package/fesm2022/energinet-watt-text-field.mjs.map +1 -0
- package/fesm2022/energinet-watt-textarea-field.mjs +136 -0
- package/fesm2022/energinet-watt-textarea-field.mjs.map +1 -0
- package/fesm2022/energinet-watt-toast.mjs +174 -0
- package/fesm2022/energinet-watt-toast.mjs.map +1 -0
- package/fesm2022/energinet-watt-tooltip.mjs +214 -0
- package/fesm2022/energinet-watt-tooltip.mjs.map +1 -0
- package/fesm2022/energinet-watt-utils-css.mjs +72 -0
- package/fesm2022/energinet-watt-utils-css.mjs.map +1 -0
- package/fesm2022/energinet-watt-utils-intersection-observer.mjs +83 -0
- package/fesm2022/energinet-watt-utils-intersection-observer.mjs.map +1 -0
- package/fesm2022/energinet-watt-utils-resize-observer.mjs +144 -0
- package/fesm2022/energinet-watt-utils-resize-observer.mjs.map +1 -0
- package/fesm2022/energinet-watt-validation-message.mjs +114 -0
- package/fesm2022/energinet-watt-validation-message.mjs.map +1 -0
- package/fesm2022/energinet-watt-validators.mjs +40 -0
- package/fesm2022/energinet-watt-validators.mjs.map +1 -0
- package/fesm2022/energinet-watt-vater.mjs +287 -0
- package/fesm2022/energinet-watt-vater.mjs.map +1 -0
- package/fesm2022/energinet-watt.mjs +47 -0
- package/fesm2022/energinet-watt.mjs.map +1 -0
- package/field/index.d.ts +20 -0
- package/field/watt-field-error.component.d.ts +5 -0
- package/field/watt-field-hint.component.d.ts +5 -0
- package/field/watt-field-intl.service.d.ts +8 -0
- package/field/watt-field.component.d.ts +42 -0
- package/icon/flags/index.d.ts +23 -0
- package/icon/flags/watt-flag-de.d.ts +5 -0
- package/icon/flags/watt-flag-dk.d.ts +5 -0
- package/icon/flags/watt-flag-fi.d.ts +5 -0
- package/icon/flags/watt-flag-no.d.ts +5 -0
- package/icon/flags/watt-flag-pl.d.ts +5 -0
- package/icon/flags/watt-flag-se.d.ts +5 -0
- package/icon/flags/watt-flag.d.ts +13 -0
- package/icon/icon.component.d.ts +20 -0
- package/icon/icons.d.ts +82 -0
- package/icon/index.d.ts +17 -0
- package/index.d.ts +33 -0
- package/modal/index.d.ts +18 -0
- package/modal/watt-modal.component.d.ts +86 -0
- package/modal/watt-modal.service.d.ts +62 -0
- package/package.json +237 -0
- package/paginator/index.d.ts +18 -0
- package/paginator/watt-paginator-intl.service.d.ts +14 -0
- package/paginator/watt-paginator.component.d.ts +53 -0
- package/phone-field/index.d.ts +18 -0
- package/phone-field/watt-phone-field-intl.service.d.ts +14 -0
- package/phone-field/watt-phone-field.component.d.ts +75 -0
- package/picker/__shared/index.d.ts +19 -0
- package/picker/__shared/placeholder-mask/watt-placeholder-mask.component.d.ts +34 -0
- package/picker/__shared/watt-picker-base.d.ts +201 -0
- package/picker/__shared/watt-picker-value.d.ts +18 -0
- package/picker/datepicker/index.d.ts +19 -0
- package/picker/datepicker/watt-datepicker-intl.service.d.ts +7 -0
- package/picker/datepicker/watt-datepicker.component.d.ts +149 -0
- package/picker/timepicker/index.d.ts +17 -0
- package/picker/timepicker/maskito-time-range-mask.d.ts +18 -0
- package/picker/timepicker/watt-timepicker.component.d.ts +132 -0
- package/progress-tracker/index.d.ts +20 -0
- package/progress-tracker/watt-progress-tracker-step.component.d.ts +10 -0
- package/progress-tracker/watt-progress-tracker.component.d.ts +5 -0
- package/query-params/index.d.ts +17 -0
- package/query-params/watt-query-params.directive.d.ts +27 -0
- package/radio/index.d.ts +17 -0
- package/radio/watt-radio.component.d.ts +24 -0
- package/search/index.d.ts +17 -0
- package/search/watt-search.component.d.ts +31 -0
- package/shell/index.d.ts +18 -0
- package/shell/nav-list/index.d.ts +18 -0
- package/shell/nav-list/watt-expand-on-active-link.directive.d.ts +26 -0
- package/shell/nav-list/watt-nav-list-item.component.d.ts +16 -0
- package/shell/nav-list/watt-nav-list.component.d.ts +12 -0
- package/shell/shell.component.d.ts +28 -0
- package/slider/index.d.ts +17 -0
- package/slider/watt-slider.component.d.ts +57 -0
- package/spinner/index.d.ts +17 -0
- package/spinner/watt-spinner.component.d.ts +15 -0
- package/stepper/index.d.ts +18 -0
- package/stepper/watt-stepper-step.component.d.ts +34 -0
- package/stepper/watt-stepper.component.d.ts +40 -0
- package/table/index.d.ts +18 -0
- package/table/watt-table-data-source.d.ts +37 -0
- package/table/watt-table.component.d.ts +239 -0
- package/tabs/index.d.ts +26 -0
- package/tabs/watt-link-tab.component.d.ts +7 -0
- package/tabs/watt-link-tabs.component.d.ts +7 -0
- package/tabs/watt-tab.component.d.ts +26 -0
- package/tabs/watt-tabs-action.component.d.ts +5 -0
- package/tabs/watt-tabs.component.d.ts +36 -0
- package/text-field/index.d.ts +17 -0
- package/text-field/watt-text-field.component.d.ts +77 -0
- package/textarea-field/index.d.ts +17 -0
- package/textarea-field/watt-textarea-field.component.d.ts +27 -0
- package/toast/index.d.ts +19 -0
- package/toast/watt-toast.component.d.ts +47 -0
- package/toast/watt-toast.service.d.ts +13 -0
- package/tooltip/index.d.ts +17 -0
- package/tooltip/watt-tooltip.component.d.ts +47 -0
- package/tooltip/watt-tooltip.directive.d.ts +31 -0
- package/utils/css/css-custom-properties.service.d.ts +10 -0
- package/utils/css/index.d.ts +17 -0
- package/utils/intersection-observer/index.d.ts +17 -0
- package/utils/intersection-observer/watt-intersection-observer.service.d.ts +21 -0
- package/utils/resize-observer/index.d.ts +18 -0
- package/utils/resize-observer/watt-resize-observer.directive.d.ts +35 -0
- package/utils/resize-observer/watt-resize-observer.service.d.ts +39 -0
- package/validation-message/index.d.ts +17 -0
- package/validation-message/watt-validation-message.component.d.ts +50 -0
- package/validators/index.d.ts +17 -0
- package/validators/watt-range.validators.d.ts +23 -0
- package/vater/index.d.ts +20 -0
- package/vater/types.d.ts +21 -0
- package/vater/vater-flex.component.d.ts +19 -0
- package/vater/vater-spacer.component.d.ts +5 -0
- package/vater/vater-stack.component.d.ts +14 -0
- package/vater/vater-utility.directive.d.ts +16 -0
|
@@ -0,0 +1,315 @@
|
|
|
1
|
+
import { AsyncPipe, NgTemplateOutlet } from '@angular/common';
|
|
2
|
+
import * as i0 from '@angular/core';
|
|
3
|
+
import { inject, DestroyRef, ViewChild, Component, input, Directive, output, computed, ChangeDetectionStrategy, contentChildren, ViewEncapsulation } from '@angular/core';
|
|
4
|
+
import * as i1 from '@angular/material/sidenav';
|
|
5
|
+
import { MatSidenavModule } from '@angular/material/sidenav';
|
|
6
|
+
import * as i2 from '@angular/material/toolbar';
|
|
7
|
+
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
8
|
+
import * as i1$1 from '@angular/router';
|
|
9
|
+
import { Router, NavigationEnd, RouterModule } from '@angular/router';
|
|
10
|
+
import { filter, map, switchMap, first, from, mergeMap } from 'rxjs';
|
|
11
|
+
import { takeUntilDestroyed, outputToObservable } from '@angular/core/rxjs-interop';
|
|
12
|
+
import { WattBreakpointsObserver } from '@energinet/watt/core/breakpoints';
|
|
13
|
+
import { WattButtonComponent } from '@energinet/watt/button';
|
|
14
|
+
import * as i1$2 from '@angular/material/expansion';
|
|
15
|
+
import { MatExpansionPanel, MatExpansionModule } from '@angular/material/expansion';
|
|
16
|
+
|
|
17
|
+
//#region License
|
|
18
|
+
/**
|
|
19
|
+
* @license
|
|
20
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
21
|
+
*
|
|
22
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
23
|
+
* you may not use this file except in compliance with the License.
|
|
24
|
+
* You may obtain a copy of the License at
|
|
25
|
+
*
|
|
26
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
27
|
+
*
|
|
28
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
29
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
30
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
31
|
+
* See the License for the specific language governing permissions and
|
|
32
|
+
* limitations under the License.
|
|
33
|
+
*/
|
|
34
|
+
//#endregion
|
|
35
|
+
class WattShellComponent {
|
|
36
|
+
breakpointObserver = inject(WattBreakpointsObserver);
|
|
37
|
+
router = inject(Router);
|
|
38
|
+
/**
|
|
39
|
+
* @ignore
|
|
40
|
+
*/
|
|
41
|
+
_destroyRef = inject(DestroyRef);
|
|
42
|
+
/**
|
|
43
|
+
* @ignore
|
|
44
|
+
*/
|
|
45
|
+
shouldAutoFocus = false;
|
|
46
|
+
/**
|
|
47
|
+
* @ignore
|
|
48
|
+
*/
|
|
49
|
+
onNavigationEnd$ = this.router.events.pipe(filter((event) => event instanceof NavigationEnd));
|
|
50
|
+
/**
|
|
51
|
+
* @ignore
|
|
52
|
+
*/
|
|
53
|
+
isHandset$ = this.breakpointObserver
|
|
54
|
+
.observe(['XSmall', 'Small', 'Medium'])
|
|
55
|
+
.pipe(map((result) => result.matches));
|
|
56
|
+
sidenav;
|
|
57
|
+
ngOnInit() {
|
|
58
|
+
this.closeSidenavOnNavigation();
|
|
59
|
+
}
|
|
60
|
+
closeSidenavOnNavigation() {
|
|
61
|
+
this.onNavigationEnd$
|
|
62
|
+
.pipe(switchMap(() => this.isHandset$.pipe(first())), takeUntilDestroyed(this._destroyRef))
|
|
63
|
+
.subscribe((isHandset) => {
|
|
64
|
+
if (isHandset && this.sidenav && this.sidenav.opened) {
|
|
65
|
+
this.sidenav.close();
|
|
66
|
+
}
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
70
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: WattShellComponent, isStandalone: true, selector: "watt-shell", viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["drawer"], descendants: 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$ | async) === false\"\n [autoFocus]=\"shouldAutoFocus\"\n [mode]=\"(isHandset$ | async) ? 'over' : 'side'\"\n [opened]=\"(isHandset$ | async) === false\"\n role=\"navigation\"\n >\n @if (isHandset$ | async) {\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$ | async) {\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: "pipe", type: AsyncPipe, name: "async" }, { 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", "type", "formId", "disabled", "loading"] }] });
|
|
71
|
+
}
|
|
72
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattShellComponent, decorators: [{
|
|
73
|
+
type: Component,
|
|
74
|
+
args: [{ selector: 'watt-shell', imports: [AsyncPipe, 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$ | async) === false\"\n [autoFocus]=\"shouldAutoFocus\"\n [mode]=\"(isHandset$ | async) ? 'over' : 'side'\"\n [opened]=\"(isHandset$ | async) === false\"\n role=\"navigation\"\n >\n @if (isHandset$ | async) {\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$ | async) {\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"] }]
|
|
75
|
+
}], propDecorators: { sidenav: [{
|
|
76
|
+
type: ViewChild,
|
|
77
|
+
args: ['drawer']
|
|
78
|
+
}] } });
|
|
79
|
+
|
|
80
|
+
//#region License
|
|
81
|
+
/**
|
|
82
|
+
* @license
|
|
83
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
84
|
+
*
|
|
85
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
86
|
+
* you may not use this file except in compliance with the License.
|
|
87
|
+
* You may obtain a copy of the License at
|
|
88
|
+
*
|
|
89
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
90
|
+
*
|
|
91
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
92
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
93
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
94
|
+
* See the License for the specific language governing permissions and
|
|
95
|
+
* limitations under the License.
|
|
96
|
+
*/
|
|
97
|
+
//#endregion
|
|
98
|
+
class WattExpandOnActiveLinkDirective {
|
|
99
|
+
panel = inject(MatExpansionPanel);
|
|
100
|
+
wattNavListItemComponents = input([]);
|
|
101
|
+
ngAfterViewInit() {
|
|
102
|
+
const navListItems = this.wattNavListItemComponents();
|
|
103
|
+
if (navListItems.length > 0) {
|
|
104
|
+
from(this.wattNavListItemComponents())
|
|
105
|
+
.pipe(mergeMap((item) => outputToObservable(item.isActive)), filter((isActive) => isActive))
|
|
106
|
+
.subscribe(() => this.panel.open());
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattExpandOnActiveLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
110
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.1", type: WattExpandOnActiveLinkDirective, isStandalone: true, selector: "[wattExpandOnActiveLink]", inputs: { wattNavListItemComponents: { classPropertyName: "wattNavListItemComponents", publicName: "wattNavListItemComponents", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["wattExpandOnActiveLink"], ngImport: i0 });
|
|
111
|
+
}
|
|
112
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattExpandOnActiveLinkDirective, decorators: [{
|
|
113
|
+
type: Directive,
|
|
114
|
+
args: [{
|
|
115
|
+
selector: '[wattExpandOnActiveLink]',
|
|
116
|
+
exportAs: 'wattExpandOnActiveLink',
|
|
117
|
+
}]
|
|
118
|
+
}] });
|
|
119
|
+
|
|
120
|
+
//#region License
|
|
121
|
+
/**
|
|
122
|
+
* @license
|
|
123
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
124
|
+
*
|
|
125
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
126
|
+
* you may not use this file except in compliance with the License.
|
|
127
|
+
* You may obtain a copy of the License at
|
|
128
|
+
*
|
|
129
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
130
|
+
*
|
|
131
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
132
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
133
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
134
|
+
* See the License for the specific language governing permissions and
|
|
135
|
+
* limitations under the License.
|
|
136
|
+
*/
|
|
137
|
+
//#endregion
|
|
138
|
+
class WattNavListItemComponent {
|
|
139
|
+
link = input.required();
|
|
140
|
+
target = input('_self');
|
|
141
|
+
isActive = output();
|
|
142
|
+
/**
|
|
143
|
+
* @ignore
|
|
144
|
+
*/
|
|
145
|
+
isExternalLink = computed(() => /^(http:\/\/|https:\/\/)/i.test(this.link()));
|
|
146
|
+
/**
|
|
147
|
+
* @ignore
|
|
148
|
+
*/
|
|
149
|
+
onRouterLinkActive(isActive) {
|
|
150
|
+
this.isActive.emit(isActive);
|
|
151
|
+
}
|
|
152
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattNavListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
153
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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: `
|
|
154
|
+
@if (isExternalLink()) {
|
|
155
|
+
<a [href]="link()" [attr.target]="target()"
|
|
156
|
+
><ng-container *ngTemplateOutlet="templateContent"
|
|
157
|
+
/></a>
|
|
158
|
+
} @else {
|
|
159
|
+
<a
|
|
160
|
+
[routerLink]="link()"
|
|
161
|
+
routerLinkActive="active"
|
|
162
|
+
(isActiveChange)="onRouterLinkActive($event)"
|
|
163
|
+
><ng-container *ngTemplateOutlet="templateContent"
|
|
164
|
+
/></a>
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
<ng-template #templateContent>
|
|
168
|
+
<ng-content />
|
|
169
|
+
</ng-template>
|
|
170
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
171
|
+
}
|
|
172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattNavListItemComponent, decorators: [{
|
|
173
|
+
type: Component,
|
|
174
|
+
args: [{
|
|
175
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
176
|
+
selector: 'watt-nav-list-item',
|
|
177
|
+
imports: [NgTemplateOutlet, RouterModule],
|
|
178
|
+
template: `
|
|
179
|
+
@if (isExternalLink()) {
|
|
180
|
+
<a [href]="link()" [attr.target]="target()"
|
|
181
|
+
><ng-container *ngTemplateOutlet="templateContent"
|
|
182
|
+
/></a>
|
|
183
|
+
} @else {
|
|
184
|
+
<a
|
|
185
|
+
[routerLink]="link()"
|
|
186
|
+
routerLinkActive="active"
|
|
187
|
+
(isActiveChange)="onRouterLinkActive($event)"
|
|
188
|
+
><ng-container *ngTemplateOutlet="templateContent"
|
|
189
|
+
/></a>
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
<ng-template #templateContent>
|
|
193
|
+
<ng-content />
|
|
194
|
+
</ng-template>
|
|
195
|
+
`,
|
|
196
|
+
}]
|
|
197
|
+
}] });
|
|
198
|
+
|
|
199
|
+
//#region License
|
|
200
|
+
/**
|
|
201
|
+
* @license
|
|
202
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
203
|
+
*
|
|
204
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
205
|
+
* you may not use this file except in compliance with the License.
|
|
206
|
+
* You may obtain a copy of the License at
|
|
207
|
+
*
|
|
208
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
209
|
+
*
|
|
210
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
211
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
212
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
213
|
+
* See the License for the specific language governing permissions and
|
|
214
|
+
* limitations under the License.
|
|
215
|
+
*/
|
|
216
|
+
//#endregion
|
|
217
|
+
class WattNavListComponent {
|
|
218
|
+
/**
|
|
219
|
+
* @ignore
|
|
220
|
+
*/
|
|
221
|
+
navListItemComponents = contentChildren(WattNavListItemComponent);
|
|
222
|
+
expandable = input(false);
|
|
223
|
+
title = input('');
|
|
224
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
225
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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: `
|
|
226
|
+
@if (expandable()) {
|
|
227
|
+
<mat-expansion-panel
|
|
228
|
+
wattExpandOnActiveLink
|
|
229
|
+
[wattNavListItemComponents]="navListItemComponents()"
|
|
230
|
+
class="mat-elevation-z0"
|
|
231
|
+
>
|
|
232
|
+
<mat-expansion-panel-header>
|
|
233
|
+
<mat-panel-title class="watt-text-m">{{ title() }}</mat-panel-title>
|
|
234
|
+
</mat-expansion-panel-header>
|
|
235
|
+
<ng-container *ngTemplateOutlet="navListTemplate" />
|
|
236
|
+
</mat-expansion-panel>
|
|
237
|
+
} @else {
|
|
238
|
+
<ng-container *ngTemplateOutlet="navListTemplate" />
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
<ng-template #navListTemplate>
|
|
242
|
+
<ng-content />
|
|
243
|
+
</ng-template>
|
|
244
|
+
`, 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);display:block;border-left:var(--watt-space-xs) solid transparent;color:var(--watt-color-neutral-white);text-decoration:none}watt-nav-list watt-nav-list-item a:hover,watt-nav-list watt-nav-list-item a.active{background-color:var(--watt-nav-list-hover-background-color)}watt-nav-list watt-nav-list-item a.active{border-left-color:var(--watt-color-secondary)}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel{background-color:var(--watt-sidenav-background-color);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]){background-color:var(--watt-nav-list-hover-background-color)}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel-header{padding-left:calc(var(--watt-space-xs) + var(--watt-space-m));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-l)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i1$2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: WattExpandOnActiveLinkDirective, selector: "[wattExpandOnActiveLink]", inputs: ["wattNavListItemComponents"], exportAs: ["wattExpandOnActiveLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
245
|
+
}
|
|
246
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattNavListComponent, decorators: [{
|
|
247
|
+
type: Component,
|
|
248
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, selector: 'watt-nav-list', host: {
|
|
249
|
+
'[class.watt-nav-list--expandable]': 'expandable()',
|
|
250
|
+
}, template: `
|
|
251
|
+
@if (expandable()) {
|
|
252
|
+
<mat-expansion-panel
|
|
253
|
+
wattExpandOnActiveLink
|
|
254
|
+
[wattNavListItemComponents]="navListItemComponents()"
|
|
255
|
+
class="mat-elevation-z0"
|
|
256
|
+
>
|
|
257
|
+
<mat-expansion-panel-header>
|
|
258
|
+
<mat-panel-title class="watt-text-m">{{ title() }}</mat-panel-title>
|
|
259
|
+
</mat-expansion-panel-header>
|
|
260
|
+
<ng-container *ngTemplateOutlet="navListTemplate" />
|
|
261
|
+
</mat-expansion-panel>
|
|
262
|
+
} @else {
|
|
263
|
+
<ng-container *ngTemplateOutlet="navListTemplate" />
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
<ng-template #navListTemplate>
|
|
267
|
+
<ng-content />
|
|
268
|
+
</ng-template>
|
|
269
|
+
`, imports: [NgTemplateOutlet, RouterModule, MatExpansionModule, WattExpandOnActiveLinkDirective], 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);display:block;border-left:var(--watt-space-xs) solid transparent;color:var(--watt-color-neutral-white);text-decoration:none}watt-nav-list watt-nav-list-item a:hover,watt-nav-list watt-nav-list-item a.active{background-color:var(--watt-nav-list-hover-background-color)}watt-nav-list watt-nav-list-item a.active{border-left-color:var(--watt-color-secondary)}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel{background-color:var(--watt-sidenav-background-color);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]){background-color:var(--watt-nav-list-hover-background-color)}watt-nav-list.watt-nav-list--expandable .mat-expansion-panel-header{padding-left:calc(var(--watt-space-xs) + var(--watt-space-m));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-l)}\n"] }]
|
|
270
|
+
}] });
|
|
271
|
+
|
|
272
|
+
//#region License
|
|
273
|
+
/**
|
|
274
|
+
* @license
|
|
275
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
276
|
+
*
|
|
277
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
278
|
+
* you may not use this file except in compliance with the License.
|
|
279
|
+
* You may obtain a copy of the License at
|
|
280
|
+
*
|
|
281
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
282
|
+
*
|
|
283
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
284
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
285
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
286
|
+
* See the License for the specific language governing permissions and
|
|
287
|
+
* limitations under the License.
|
|
288
|
+
*/
|
|
289
|
+
//#endregion
|
|
290
|
+
|
|
291
|
+
//#region License
|
|
292
|
+
/**
|
|
293
|
+
* @license
|
|
294
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
295
|
+
*
|
|
296
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
297
|
+
* you may not use this file except in compliance with the License.
|
|
298
|
+
* You may obtain a copy of the License at
|
|
299
|
+
*
|
|
300
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
301
|
+
*
|
|
302
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
303
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
304
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
305
|
+
* See the License for the specific language governing permissions and
|
|
306
|
+
* limitations under the License.
|
|
307
|
+
*/
|
|
308
|
+
//#endregion
|
|
309
|
+
|
|
310
|
+
/**
|
|
311
|
+
* Generated bundle index. Do not edit.
|
|
312
|
+
*/
|
|
313
|
+
|
|
314
|
+
export { WattNavListComponent, WattNavListItemComponent, WattShellComponent };
|
|
315
|
+
//# sourceMappingURL=energinet-watt-shell.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"energinet-watt-shell.mjs","sources":["../../../libs/watt/package/shell/shell.component.ts","../../../libs/watt/package/shell/shell.component.html","../../../libs/watt/package/shell/nav-list/watt-expand-on-active-link.directive.ts","../../../libs/watt/package/shell/nav-list/watt-nav-list-item.component.ts","../../../libs/watt/package/shell/nav-list/watt-nav-list.component.ts","../../../libs/watt/package/shell/nav-list/index.ts","../../../libs/watt/package/shell/index.ts","../../../libs/watt/package/shell/energinet-watt-shell.ts"],"sourcesContent":["//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nimport { AsyncPipe } from '@angular/common';\nimport { Component, DestroyRef, OnInit, ViewChild, inject } from '@angular/core';\nimport { MatSidenav, MatSidenavModule } from '@angular/material/sidenav';\nimport { MatToolbarModule } from '@angular/material/toolbar';\nimport { Router, NavigationEnd } from '@angular/router';\nimport { filter, map, switchMap, first } from 'rxjs';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { WattBreakpointsObserver } from '@energinet/watt/core/breakpoints';\nimport { WattButtonComponent } from '@energinet/watt/button';\n\n@Component({\n selector: 'watt-shell',\n styleUrls: ['./shell.component.scss'],\n templateUrl: './shell.component.html',\n imports: [AsyncPipe, MatSidenavModule, MatToolbarModule, WattButtonComponent],\n})\nexport class WattShellComponent implements OnInit {\n private breakpointObserver = inject(WattBreakpointsObserver);\n private router = inject(Router);\n /**\n * @ignore\n */\n private _destroyRef = inject(DestroyRef);\n\n /**\n * @ignore\n */\n shouldAutoFocus = false;\n\n /**\n * @ignore\n */\n private onNavigationEnd$ = this.router.events.pipe(\n filter((event) => event instanceof NavigationEnd)\n );\n\n /**\n * @ignore\n */\n isHandset$ = this.breakpointObserver\n .observe(['XSmall', 'Small', 'Medium'])\n .pipe(map((result) => result.matches));\n\n @ViewChild('drawer') sidenav!: MatSidenav;\n\n ngOnInit(): void {\n this.closeSidenavOnNavigation();\n }\n\n private closeSidenavOnNavigation(): void {\n this.onNavigationEnd$\n .pipe(\n switchMap(() => this.isHandset$.pipe(first())),\n takeUntilDestroyed(this._destroyRef)\n )\n .subscribe((isHandset) => {\n if (isHandset && this.sidenav && this.sidenav.opened) {\n this.sidenav.close();\n }\n });\n }\n}\n","<!--\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$ | async) === false\"\n [autoFocus]=\"shouldAutoFocus\"\n [mode]=\"(isHandset$ | async) ? 'over' : 'side'\"\n [opened]=\"(isHandset$ | async) === false\"\n role=\"navigation\"\n >\n @if (isHandset$ | async) {\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$ | async) {\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","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nimport { Directive, AfterViewInit, inject, input } from '@angular/core';\nimport { MatExpansionPanel } from '@angular/material/expansion';\nimport { outputToObservable } from '@angular/core/rxjs-interop';\nimport { from, filter, mergeMap } from 'rxjs';\n\nimport { WattNavListItemComponent } from './watt-nav-list-item.component';\n\n@Directive({\n selector: '[wattExpandOnActiveLink]',\n exportAs: 'wattExpandOnActiveLink',\n})\nexport class WattExpandOnActiveLinkDirective implements AfterViewInit {\n private panel = inject(MatExpansionPanel);\n\n wattNavListItemComponents = input<readonly WattNavListItemComponent[]>([]);\n\n ngAfterViewInit(): void {\n const navListItems = this.wattNavListItemComponents();\n\n if (navListItems.length > 0) {\n from(this.wattNavListItemComponents())\n .pipe(\n mergeMap((item) => outputToObservable(item.isActive)),\n filter((isActive) => isActive)\n )\n .subscribe(() => this.panel.open());\n }\n }\n}\n","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nimport { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { RouterModule } from '@angular/router';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'watt-nav-list-item',\n imports: [NgTemplateOutlet, RouterModule],\n template: `\n @if (isExternalLink()) {\n <a [href]=\"link()\" [attr.target]=\"target()\"\n ><ng-container *ngTemplateOutlet=\"templateContent\"\n /></a>\n } @else {\n <a\n [routerLink]=\"link()\"\n routerLinkActive=\"active\"\n (isActiveChange)=\"onRouterLinkActive($event)\"\n ><ng-container *ngTemplateOutlet=\"templateContent\"\n /></a>\n }\n\n <ng-template #templateContent>\n <ng-content />\n </ng-template>\n `,\n})\nexport class WattNavListItemComponent {\n link = input.required<string>();\n target = input<'_self' | '_blank' | '_parent' | '_top'>('_self');\n isActive = output<boolean>();\n\n /**\n * @ignore\n */\n isExternalLink = computed(() => /^(http:\\/\\/|https:\\/\\/)/i.test(this.link()));\n\n /**\n * @ignore\n */\n onRouterLinkActive(isActive: boolean) {\n this.isActive.emit(isActive);\n }\n}\n","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ViewEncapsulation,\n contentChildren,\n input,\n} from '@angular/core';\nimport { RouterModule } from '@angular/router';\nimport { MatExpansionModule } from '@angular/material/expansion';\n\nimport { WattExpandOnActiveLinkDirective } from './watt-expand-on-active-link.directive';\nimport { WattNavListItemComponent } from './watt-nav-list-item.component';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n selector: 'watt-nav-list',\n styleUrl: './watt-nav-list.component.scss',\n host: {\n '[class.watt-nav-list--expandable]': 'expandable()',\n },\n template: `\n @if (expandable()) {\n <mat-expansion-panel\n wattExpandOnActiveLink\n [wattNavListItemComponents]=\"navListItemComponents()\"\n class=\"mat-elevation-z0\"\n >\n <mat-expansion-panel-header>\n <mat-panel-title class=\"watt-text-m\">{{ title() }}</mat-panel-title>\n </mat-expansion-panel-header>\n <ng-container *ngTemplateOutlet=\"navListTemplate\" />\n </mat-expansion-panel>\n } @else {\n <ng-container *ngTemplateOutlet=\"navListTemplate\" />\n }\n\n <ng-template #navListTemplate>\n <ng-content />\n </ng-template>\n `,\n imports: [NgTemplateOutlet, RouterModule, MatExpansionModule, WattExpandOnActiveLinkDirective],\n})\nexport class WattNavListComponent {\n /**\n * @ignore\n */\n navListItemComponents = contentChildren(WattNavListItemComponent);\n\n expandable = input(false);\n title = input('');\n}\n","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nexport { WattNavListComponent } from './watt-nav-list.component';\nexport { WattNavListItemComponent } from './watt-nav-list-item.component';\n","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nexport { WattShellComponent } from './shell.component';\nexport * from './nav-list';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":";;;;;;;;;;;;;;;;AAAA;AACA;;;;;;;;;;;;;;;AAeG;AACH;MAkBa,kBAAkB,CAAA;AACrB,IAAA,kBAAkB,GAAG,MAAM,CAAC,uBAAuB,CAAC;AACpD,IAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;AAC/B;;AAEG;AACK,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAExC;;AAEG;IACH,eAAe,GAAG,KAAK;AAEvB;;AAEG;IACK,gBAAgB,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAChD,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,YAAY,aAAa,CAAC,CAClD;AAED;;AAEG;IACH,UAAU,GAAG,IAAI,CAAC;SACf,OAAO,CAAC,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,CAAC;AACrC,SAAA,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,OAAO,CAAC,CAAC;AAEnB,IAAA,OAAO;IAE5B,QAAQ,GAAA;QACN,IAAI,CAAC,wBAAwB,EAAE;;IAGzB,wBAAwB,GAAA;AAC9B,QAAA,IAAI,CAAC;aACF,IAAI,CACH,SAAS,CAAC,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,EAC9C,kBAAkB,CAAC,IAAI,CAAC,WAAW,CAAC;AAErC,aAAA,SAAS,CAAC,CAAC,SAAS,KAAI;AACvB,YAAA,IAAI,SAAS,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;AACpD,gBAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;;AAExB,SAAC,CAAC;;uGA3CK,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,SAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,QAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnC/B,+mDAmDA,EDlBY,MAAA,EAAA,CAAA,ohCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,SAAS,6CAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,aAAA,EAAA,gBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,QAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,OAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,mBAAmB,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,SAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAEjE,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAN9B,SAAS;+BACE,YAAY,EAAA,OAAA,EAGb,CAAC,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,mBAAmB,CAAC,EAAA,QAAA,EAAA,+mDAAA,EAAA,MAAA,EAAA,CAAA,ohCAAA,CAAA,EAAA;8BA6BxD,OAAO,EAAA,CAAA;sBAA3B,SAAS;uBAAC,QAAQ;;;AE9DrB;AACA;;;;;;;;;;;;;;;AAeG;AACH;MAYa,+BAA+B,CAAA;AAClC,IAAA,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC;AAEzC,IAAA,yBAAyB,GAAG,KAAK,CAAsC,EAAE,CAAC;IAE1E,eAAe,GAAA;AACb,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,yBAAyB,EAAE;AAErD,QAAA,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,YAAA,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE;iBAClC,IAAI,CACH,QAAQ,CAAC,CAAC,IAAI,KAAK,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,EACrD,MAAM,CAAC,CAAC,QAAQ,KAAK,QAAQ,CAAC;iBAE/B,SAAS,CAAC,MAAM,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;;;uGAd9B,+BAA+B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA/B,+BAA+B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,0BAAA,EAAA,MAAA,EAAA,EAAA,yBAAA,EAAA,EAAA,iBAAA,EAAA,2BAAA,EAAA,UAAA,EAAA,2BAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAA/B,+BAA+B,EAAA,UAAA,EAAA,CAAA;kBAJ3C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,0BAA0B;AACpC,oBAAA,QAAQ,EAAE,wBAAwB;AACnC,iBAAA;;;AC5BD;AACA;;;;;;;;;;;;;;;AAeG;AACH;MA4Ba,wBAAwB,CAAA;AACnC,IAAA,IAAI,GAAG,KAAK,CAAC,QAAQ,EAAU;AAC/B,IAAA,MAAM,GAAG,KAAK,CAA0C,OAAO,CAAC;IAChE,QAAQ,GAAG,MAAM,EAAW;AAE5B;;AAEG;AACH,IAAA,cAAc,GAAG,QAAQ,CAAC,MAAM,0BAA0B,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;AAE7E;;AAEG;AACH,IAAA,kBAAkB,CAAC,QAAiB,EAAA;AAClC,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC;;uGAdnB,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,EAnBzB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA;;;;;;;;;;;;;;;;;GAiBT,EAlBS,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,mJAAE,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,aAAA,EAAA,UAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,uBAAA,EAAA,kBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAoB7B,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAvBpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;oBACT,eAAe,EAAE,uBAAuB,CAAC,MAAM;AAC/C,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,OAAO,EAAE,CAAC,gBAAgB,EAAE,YAAY,CAAC;AACzC,oBAAA,QAAQ,EAAE;;;;;;;;;;;;;;;;;AAiBT,EAAA,CAAA;AACF,iBAAA;;;AC5CD;AACA;;;;;;;;;;;;;;;AAeG;AACH;MA6Ca,oBAAoB,CAAA;AAC/B;;AAEG;AACH,IAAA,qBAAqB,GAAG,eAAe,CAAC,wBAAwB,CAAC;AAEjE,IAAA,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC;AACzB,IAAA,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC;uGAPN,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAApB,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iCAAA,EAAA,cAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,uBAAA,EAAA,SAAA,EAIS,wBAAwB,EA1BtD,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA;;;;;;;;;;;;;;;;;;;AAmBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,igDAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACS,gBAAgB,EAAE,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,EAAE,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,kBAAkB,geAAE,+BAA+B,EAAA,QAAA,EAAA,0BAAA,EAAA,MAAA,EAAA,CAAA,2BAAA,CAAA,EAAA,QAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAElF,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBA9BhC,SAAS;sCACS,uBAAuB,CAAC,MAAM,EAChC,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAC3B,eAAe,EAEnB,IAAA,EAAA;AACJ,wBAAA,mCAAmC,EAAE,cAAc;qBACpD,EACS,QAAA,EAAA;;;;;;;;;;;;;;;;;;;GAmBT,EACQ,OAAA,EAAA,CAAC,gBAAgB,EAAE,YAAY,EAAE,kBAAkB,EAAE,+BAA+B,CAAC,EAAA,MAAA,EAAA,CAAA,igDAAA,CAAA,EAAA;;;AC5DhG;AACA;;;;;;;;;;;;;;;AAeG;AACH;;ACjBA;AACA;;;;;;;;;;;;;;;AAeG;AACH;;ACjBA;;AAEG;;;;"}
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { inject, EventEmitter, Output, ViewChild, Input, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import { fromEvent } from 'rxjs';
|
|
4
|
+
import { WattColorHelperService } from '@energinet/watt/core/color';
|
|
5
|
+
|
|
6
|
+
//#region License
|
|
7
|
+
/**
|
|
8
|
+
* @license
|
|
9
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
10
|
+
*
|
|
11
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
12
|
+
* you may not use this file except in compliance with the License.
|
|
13
|
+
* You may obtain a copy of the License at
|
|
14
|
+
*
|
|
15
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
16
|
+
*
|
|
17
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
18
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
19
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
20
|
+
* See the License for the specific language governing permissions and
|
|
21
|
+
* limitations under the License.
|
|
22
|
+
*/
|
|
23
|
+
//#endregion
|
|
24
|
+
/**
|
|
25
|
+
* Slider for providing a range of values.
|
|
26
|
+
*/
|
|
27
|
+
class WattSliderComponent {
|
|
28
|
+
_colorService = inject(WattColorHelperService);
|
|
29
|
+
/** The lowest permitted value. */
|
|
30
|
+
min = 0;
|
|
31
|
+
/** The highest permitted value. */
|
|
32
|
+
max = 100;
|
|
33
|
+
/** Step between each value. */
|
|
34
|
+
step = 1;
|
|
35
|
+
/** The currently selected range value. */
|
|
36
|
+
value = { min: this.min, max: this.max };
|
|
37
|
+
maxRange;
|
|
38
|
+
minRange;
|
|
39
|
+
_maxChangeSubscription;
|
|
40
|
+
_minChangeSubscription;
|
|
41
|
+
/**
|
|
42
|
+
* Emits value whenever it changes.
|
|
43
|
+
* @ignore
|
|
44
|
+
*/
|
|
45
|
+
valueChange = new EventEmitter();
|
|
46
|
+
ngAfterViewInit() {
|
|
47
|
+
const maxRangeElement = this.maxRange.nativeElement;
|
|
48
|
+
const minRangeElement = this.minRange.nativeElement;
|
|
49
|
+
const maxChanged$ = fromEvent(maxRangeElement, 'input');
|
|
50
|
+
const minChanged$ = fromEvent(minRangeElement, 'input');
|
|
51
|
+
this.updateRange(this.value.min, this.value.max);
|
|
52
|
+
this._maxChangeSubscription = maxChanged$.subscribe((event) => {
|
|
53
|
+
const maxValue = event.target.valueAsNumber;
|
|
54
|
+
const minValue = minRangeElement.valueAsNumber || this.min;
|
|
55
|
+
this.updateRange(minValue, maxValue);
|
|
56
|
+
if (minValue <= maxValue) {
|
|
57
|
+
maxRangeElement.valueAsNumber = maxValue;
|
|
58
|
+
}
|
|
59
|
+
else {
|
|
60
|
+
maxRangeElement.valueAsNumber = minValue;
|
|
61
|
+
}
|
|
62
|
+
this.onChange({ min: minValue, max: maxValue });
|
|
63
|
+
});
|
|
64
|
+
this._minChangeSubscription = minChanged$.subscribe((event) => {
|
|
65
|
+
const minValue = event.target.valueAsNumber;
|
|
66
|
+
const maxValue = maxRangeElement.valueAsNumber || this.max;
|
|
67
|
+
this.updateRange(minValue, maxValue);
|
|
68
|
+
if (minValue > maxValue) {
|
|
69
|
+
minRangeElement.valueAsNumber = maxValue;
|
|
70
|
+
}
|
|
71
|
+
this.onChange({ min: minValue, max: maxValue });
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
isElementRefsPopulated() {
|
|
75
|
+
return !!this.maxRange && !!this.minRange;
|
|
76
|
+
}
|
|
77
|
+
ngOnChanges() {
|
|
78
|
+
if (this.isElementRefsPopulated()) {
|
|
79
|
+
this.updateRange(this.value.min, this.value.max);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
ngOnDestroy() {
|
|
83
|
+
this._maxChangeSubscription.unsubscribe();
|
|
84
|
+
this._minChangeSubscription.unsubscribe();
|
|
85
|
+
}
|
|
86
|
+
updateRange(minValue, maxValue) {
|
|
87
|
+
const rangeDistance = this.max - this.min;
|
|
88
|
+
const fromPosition = minValue - this.min;
|
|
89
|
+
const toPosition = maxValue - this.min;
|
|
90
|
+
const sliderColor = this._colorService.getColor('secondaryLight');
|
|
91
|
+
const rangeColor = this._colorService.getColor('primary');
|
|
92
|
+
this.maxRange.nativeElement.valueAsNumber = this.value.max;
|
|
93
|
+
this.minRange.nativeElement.valueAsNumber = this.value.min;
|
|
94
|
+
this.maxRange.nativeElement.style.background = `linear-gradient(
|
|
95
|
+
to right,
|
|
96
|
+
${sliderColor} 0%,
|
|
97
|
+
${sliderColor} ${(fromPosition / rangeDistance) * 100}%,
|
|
98
|
+
${rangeColor} ${(fromPosition / rangeDistance) * 100}%,
|
|
99
|
+
${rangeColor} ${(toPosition / rangeDistance) * 100}%,
|
|
100
|
+
${sliderColor} ${(toPosition / rangeDistance) * 100}%,
|
|
101
|
+
${sliderColor} 100%)`;
|
|
102
|
+
}
|
|
103
|
+
/**
|
|
104
|
+
* Change handler for updating value.
|
|
105
|
+
* @ignore
|
|
106
|
+
*/
|
|
107
|
+
onChange(value) {
|
|
108
|
+
this.value = value;
|
|
109
|
+
this.valueChange.emit(value);
|
|
110
|
+
}
|
|
111
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
112
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: WattSliderComponent, isStandalone: true, selector: "watt-slider", inputs: { min: "min", max: "max", step: "step", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "maxRange", first: true, predicate: ["maxRange"], descendants: true }, { propertyName: "minRange", first: true, predicate: ["minRange"], descendants: true }], usesOnChanges: 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 });
|
|
113
|
+
}
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattSliderComponent, decorators: [{
|
|
115
|
+
type: Component,
|
|
116
|
+
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"] }]
|
|
117
|
+
}], propDecorators: { min: [{
|
|
118
|
+
type: Input
|
|
119
|
+
}], max: [{
|
|
120
|
+
type: Input
|
|
121
|
+
}], step: [{
|
|
122
|
+
type: Input
|
|
123
|
+
}], value: [{
|
|
124
|
+
type: Input
|
|
125
|
+
}], maxRange: [{
|
|
126
|
+
type: ViewChild,
|
|
127
|
+
args: ['maxRange']
|
|
128
|
+
}], minRange: [{
|
|
129
|
+
type: ViewChild,
|
|
130
|
+
args: ['minRange']
|
|
131
|
+
}], valueChange: [{
|
|
132
|
+
type: Output
|
|
133
|
+
}] } });
|
|
134
|
+
|
|
135
|
+
//#region License
|
|
136
|
+
/**
|
|
137
|
+
* @license
|
|
138
|
+
* Copyright 2020 Energinet DataHub A/S
|
|
139
|
+
*
|
|
140
|
+
* Licensed under the Apache License, Version 2.0 (the "License2");
|
|
141
|
+
* you may not use this file except in compliance with the License.
|
|
142
|
+
* You may obtain a copy of the License at
|
|
143
|
+
*
|
|
144
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
145
|
+
*
|
|
146
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
147
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
148
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
149
|
+
* See the License for the specific language governing permissions and
|
|
150
|
+
* limitations under the License.
|
|
151
|
+
*/
|
|
152
|
+
//#endregion
|
|
153
|
+
|
|
154
|
+
/**
|
|
155
|
+
* Generated bundle index. Do not edit.
|
|
156
|
+
*/
|
|
157
|
+
|
|
158
|
+
export { WattSliderComponent };
|
|
159
|
+
//# sourceMappingURL=energinet-watt-slider.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"energinet-watt-slider.mjs","sources":["../../../libs/watt/package/slider/watt-slider.component.ts","../../../libs/watt/package/slider/watt-slider.component.html","../../../libs/watt/package/slider/index.ts","../../../libs/watt/package/slider/energinet-watt-slider.ts"],"sourcesContent":["//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n Input,\n OnChanges,\n OnDestroy,\n Output,\n ViewChild,\n ViewEncapsulation,\n inject,\n} from '@angular/core';\nimport { Subscription, fromEvent } from 'rxjs';\n\nimport { WattColorHelperService } from '@energinet/watt/core/color';\n\nexport interface WattSliderValue {\n min: number;\n max: number;\n}\n\n/**\n * Slider for providing a range of values.\n */\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n selector: 'watt-slider',\n styleUrls: ['./watt-slider.component.scss'],\n templateUrl: './watt-slider.component.html',\n})\nexport class WattSliderComponent implements AfterViewInit, OnDestroy, OnChanges {\n private _colorService = inject(WattColorHelperService);\n /** The lowest permitted value. */\n @Input() min = 0;\n\n /** The highest permitted value. */\n @Input() max = 100;\n\n /** Step between each value. */\n @Input() step = 1;\n\n /** The currently selected range value. */\n @Input() value: WattSliderValue = { min: this.min, max: this.max };\n\n @ViewChild('maxRange') maxRange!: ElementRef<HTMLInputElement>;\n\n @ViewChild('minRange') minRange!: ElementRef<HTMLInputElement>;\n\n private _maxChangeSubscription!: Subscription;\n private _minChangeSubscription!: Subscription;\n /**\n * Emits value whenever it changes.\n * @ignore\n */\n @Output() valueChange = new EventEmitter<WattSliderValue>();\n\n ngAfterViewInit(): void {\n const maxRangeElement = this.maxRange.nativeElement;\n const minRangeElement = this.minRange.nativeElement;\n const maxChanged$ = fromEvent(maxRangeElement, 'input');\n const minChanged$ = fromEvent(minRangeElement, 'input');\n\n this.updateRange(this.value.min, this.value.max);\n\n this._maxChangeSubscription = maxChanged$.subscribe((event) => {\n const maxValue = (event.target as HTMLInputElement).valueAsNumber;\n const minValue = minRangeElement.valueAsNumber || this.min;\n this.updateRange(minValue, maxValue);\n\n if (minValue <= maxValue) {\n maxRangeElement.valueAsNumber = maxValue;\n } else {\n maxRangeElement.valueAsNumber = minValue;\n }\n\n this.onChange({ min: minValue, max: maxValue });\n });\n\n this._minChangeSubscription = minChanged$.subscribe((event) => {\n const minValue = (event.target as HTMLInputElement).valueAsNumber;\n const maxValue = maxRangeElement.valueAsNumber || this.max;\n this.updateRange(minValue, maxValue);\n\n if (minValue > maxValue) {\n minRangeElement.valueAsNumber = maxValue;\n }\n\n this.onChange({ min: minValue, max: maxValue });\n });\n }\n\n isElementRefsPopulated(): boolean {\n return !!this.maxRange && !!this.minRange;\n }\n\n ngOnChanges(): void {\n if (this.isElementRefsPopulated()) {\n this.updateRange(this.value.min, this.value.max);\n }\n }\n\n ngOnDestroy(): void {\n this._maxChangeSubscription.unsubscribe();\n this._minChangeSubscription.unsubscribe();\n }\n\n private updateRange(minValue: number, maxValue: number) {\n const rangeDistance = this.max - this.min;\n const fromPosition = minValue - this.min;\n const toPosition = maxValue - this.min;\n\n const sliderColor = this._colorService.getColor('secondaryLight');\n const rangeColor = this._colorService.getColor('primary');\n\n this.maxRange.nativeElement.valueAsNumber = this.value.max;\n this.minRange.nativeElement.valueAsNumber = this.value.min;\n this.maxRange.nativeElement.style.background = `linear-gradient(\n to right,\n ${sliderColor} 0%,\n ${sliderColor} ${(fromPosition / rangeDistance) * 100}%,\n ${rangeColor} ${(fromPosition / rangeDistance) * 100}%,\n ${rangeColor} ${(toPosition / rangeDistance) * 100}%,\n ${sliderColor} ${(toPosition / rangeDistance) * 100}%,\n ${sliderColor} 100%)`;\n }\n\n /**\n * Change handler for updating value.\n * @ignore\n */\n onChange(value: WattSliderValue) {\n this.value = value;\n this.valueChange.emit(value);\n }\n}\n","<!--\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","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nexport { WattSliderComponent, WattSliderValue } from './watt-slider.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|