@ndwnu/design-system 13.1.0 → 13.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +1525 -0
- package/assets/images/flags/de.svg +1 -0
- package/assets/images/flags/en.svg +1 -0
- package/assets/images/flags/fr.svg +1 -0
- package/assets/images/flags/nl.svg +1 -0
- package/fesm2022/ndwnu-design-system.mjs +71 -18
- package/fesm2022/ndwnu-design-system.mjs.map +1 -1
- package/package.json +1 -1
- package/styles/components/_datepicker.scss +13 -0
- package/types/ndwnu-design-system.d.ts +30 -7
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><clipPath id="de"><circle cx="32" cy="32" r="32"/></clipPath><g clip-path="url(#de)"><rect y="0" width="64" height="21.3" fill="#000"/><rect y="21.3" width="64" height="21.4" fill="#DD0000"/><rect y="42.7" width="64" height="21.3" fill="#FFCC00"/></g></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><clipPath id="en"><circle cx="32" cy="32" r="32"/></clipPath><g clip-path="url(#en)"><rect width="64" height="64" fill="#012169"/><path d="M0 0L64 64M64 0L0 64" stroke="#FFF" stroke-width="10"/><path d="M0 0L64 64M64 0L0 64" stroke="#C8102E" stroke-width="6"/><path d="M32 0V64M0 32H64" stroke="#FFF" stroke-width="16"/><path d="M32 0V64M0 32H64" stroke="#C8102E" stroke-width="10"/></g></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><clipPath id="fr"><circle cx="32" cy="32" r="32"/></clipPath><g clip-path="url(#fr)"><rect x="0" width="21.3" height="64" fill="#002395"/><rect x="21.3" width="21.4" height="64" fill="#FFF"/><rect x="42.7" width="21.3" height="64" fill="#ED2939"/></g></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><clipPath id="nl"><circle cx="32" cy="32" r="32"/></clipPath><g clip-path="url(#nl)"><rect y="0" width="64" height="21.3" fill="#AE1C28"/><rect y="21.3" width="64" height="21.4" fill="#FFF"/><rect y="42.7" width="64" height="21.3" fill="#21468B"/></g></svg>
|
|
@@ -2993,6 +2993,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
2993
2993
|
args: [{ selector: 'ndw-key-value-list', imports: [IconComponent, NgTemplateOutlet, TooltipDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<dl\n [class.striped]=\"hasZebraStripes()\"\n [class.fluid]=\"fluid()\"\n [class.font-md]=\"fontSize() === 'md'\"\n [class.font-lg]=\"fontSize() === 'lg'\"\n>\n @for (keyValueRow of normalizedData(); track keyValueRow.key) {\n <dt>\n <ng-container *ngTemplateOutlet=\"cellData; context: { $implicit: keyValueRow.key }\" />\n </dt>\n <dd>\n <ng-container *ngTemplateOutlet=\"cellData; context: { $implicit: keyValueRow.value }\" />\n </dd>\n }\n</dl>\n\n<ng-template #cellData let-data>\n @if (data.url) {\n <a ndwLink target=\"_blank\" [href]=\"data.url\">\n {{ data.label }}\n <ndw-icon size=\"sm\">open_in_new</ndw-icon>\n </a>\n } @else {\n {{ data.label }}\n }\n\n @if (data.tooltip) {\n <ndw-icon class=\"tooltip-icon\" size=\"sm\" [ndwTooltip]=\"data.tooltip\">info</ndw-icon>\n }\n</ng-template>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..650;1,9..40,400..650&family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,400,0..1&family=Nunito+Sans:ital,opsz,wght@0,6..12,400..650;1,6..12,400..650&display=block\";.ndw-heading-xl{font-family:var(--ndw-font-family-heading);font-size:2.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-lg{font-family:var(--ndw-font-family-heading);font-size:2rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-md{font-family:var(--ndw-font-family-heading);font-size:1.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-sm{font-family:var(--ndw-font-family-heading);font-size:1.25rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-bold-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}dl{display:grid;width:fit-content;grid-template-columns:auto auto;margin:0}dl dt,dl dd{display:flex;align-items:center;gap:var(--ndw-spacing-2xs);padding-block:var(--ndw-spacing-xs);margin:0}dl dt .tooltip-icon,dl dd .tooltip-icon{color:var(--ndw-color-info-500)}dl dt{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%;padding-inline-end:var(--ndw-spacing-2xs)}dl dd{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%;padding-inline-start:var(--ndw-spacing-2xs)}dl.font-md dt{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}dl.font-md dd{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}dl.font-lg dt{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}dl.font-lg dd{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}dl.striped dt{padding-inline-start:var(--ndw-spacing-xs)}dl.striped dd{padding-inline-end:var(--ndw-spacing-xs)}dl.striped dt:nth-child(4n+1),dl.striped dd:nth-child(4n+2){background-color:var(--ndw-color-grey-100)}dl.fluid{width:100%}\n"] }]
|
|
2994
2994
|
}] });
|
|
2995
2995
|
|
|
2996
|
+
const LANGUAGE_FLAGS = {
|
|
2997
|
+
NL: 'images/flags/nl.svg',
|
|
2998
|
+
EN: 'images/flags/en.svg',
|
|
2999
|
+
FR: 'images/flags/fr.svg',
|
|
3000
|
+
DE: 'images/flags/de.svg',
|
|
3001
|
+
};
|
|
3002
|
+
const LANGUAGE_LABELS = {
|
|
3003
|
+
NL: 'Nederlands',
|
|
3004
|
+
EN: 'English',
|
|
3005
|
+
FR: 'Français',
|
|
3006
|
+
DE: 'Deutsch',
|
|
3007
|
+
};
|
|
3008
|
+
|
|
3009
|
+
class LanguageSwitcherComponent {
|
|
3010
|
+
languages = input(['NL', 'EN'], ...(ngDevMode ? [{ debugName: "languages" }] : []));
|
|
3011
|
+
selected = model('NL', ...(ngDevMode ? [{ debugName: "selected" }] : []));
|
|
3012
|
+
displayMode = input('flag-only', ...(ngDevMode ? [{ debugName: "displayMode" }] : []));
|
|
3013
|
+
flagSrc(lang) {
|
|
3014
|
+
return LANGUAGE_FLAGS[lang] ?? '';
|
|
3015
|
+
}
|
|
3016
|
+
labelFor(lang) {
|
|
3017
|
+
const language = lang;
|
|
3018
|
+
switch (this.displayMode()) {
|
|
3019
|
+
case 'abbreviation':
|
|
3020
|
+
return language;
|
|
3021
|
+
case 'full':
|
|
3022
|
+
return LANGUAGE_LABELS[language];
|
|
3023
|
+
default:
|
|
3024
|
+
return '';
|
|
3025
|
+
}
|
|
3026
|
+
}
|
|
3027
|
+
selectLanguage(lang) {
|
|
3028
|
+
this.selected.set(lang);
|
|
3029
|
+
}
|
|
3030
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LanguageSwitcherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3031
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: LanguageSwitcherComponent, isStandalone: true, selector: "ndw-language-switcher", inputs: { languages: { classPropertyName: "languages", publicName: "languages", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, displayMode: { classPropertyName: "displayMode", publicName: "displayMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<button type=\"button\" class=\"flag-trigger\" [ndwPopoverTrigger]=\"languageList\">\n <img class=\"flag\" [src]=\"flagSrc(selected())\" [alt]=\"selected()\" />\n @if (labelFor(selected()); as label) {\n <span class=\"label\">{{ label }}</span>\n }\n</button>\n\n<ng-template #languageList>\n @for (lang of languages(); track lang) {\n <button\n type=\"button\"\n class=\"language-option\"\n [class.active]=\"selected() === lang\"\n ndwPopoverCloseTrigger\n (click)=\"selectLanguage(lang)\"\n >\n <img class=\"flag\" [src]=\"flagSrc(lang)\" [alt]=\"lang\" />\n @if (labelFor(lang); as label) {\n <span class=\"label\">{{ label }}</span>\n }\n </button>\n }\n</ng-template>\n", styles: [".flag-trigger,.language-option{display:flex;align-items:center;gap:var(--ndw-spacing-2xs);padding:var(--ndw-spacing-2xs);border:none;background:transparent;border-radius:var(--ndw-border-radius-sm);font-size:var(--ndw-font-size-sm)}.flag-trigger:hover,.language-option:hover{background-color:var(--ndw-color-grey-100)}.language-option{gap:var(--ndw-spacing-xs);padding:var(--ndw-spacing-xs) var(--ndw-spacing-sm)}.language-option.active{color:var(--ndw-color-primary-500);font-weight:var(--ndw-font-weight-bold)}.flag{width:20px;height:20px}\n"], dependencies: [{ kind: "directive", type: PopoverTriggerDirective, selector: "[ndwPopoverTrigger]", inputs: ["popoverPosition", "ndwPopoverTrigger", "toggleOnClick", "isOpen"], outputs: ["popoverToggled", "isOpenChange"], exportAs: ["ndwPopoverTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3032
|
+
}
|
|
3033
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LanguageSwitcherComponent, decorators: [{
|
|
3034
|
+
type: Component,
|
|
3035
|
+
args: [{ selector: 'ndw-language-switcher', imports: [PopoverTriggerDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button type=\"button\" class=\"flag-trigger\" [ndwPopoverTrigger]=\"languageList\">\n <img class=\"flag\" [src]=\"flagSrc(selected())\" [alt]=\"selected()\" />\n @if (labelFor(selected()); as label) {\n <span class=\"label\">{{ label }}</span>\n }\n</button>\n\n<ng-template #languageList>\n @for (lang of languages(); track lang) {\n <button\n type=\"button\"\n class=\"language-option\"\n [class.active]=\"selected() === lang\"\n ndwPopoverCloseTrigger\n (click)=\"selectLanguage(lang)\"\n >\n <img class=\"flag\" [src]=\"flagSrc(lang)\" [alt]=\"lang\" />\n @if (labelFor(lang); as label) {\n <span class=\"label\">{{ label }}</span>\n }\n </button>\n }\n</ng-template>\n", styles: [".flag-trigger,.language-option{display:flex;align-items:center;gap:var(--ndw-spacing-2xs);padding:var(--ndw-spacing-2xs);border:none;background:transparent;border-radius:var(--ndw-border-radius-sm);font-size:var(--ndw-font-size-sm)}.flag-trigger:hover,.language-option:hover{background-color:var(--ndw-color-grey-100)}.language-option{gap:var(--ndw-spacing-xs);padding:var(--ndw-spacing-xs) var(--ndw-spacing-sm)}.language-option.active{color:var(--ndw-color-primary-500);font-weight:var(--ndw-font-weight-bold)}.flag{width:20px;height:20px}\n"] }]
|
|
3036
|
+
}], propDecorators: { languages: [{ type: i0.Input, args: [{ isSignal: true, alias: "languages", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], displayMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayMode", required: false }] }] } });
|
|
3037
|
+
|
|
2996
3038
|
class MainNavigationHeaderComponent {
|
|
2997
3039
|
applicationName = input.required(...(ngDevMode ? [{ debugName: "applicationName" }] : []));
|
|
2998
3040
|
isExpanded = input.required(...(ngDevMode ? [{ debugName: "isExpanded" }] : []));
|
|
@@ -3182,25 +3224,29 @@ const svgMapButtonIcons = [
|
|
|
3182
3224
|
const mapButtonIcons = [...fontMapButtonIcons, ...svgMapButtonIcons];
|
|
3183
3225
|
|
|
3184
3226
|
class MapButtonComponent {
|
|
3185
|
-
icon = input
|
|
3227
|
+
icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
|
|
3186
3228
|
active = input(false, ...(ngDevMode ? [{ debugName: "active" }] : []));
|
|
3187
3229
|
ariaLabel = input(...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : []));
|
|
3188
3230
|
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
3189
3231
|
clicked = output();
|
|
3190
|
-
buttonIcon = computed(() =>
|
|
3232
|
+
buttonIcon = computed(() => {
|
|
3233
|
+
const icon = this.icon();
|
|
3234
|
+
return icon ? this.#icons[icon] : undefined;
|
|
3235
|
+
}, ...(ngDevMode ? [{ debugName: "buttonIcon" }] : []));
|
|
3191
3236
|
svgIcon = computed(() => {
|
|
3192
3237
|
const svgIconNames = [...svgMapButtonIcons];
|
|
3193
3238
|
const icon = this.icon();
|
|
3194
3239
|
const active = this.active();
|
|
3195
|
-
if (svgIconNames.includes(icon)) {
|
|
3240
|
+
if (icon && svgIconNames.includes(icon)) {
|
|
3196
3241
|
return active ? `${icon}-active` : icon;
|
|
3197
3242
|
}
|
|
3198
3243
|
return undefined;
|
|
3199
3244
|
}, ...(ngDevMode ? [{ debugName: "svgIcon" }] : []));
|
|
3200
3245
|
iconLabel = computed(() => {
|
|
3201
3246
|
const ariaLabel = this.ariaLabel();
|
|
3202
|
-
const
|
|
3203
|
-
|
|
3247
|
+
const icon = this.icon();
|
|
3248
|
+
const iconLabel = icon ? this.#iconLabels[icon] : undefined;
|
|
3249
|
+
return ariaLabel || iconLabel || '';
|
|
3204
3250
|
}, ...(ngDevMode ? [{ debugName: "iconLabel" }] : []));
|
|
3205
3251
|
// Mapping from button icon names to Material icons or SVG icon IDs.
|
|
3206
3252
|
#icons = {
|
|
@@ -3238,12 +3284,12 @@ class MapButtonComponent {
|
|
|
3238
3284
|
mail: 'Maak een melding',
|
|
3239
3285
|
};
|
|
3240
3286
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: MapButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3241
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: MapButtonComponent, isStandalone: true, selector: "ndw-map-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired:
|
|
3287
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: MapButtonComponent, isStandalone: true, selector: "ndw-map-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n class=\"map-control\"\n [class.active]=\"active()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"iconLabel()\"\n (click)=\"clicked.emit()\"\n [ndwTooltip]=\"iconLabel()\"\n>\n @if (svgIcon()) {\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <use [attr.href]=\"'images/map-button-icons.svg#' + svgIcon()\"></use>\n </svg>\n } @else if (buttonIcon()) {\n <ndw-icon>{{ buttonIcon() }}</ndw-icon>\n }\n <div class=\"content-wrapper\">\n <ng-content />\n </div>\n</button>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..650;1,9..40,400..650&family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,400,0..1&family=Nunito+Sans:ital,opsz,wght@0,6..12,400..650;1,6..12,400..650&display=block\";.ndw-heading-xl{font-family:var(--ndw-font-family-heading);font-size:2.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-lg{font-family:var(--ndw-font-family-heading);font-size:2rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-md{font-family:var(--ndw-font-family-heading);font-size:1.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-sm{font-family:var(--ndw-font-family-heading);font-size:1.25rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-bold-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}:host{width:fit-content}.map-control{justify-content:center}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "ndw-icon" }, { kind: "directive", type: TooltipDirective, selector: "[ndwTooltip]", inputs: ["ndwTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3242
3288
|
}
|
|
3243
3289
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: MapButtonComponent, decorators: [{
|
|
3244
3290
|
type: Component,
|
|
3245
|
-
args: [{ selector: 'ndw-map-button', imports: [IconComponent, TooltipDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"map-control\"\n [class.active]=\"active()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"iconLabel()\"\n (click)=\"clicked.emit()\"\n [ndwTooltip]=\"iconLabel()\"\n>\n @if (svgIcon()) {\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <use [attr.href]=\"'images/map-button-icons.svg#' + svgIcon()\"></use>\n </svg>\n } @else {\n <ndw-icon>{{ buttonIcon() }}</ndw-icon>\n }\n <div class=\"content-wrapper\">\n <ng-content />\n </div>\n</button>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..650;1,9..40,400..650&family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,400,0..1&family=Nunito+Sans:ital,opsz,wght@0,6..12,400..650;1,6..12,400..650&display=block\";.ndw-heading-xl{font-family:var(--ndw-font-family-heading);font-size:2.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-lg{font-family:var(--ndw-font-family-heading);font-size:2rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-md{font-family:var(--ndw-font-family-heading);font-size:1.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-sm{font-family:var(--ndw-font-family-heading);font-size:1.25rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-bold-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}:host{width:fit-content}.map-control{justify-content:center}\n"] }]
|
|
3246
|
-
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required:
|
|
3291
|
+
args: [{ selector: 'ndw-map-button', imports: [IconComponent, TooltipDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"map-control\"\n [class.active]=\"active()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"iconLabel()\"\n (click)=\"clicked.emit()\"\n [ndwTooltip]=\"iconLabel()\"\n>\n @if (svgIcon()) {\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <use [attr.href]=\"'images/map-button-icons.svg#' + svgIcon()\"></use>\n </svg>\n } @else if (buttonIcon()) {\n <ndw-icon>{{ buttonIcon() }}</ndw-icon>\n }\n <div class=\"content-wrapper\">\n <ng-content />\n </div>\n</button>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..650;1,9..40,400..650&family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,400,0..1&family=Nunito+Sans:ital,opsz,wght@0,6..12,400..650;1,6..12,400..650&display=block\";.ndw-heading-xl{font-family:var(--ndw-font-family-heading);font-size:2.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-lg{font-family:var(--ndw-font-family-heading);font-size:2rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-md{font-family:var(--ndw-font-family-heading);font-size:1.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-sm{font-family:var(--ndw-font-family-heading);font-size:1.25rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-bold-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}:host{width:fit-content}.map-control{justify-content:center}\n"] }]
|
|
3292
|
+
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
|
|
3247
3293
|
|
|
3248
3294
|
class MapDisplayOptionComponent {
|
|
3249
3295
|
option = input.required(...(ngDevMode ? [{ debugName: "option" }] : []));
|
|
@@ -3252,11 +3298,11 @@ class MapDisplayOptionComponent {
|
|
|
3252
3298
|
group = input(...(ngDevMode ? [undefined, { debugName: "group" }] : []));
|
|
3253
3299
|
selectionChange = output();
|
|
3254
3300
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: MapDisplayOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3255
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: MapDisplayOptionComponent, isStandalone: true, selector: "ndw-map-display-option", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: "@if (type() === 'button') {\n <button\n type=\"button\"\n [title]=\"option().description ?? ''\"\n [class.column]=\"direction() === 'column'\"\n (click)=\"selectionChange.emit(option())\"\n >\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </button>\n} @else if (type() === 'radio' || type() === 'checkbox') {\n <label [class.column]=\"direction() === 'column'\" [title]=\"option().description ?? ''\">\n <input\n [type]=\"type()\"\n name=\"{{ group() }}\"\n [checked]=\"option().active\"\n (change)=\"selectionChange.emit(option())\"\n />\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </label>\n} @else {\n <ng-container *ngTemplateOutlet=\"template\" />\n}\n\n<ng-template #template>\n @if (option().imageLink) {\n <img [src]=\"option().imageLink\" [alt]=\"option().name\" />\n } @else {\n <ndw-icon>stacks</ndw-icon>\n }\n</ng-template>\n", styles: ["button,label{padding:0;border:0;display:flex;align-items:center;width:100%;height:40px;gap:var(--ndw-spacing-2xs);color:var(--ndw-color-grey-700);background-color:var(--ndw-color-white);transition:background-color var(--ndw-animation-speed-default) ease-out;border-radius:var(--ndw-border-radius-sm);cursor:pointer}button.column,label.column{flex-direction:column;justify-content:end;width:64px;height:64px}button:not(.column),label:not(.column){padding:var(--ndw-spacing-2xs);gap:var(--ndw-spacing-xs)}button:not(.column):has(input:checked),label:not(.column):has(input:checked){font-weight:var(--ndw-font-weight-bold)}button:hover,label:hover{background-color:var(--ndw-color-grey-100)}button:has(input:checked) img,button:has(input:checked) ndw-icon,label:has(input:checked) img,label:has(input:checked) ndw-icon{box-shadow:0 0 0 2px var(--ndw-color-secondary-400)}button input,label input{visibility:hidden;position:absolute;width:0;height:0;opacity:0;pointer-events:none;z-index:-1;left:-9999px;top:-9999px}img,ndw-icon{display:block;overflow:hidden;padding:var(--ndw-spacing-2xs);width:32px;height:32px;object-fit:cover;border:1px solid var(--ndw-color-grey-200);border-radius:var(--ndw-border-radius-xs)}.name{font-size:var(--ndw-font-size-sm);white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "ndw-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3301
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: MapDisplayOptionComponent, isStandalone: true, selector: "ndw-map-display-option", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: "@if (type() === 'button') {\n <button\n type=\"button\"\n [title]=\"option().description ?? ''\"\n [class.column]=\"direction() === 'column'\"\n (click)=\"selectionChange.emit(option())\"\n >\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </button>\n} @else if (type() === 'radio' || type() === 'checkbox') {\n <label [class.column]=\"direction() === 'column'\" [title]=\"option().description ?? ''\">\n <input\n [type]=\"type()\"\n name=\"{{ group() }}\"\n [checked]=\"option().active\"\n (change)=\"selectionChange.emit(option())\"\n />\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </label>\n} @else {\n <ng-container *ngTemplateOutlet=\"template\" />\n}\n\n<ng-template #template>\n @if (option().imageLink) {\n <img [src]=\"option().imageLink\" [alt]=\"option().name\" />\n } @else if (option().icon) {\n <ndw-icon [title]=\"option().name\">{{ option().icon }}</ndw-icon>\n } @else {\n <ndw-icon>stacks</ndw-icon>\n }\n</ng-template>\n", styles: ["button,label{padding:0;border:0;display:flex;align-items:center;width:100%;height:40px;gap:var(--ndw-spacing-2xs);color:var(--ndw-color-grey-700);background-color:var(--ndw-color-white);transition:background-color var(--ndw-animation-speed-default) ease-out;border-radius:var(--ndw-border-radius-sm);cursor:pointer}button.column,label.column{flex-direction:column;justify-content:end;width:64px;height:64px}button:not(.column),label:not(.column){padding:var(--ndw-spacing-2xs);gap:var(--ndw-spacing-xs)}button:not(.column):has(input:checked),label:not(.column):has(input:checked){font-weight:var(--ndw-font-weight-bold)}button:hover,label:hover{background-color:var(--ndw-color-grey-100)}button:has(input:checked) img,button:has(input:checked) ndw-icon,label:has(input:checked) img,label:has(input:checked) ndw-icon{box-shadow:0 0 0 2px var(--ndw-color-secondary-400)}button input,label input{visibility:hidden;position:absolute;width:0;height:0;opacity:0;pointer-events:none;z-index:-1;left:-9999px;top:-9999px}img,ndw-icon{display:block;overflow:hidden;padding:var(--ndw-spacing-2xs);width:32px;height:32px;object-fit:cover;border:1px solid var(--ndw-color-grey-200);border-radius:var(--ndw-border-radius-xs)}.name{font-size:var(--ndw-font-size-sm);white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "ndw-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3256
3302
|
}
|
|
3257
3303
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: MapDisplayOptionComponent, decorators: [{
|
|
3258
3304
|
type: Component,
|
|
3259
|
-
args: [{ selector: 'ndw-map-display-option', imports: [NgTemplateOutlet, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (type() === 'button') {\n <button\n type=\"button\"\n [title]=\"option().description ?? ''\"\n [class.column]=\"direction() === 'column'\"\n (click)=\"selectionChange.emit(option())\"\n >\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </button>\n} @else if (type() === 'radio' || type() === 'checkbox') {\n <label [class.column]=\"direction() === 'column'\" [title]=\"option().description ?? ''\">\n <input\n [type]=\"type()\"\n name=\"{{ group() }}\"\n [checked]=\"option().active\"\n (change)=\"selectionChange.emit(option())\"\n />\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </label>\n} @else {\n <ng-container *ngTemplateOutlet=\"template\" />\n}\n\n<ng-template #template>\n @if (option().imageLink) {\n <img [src]=\"option().imageLink\" [alt]=\"option().name\" />\n } @else {\n <ndw-icon>stacks</ndw-icon>\n }\n</ng-template>\n", styles: ["button,label{padding:0;border:0;display:flex;align-items:center;width:100%;height:40px;gap:var(--ndw-spacing-2xs);color:var(--ndw-color-grey-700);background-color:var(--ndw-color-white);transition:background-color var(--ndw-animation-speed-default) ease-out;border-radius:var(--ndw-border-radius-sm);cursor:pointer}button.column,label.column{flex-direction:column;justify-content:end;width:64px;height:64px}button:not(.column),label:not(.column){padding:var(--ndw-spacing-2xs);gap:var(--ndw-spacing-xs)}button:not(.column):has(input:checked),label:not(.column):has(input:checked){font-weight:var(--ndw-font-weight-bold)}button:hover,label:hover{background-color:var(--ndw-color-grey-100)}button:has(input:checked) img,button:has(input:checked) ndw-icon,label:has(input:checked) img,label:has(input:checked) ndw-icon{box-shadow:0 0 0 2px var(--ndw-color-secondary-400)}button input,label input{visibility:hidden;position:absolute;width:0;height:0;opacity:0;pointer-events:none;z-index:-1;left:-9999px;top:-9999px}img,ndw-icon{display:block;overflow:hidden;padding:var(--ndw-spacing-2xs);width:32px;height:32px;object-fit:cover;border:1px solid var(--ndw-color-grey-200);border-radius:var(--ndw-border-radius-xs)}.name{font-size:var(--ndw-font-size-sm);white-space:nowrap}\n"] }]
|
|
3305
|
+
args: [{ selector: 'ndw-map-display-option', imports: [NgTemplateOutlet, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (type() === 'button') {\n <button\n type=\"button\"\n [title]=\"option().description ?? ''\"\n [class.column]=\"direction() === 'column'\"\n (click)=\"selectionChange.emit(option())\"\n >\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </button>\n} @else if (type() === 'radio' || type() === 'checkbox') {\n <label [class.column]=\"direction() === 'column'\" [title]=\"option().description ?? ''\">\n <input\n [type]=\"type()\"\n name=\"{{ group() }}\"\n [checked]=\"option().active\"\n (change)=\"selectionChange.emit(option())\"\n />\n <ng-container *ngTemplateOutlet=\"template\" />\n <span class=\"name\">{{ option().name }}</span>\n </label>\n} @else {\n <ng-container *ngTemplateOutlet=\"template\" />\n}\n\n<ng-template #template>\n @if (option().imageLink) {\n <img [src]=\"option().imageLink\" [alt]=\"option().name\" />\n } @else if (option().icon) {\n <ndw-icon [title]=\"option().name\">{{ option().icon }}</ndw-icon>\n } @else {\n <ndw-icon>stacks</ndw-icon>\n }\n</ng-template>\n", styles: ["button,label{padding:0;border:0;display:flex;align-items:center;width:100%;height:40px;gap:var(--ndw-spacing-2xs);color:var(--ndw-color-grey-700);background-color:var(--ndw-color-white);transition:background-color var(--ndw-animation-speed-default) ease-out;border-radius:var(--ndw-border-radius-sm);cursor:pointer}button.column,label.column{flex-direction:column;justify-content:end;width:64px;height:64px}button:not(.column),label:not(.column){padding:var(--ndw-spacing-2xs);gap:var(--ndw-spacing-xs)}button:not(.column):has(input:checked),label:not(.column):has(input:checked){font-weight:var(--ndw-font-weight-bold)}button:hover,label:hover{background-color:var(--ndw-color-grey-100)}button:has(input:checked) img,button:has(input:checked) ndw-icon,label:has(input:checked) img,label:has(input:checked) ndw-icon{box-shadow:0 0 0 2px var(--ndw-color-secondary-400)}button input,label input{visibility:hidden;position:absolute;width:0;height:0;opacity:0;pointer-events:none;z-index:-1;left:-9999px;top:-9999px}img,ndw-icon{display:block;overflow:hidden;padding:var(--ndw-spacing-2xs);width:32px;height:32px;object-fit:cover;border:1px solid var(--ndw-color-grey-200);border-radius:var(--ndw-border-radius-xs)}.name{font-size:var(--ndw-font-size-sm);white-space:nowrap}\n"] }]
|
|
3260
3306
|
}], propDecorators: { option: [{ type: i0.Input, args: [{ isSignal: true, alias: "option", required: true }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
|
|
3261
3307
|
|
|
3262
3308
|
class MapDisplayComponent {
|
|
@@ -4357,6 +4403,7 @@ class ToastComponent {
|
|
|
4357
4403
|
duration = input(5000, ...(ngDevMode ? [{ debugName: "duration" }] : []));
|
|
4358
4404
|
paused = input(false, ...(ngDevMode ? [{ debugName: "paused" }] : []));
|
|
4359
4405
|
showProgress = input(true, ...(ngDevMode ? [{ debugName: "showProgress" }] : []));
|
|
4406
|
+
type = input('info', ...(ngDevMode ? [{ debugName: "type" }] : []));
|
|
4360
4407
|
closed = output();
|
|
4361
4408
|
elementDimensions = output();
|
|
4362
4409
|
#elementRef = inject(ElementRef);
|
|
@@ -4367,12 +4414,15 @@ class ToastComponent {
|
|
|
4367
4414
|
});
|
|
4368
4415
|
}
|
|
4369
4416
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4370
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
4417
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: ToastComponent, isStandalone: true, selector: "ndw-toast", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, closeButtonLabel: { classPropertyName: "closeButtonLabel", publicName: "closeButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, paused: { classPropertyName: "paused", publicName: "paused", isSignal: true, isRequired: false, transformFunction: null }, showProgress: { classPropertyName: "showProgress", publicName: "showProgress", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", elementDimensions: "elementDimensions" }, host: { properties: { "class.info": "type() === \"info\"", "class.error": "type() === \"error\"" } }, ngImport: i0, template: "<ndw-icon class=\"toast-icon\">{{ type() }}</ndw-icon>\n{{ message() }}\n<button\n ndwButton\n tertiary\n alternative\n extra-small\n (click)=\"closed.emit()\"\n [attr.aria-label]=\"closeButtonLabel()\"\n>\n <ndw-icon>close</ndw-icon>\n</button>\n@if (type() === 'info') {\n <div\n class=\"progress-bar\"\n [ngStyle]=\"{\n 'animation-duration': duration() + 'ms',\n visibility: showProgress() ? 'visible' : 'hidden',\n }\"\n [class.paused]=\"paused()\"\n ></div>\n}\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..650;1,9..40,400..650&family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,400,0..1&family=Nunito+Sans:ital,opsz,wght@0,6..12,400..650;1,6..12,400..650&display=block\";.ndw-heading-xl{font-family:var(--ndw-font-family-heading);font-size:2.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-lg{font-family:var(--ndw-font-family-heading);font-size:2rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-md{font-family:var(--ndw-font-family-heading);font-size:1.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-sm{font-family:var(--ndw-font-family-heading);font-size:1.25rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-bold-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}:host{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%;position:relative;align-items:center;border-radius:var(--ndw-spacing-2xs);color:var(--ndw-color-white);display:grid;font-size:var(--ndw-font-size-sm);gap:var(--ndw-spacing-xs);grid-template-columns:auto 1fr auto;line-height:var(--ndw-line-height-md);max-width:20rem;width:20rem;opacity:1;overflow:hidden;padding:var(--ndw-spacing-xs);transition:opacity var(--ndw-animation-speed-fast) ease-in;z-index:2;box-shadow:var(--ndw-elevation-toast)}:host.hide-content{color:transparent}:host.hide-content>*{visibility:hidden}:host .progress-bar{animation:5s linear 0s 1 normal rightToLeft;background-color:var(--ndw-color-secondary-400);bottom:0;height:var(--ndw-spacing-2xs);left:-100%;position:absolute;width:100%;z-index:-1}:host .progress-bar.paused{animation-play-state:paused}:host>ndw-icon{font-size:1rem}:host.info{background-color:var(--ndw-color-grey-700);color:var(--ndw-color-white)}:host.info .toast-icon{color:var(--ndw-color-white)}:host.info [ndwButton] ndw-icon{color:var(--ndw-color-white)}:host.error{background-color:var(--ndw-color-critical-300);color:var(--ndw-color-grey-700)}:host.error .toast-icon{color:var(--ndw-color-critical-500)}:host.error [ndwButton] ndw-icon{color:var(--ndw-color-grey-700)}@keyframes rightToLeft{0%{transform:translate(100%)}to{transform:translate(0)}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "ndw-icon" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4371
4418
|
}
|
|
4372
4419
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: ToastComponent, decorators: [{
|
|
4373
4420
|
type: Component,
|
|
4374
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush,
|
|
4375
|
-
|
|
4421
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
4422
|
+
'[class.info]': 'type() === "info"',
|
|
4423
|
+
'[class.error]': 'type() === "error"',
|
|
4424
|
+
}, imports: [IconComponent, NgStyle], selector: 'ndw-toast', template: "<ndw-icon class=\"toast-icon\">{{ type() }}</ndw-icon>\n{{ message() }}\n<button\n ndwButton\n tertiary\n alternative\n extra-small\n (click)=\"closed.emit()\"\n [attr.aria-label]=\"closeButtonLabel()\"\n>\n <ndw-icon>close</ndw-icon>\n</button>\n@if (type() === 'info') {\n <div\n class=\"progress-bar\"\n [ngStyle]=\"{\n 'animation-duration': duration() + 'ms',\n visibility: showProgress() ? 'visible' : 'hidden',\n }\"\n [class.paused]=\"paused()\"\n ></div>\n}\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..650;1,9..40,400..650&family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,400,0..1&family=Nunito+Sans:ital,opsz,wght@0,6..12,400..650;1,6..12,400..650&display=block\";.ndw-heading-xl{font-family:var(--ndw-font-family-heading);font-size:2.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-lg{font-family:var(--ndw-font-family-heading);font-size:2rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-md{font-family:var(--ndw-font-family-heading);font-size:1.5rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-heading-sm{font-family:var(--ndw-font-family-heading);font-size:1.25rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-bold-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-xl{font-family:var(--ndw-font-family-body);font-size:1.125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-lg{font-family:var(--ndw-font-family-body);font-size:1rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-md{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}.ndw-paragraph-bold-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-bold);line-height:150%}.ndw-paragraph-sm{font-family:var(--ndw-font-family-body);font-size:.6875rem;font-weight:var(--ndw-font-weight-regular);line-height:150%}:host{font-family:var(--ndw-font-family-body);font-size:.8125rem;font-weight:var(--ndw-font-weight-regular);line-height:150%;position:relative;align-items:center;border-radius:var(--ndw-spacing-2xs);color:var(--ndw-color-white);display:grid;font-size:var(--ndw-font-size-sm);gap:var(--ndw-spacing-xs);grid-template-columns:auto 1fr auto;line-height:var(--ndw-line-height-md);max-width:20rem;width:20rem;opacity:1;overflow:hidden;padding:var(--ndw-spacing-xs);transition:opacity var(--ndw-animation-speed-fast) ease-in;z-index:2;box-shadow:var(--ndw-elevation-toast)}:host.hide-content{color:transparent}:host.hide-content>*{visibility:hidden}:host .progress-bar{animation:5s linear 0s 1 normal rightToLeft;background-color:var(--ndw-color-secondary-400);bottom:0;height:var(--ndw-spacing-2xs);left:-100%;position:absolute;width:100%;z-index:-1}:host .progress-bar.paused{animation-play-state:paused}:host>ndw-icon{font-size:1rem}:host.info{background-color:var(--ndw-color-grey-700);color:var(--ndw-color-white)}:host.info .toast-icon{color:var(--ndw-color-white)}:host.info [ndwButton] ndw-icon{color:var(--ndw-color-white)}:host.error{background-color:var(--ndw-color-critical-300);color:var(--ndw-color-grey-700)}:host.error .toast-icon{color:var(--ndw-color-critical-500)}:host.error [ndwButton] ndw-icon{color:var(--ndw-color-grey-700)}@keyframes rightToLeft{0%{transform:translate(100%)}to{transform:translate(0)}}\n"] }]
|
|
4425
|
+
}], propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }], closeButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeButtonLabel", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], duration: [{ type: i0.Input, args: [{ isSignal: true, alias: "duration", required: false }] }], paused: [{ type: i0.Input, args: [{ isSignal: true, alias: "paused", required: false }] }], showProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProgress", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], elementDimensions: [{ type: i0.Output, args: ["elementDimensions"] }] } });
|
|
4376
4426
|
|
|
4377
4427
|
class ToastListComponent {
|
|
4378
4428
|
toastService = inject(ToastService);
|
|
@@ -4426,7 +4476,7 @@ class ToastListComponent {
|
|
|
4426
4476
|
this.toastService.resume();
|
|
4427
4477
|
}
|
|
4428
4478
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: ToastListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4429
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: ToastListComponent, isStandalone: true, selector: "ndw-toast-list", host: { listeners: { "mouseenter": "pause()", "mouseleave": "resume()" }, properties: { "style.--total-toast-height": "totalHeightExcludingGaps() + \"px\"", "style.--total-toast-count": "toastComponents().length", "style.--max-toast-width": "maxToastWidth() + \"px\"" } }, viewQueries: [{ propertyName: "toastComponents", predicate: ToastComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@for (toast of toastService.toasts(); track toast.id) {\n <ndw-toast\n class=\"toast\"\n [class.hide-content]=\"!toastService.paused() && $index > 0\"\n [ngStyle]=\"{\n '--index': $index,\n '--offset-height': toastOffsetHeights()[$index] + 'px',\n '--first-toast-height': firstToastHeight() + 'px',\n }\"\n [id]=\"toast.id\"\n [closeButtonLabel]=\"toast.closeButtonLabel ?? 'Sluit'\"\n [message]=\"toast.message\"\n [duration]=\"toast.duration\"\n [paused]=\"toastService.paused()\"\n [showProgress]=\"toastService.paused() || $first\"\n (closed)=\"toastService.close(toast.id)\"\n (elementDimensions)=\"setToastDimensions(toast.id, $event)\"\n ></ndw-toast>\n}\n", styles: [":host{--stack-gap: var(--ndw-spacing-sm);--animation-speed: var(--ndw-animation-speed-default);position:relative;width:var(--max-toast-width)}:host .toast{--x: 0;--y: calc((var(--stack-gap) * var(--index)));--scaleX: calc(1 - .05 * var(--index));top:0;left:0;position:absolute;transform:translate(var(--x),var(--y));transform-origin:top center;transition-property:transform,opacity;transition-duration:var(--animation-speed);transition-timing-function:ease;z-index:calc(1000 - var(--index))}:host .toast:not(:first-child){transform:translate(var(--x),var(--y)) scaleX(var(--scaleX))}:host:not(:hover):not(:focus-within) .toast:not(:first-child){height:var(--first-toast-height)}:host:hover,:host:focus-within{height:calc(var(--total-toast-height) + var(--stack-gap) * (var(--total-toast-count) - 1))}:host:hover .toast,:host:focus-within .toast{--scaleX: 1;--y: calc(var(--offset-height) + var(--stack-gap) * var(--index));transition-duration:var(--animation-speed)}\n"], dependencies: [{ kind: "component", type: ToastComponent, selector: "ndw-toast", inputs: ["message", "closeButtonLabel", "id", "duration", "paused", "showProgress"], outputs: ["closed", "elementDimensions"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4479
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: ToastListComponent, isStandalone: true, selector: "ndw-toast-list", host: { listeners: { "mouseenter": "pause()", "mouseleave": "resume()" }, properties: { "style.--total-toast-height": "totalHeightExcludingGaps() + \"px\"", "style.--total-toast-count": "toastComponents().length", "style.--max-toast-width": "maxToastWidth() + \"px\"" } }, viewQueries: [{ propertyName: "toastComponents", predicate: ToastComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@for (toast of toastService.toasts(); track toast.id) {\n <ndw-toast\n class=\"toast\"\n [class.hide-content]=\"!toastService.paused() && $index > 0\"\n [ngStyle]=\"{\n '--index': $index,\n '--offset-height': toastOffsetHeights()[$index] + 'px',\n '--first-toast-height': firstToastHeight() + 'px',\n }\"\n [id]=\"toast.id\"\n [closeButtonLabel]=\"toast.closeButtonLabel ?? 'Sluit'\"\n [message]=\"toast.message\"\n [duration]=\"toast.duration\"\n [paused]=\"toastService.paused()\"\n [showProgress]=\"toastService.paused() || $first\"\n [type]=\"toast.type\"\n (closed)=\"toastService.close(toast.id)\"\n (elementDimensions)=\"setToastDimensions(toast.id, $event)\"\n ></ndw-toast>\n}\n", styles: [":host{--stack-gap: var(--ndw-spacing-sm);--animation-speed: var(--ndw-animation-speed-default);position:relative;width:var(--max-toast-width)}:host .toast{--x: 0;--y: calc((var(--stack-gap) * var(--index)));--scaleX: calc(1 - .05 * var(--index));top:0;left:0;position:absolute;transform:translate(var(--x),var(--y));transform-origin:top center;transition-property:transform,opacity;transition-duration:var(--animation-speed);transition-timing-function:ease;z-index:calc(1000 - var(--index))}:host .toast:not(:first-child){transform:translate(var(--x),var(--y)) scaleX(var(--scaleX))}:host:not(:hover):not(:focus-within) .toast:not(:first-child){height:var(--first-toast-height)}:host:hover,:host:focus-within{height:calc(var(--total-toast-height) + var(--stack-gap) * (var(--total-toast-count) - 1))}:host:hover .toast,:host:focus-within .toast{--scaleX: 1;--y: calc(var(--offset-height) + var(--stack-gap) * var(--index));transition-duration:var(--animation-speed)}\n"], dependencies: [{ kind: "component", type: ToastComponent, selector: "ndw-toast", inputs: ["message", "closeButtonLabel", "id", "duration", "paused", "showProgress", "type"], outputs: ["closed", "elementDimensions"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4430
4480
|
}
|
|
4431
4481
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: ToastListComponent, decorators: [{
|
|
4432
4482
|
type: Component,
|
|
@@ -4436,7 +4486,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
4436
4486
|
'[style.--total-toast-height]': 'totalHeightExcludingGaps() + "px"',
|
|
4437
4487
|
'[style.--total-toast-count]': 'toastComponents().length',
|
|
4438
4488
|
'[style.--max-toast-width]': 'maxToastWidth() + "px"',
|
|
4439
|
-
}, imports: [ToastComponent, NgStyle], selector: 'ndw-toast-list', template: "@for (toast of toastService.toasts(); track toast.id) {\n <ndw-toast\n class=\"toast\"\n [class.hide-content]=\"!toastService.paused() && $index > 0\"\n [ngStyle]=\"{\n '--index': $index,\n '--offset-height': toastOffsetHeights()[$index] + 'px',\n '--first-toast-height': firstToastHeight() + 'px',\n }\"\n [id]=\"toast.id\"\n [closeButtonLabel]=\"toast.closeButtonLabel ?? 'Sluit'\"\n [message]=\"toast.message\"\n [duration]=\"toast.duration\"\n [paused]=\"toastService.paused()\"\n [showProgress]=\"toastService.paused() || $first\"\n (closed)=\"toastService.close(toast.id)\"\n (elementDimensions)=\"setToastDimensions(toast.id, $event)\"\n ></ndw-toast>\n}\n", styles: [":host{--stack-gap: var(--ndw-spacing-sm);--animation-speed: var(--ndw-animation-speed-default);position:relative;width:var(--max-toast-width)}:host .toast{--x: 0;--y: calc((var(--stack-gap) * var(--index)));--scaleX: calc(1 - .05 * var(--index));top:0;left:0;position:absolute;transform:translate(var(--x),var(--y));transform-origin:top center;transition-property:transform,opacity;transition-duration:var(--animation-speed);transition-timing-function:ease;z-index:calc(1000 - var(--index))}:host .toast:not(:first-child){transform:translate(var(--x),var(--y)) scaleX(var(--scaleX))}:host:not(:hover):not(:focus-within) .toast:not(:first-child){height:var(--first-toast-height)}:host:hover,:host:focus-within{height:calc(var(--total-toast-height) + var(--stack-gap) * (var(--total-toast-count) - 1))}:host:hover .toast,:host:focus-within .toast{--scaleX: 1;--y: calc(var(--offset-height) + var(--stack-gap) * var(--index));transition-duration:var(--animation-speed)}\n"] }]
|
|
4489
|
+
}, imports: [ToastComponent, NgStyle], selector: 'ndw-toast-list', template: "@for (toast of toastService.toasts(); track toast.id) {\n <ndw-toast\n class=\"toast\"\n [class.hide-content]=\"!toastService.paused() && $index > 0\"\n [ngStyle]=\"{\n '--index': $index,\n '--offset-height': toastOffsetHeights()[$index] + 'px',\n '--first-toast-height': firstToastHeight() + 'px',\n }\"\n [id]=\"toast.id\"\n [closeButtonLabel]=\"toast.closeButtonLabel ?? 'Sluit'\"\n [message]=\"toast.message\"\n [duration]=\"toast.duration\"\n [paused]=\"toastService.paused()\"\n [showProgress]=\"toastService.paused() || $first\"\n [type]=\"toast.type\"\n (closed)=\"toastService.close(toast.id)\"\n (elementDimensions)=\"setToastDimensions(toast.id, $event)\"\n ></ndw-toast>\n}\n", styles: [":host{--stack-gap: var(--ndw-spacing-sm);--animation-speed: var(--ndw-animation-speed-default);position:relative;width:var(--max-toast-width)}:host .toast{--x: 0;--y: calc((var(--stack-gap) * var(--index)));--scaleX: calc(1 - .05 * var(--index));top:0;left:0;position:absolute;transform:translate(var(--x),var(--y));transform-origin:top center;transition-property:transform,opacity;transition-duration:var(--animation-speed);transition-timing-function:ease;z-index:calc(1000 - var(--index))}:host .toast:not(:first-child){transform:translate(var(--x),var(--y)) scaleX(var(--scaleX))}:host:not(:hover):not(:focus-within) .toast:not(:first-child){height:var(--first-toast-height)}:host:hover,:host:focus-within{height:calc(var(--total-toast-height) + var(--stack-gap) * (var(--total-toast-count) - 1))}:host:hover .toast,:host:focus-within .toast{--scaleX: 1;--y: calc(var(--offset-height) + var(--stack-gap) * var(--index));transition-duration:var(--animation-speed)}\n"] }]
|
|
4440
4490
|
}], propDecorators: { toastComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => ToastComponent), { isSignal: true }] }] } });
|
|
4441
4491
|
|
|
4442
4492
|
class ToastService {
|
|
@@ -4480,9 +4530,11 @@ class ToastService {
|
|
|
4480
4530
|
* Open a toast notification with the given message and optional duration.
|
|
4481
4531
|
* @param message The message to display in the toast.
|
|
4482
4532
|
* @param duration Optional duration in milliseconds for which the toast should be visible. Defaults to 5000ms.
|
|
4533
|
+
* @param closeButtonLabel
|
|
4534
|
+
* @param type The type of toast. Based on type the behavior and visuals of the toast will change.
|
|
4483
4535
|
* @returns The ID of the created toast. Can be used to close the toast.
|
|
4484
4536
|
*/
|
|
4485
|
-
open(message, duration, closeButtonLabel) {
|
|
4537
|
+
open(message, duration, closeButtonLabel, type = 'info') {
|
|
4486
4538
|
const id = crypto.randomUUID();
|
|
4487
4539
|
this.#addToast({
|
|
4488
4540
|
id,
|
|
@@ -4490,6 +4542,7 @@ class ToastService {
|
|
|
4490
4542
|
duration: duration ?? 5000,
|
|
4491
4543
|
remainingTime: duration ?? 5000,
|
|
4492
4544
|
closeButtonLabel,
|
|
4545
|
+
type,
|
|
4493
4546
|
});
|
|
4494
4547
|
if (!this.#overlayRef) {
|
|
4495
4548
|
this.#overlayRef = this.#overlay.create({
|
|
@@ -4520,7 +4573,7 @@ class ToastService {
|
|
|
4520
4573
|
#updateToastExpiration(elapsedMs) {
|
|
4521
4574
|
this.#toasts.update((toasts) => toasts.map((toast) => ({ ...toast, remainingTime: toast.remainingTime - elapsedMs })));
|
|
4522
4575
|
this.#toasts().forEach((toast) => {
|
|
4523
|
-
if (toast.remainingTime <= 0) {
|
|
4576
|
+
if (toast.remainingTime <= 0 && toast.type !== 'error') {
|
|
4524
4577
|
this.close(toast.id);
|
|
4525
4578
|
}
|
|
4526
4579
|
});
|
|
@@ -4539,5 +4592,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
4539
4592
|
* Generated bundle index. Do not edit.
|
|
4540
4593
|
*/
|
|
4541
4594
|
|
|
4542
|
-
export { AccordionComponent, AccordionService, AlertComponent, AutoGrowDirective, AutosuggestAddOptionComponent, AutosuggestDirective, AutosuggestOptionComponent, AutosuggestPanelComponent, AvatarComponent, BROWSER_STORAGE, BadgeComponent, BannerComponent, BaseTourService, BreadcrumbComponent, BreadcrumbGroupComponent, ButtonDirective, CARD_COMPONENTS, CARD_ID_TOKEN, CalendarComponent, CardComponent, CardContentComponent, CardFooterComponent, CardHeaderComponent, CheckboxComponent, CheckboxGroupComponent, CollapsibleComponent, DEFAULT_BACKGROUNDS, DashboardCardComponent, DatepickerComponent, DropdownComponent, EditBarActionsComponent, EditBarComponent, EditBarMessageComponent, ErrorComponent, FavoriteComponent, FileUploadComponent, FormFieldComponent, FormFieldElement, GuidedTourService, HoverableListItemComponent, IconComponent, InfoComponent, InputButtonComponent, InputDirective, InputIconComponent, KeyValueListComponent, LayoutBannersComponent, LayoutComponent, ListComponent, ListItemComponent, LoaderComponent, MAP_BACKGROUNDS, MAP_BACKGROUND_IMAGES, MAP_LAYERS, MAP_LAYER_IMAGES, MODAL_COMPONENTS, MainNavigationComponent, MapButtonComponent, MapDisplayComponent, MapDisplayOptionComponent, MapLegendComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxCharDirective, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalService, MonthInputComponent, MultiSelectComponent, OptionComponent, OptionGroupComponent, PillComponent, PopoverTriggerDirective, RadioButtonComponent, RadioGroupComponent, RouterBreadcrumbsComponent, SplitterComponent, SummaryCardActionComponent, SummaryCardActionsComponent, SummaryCardComponent, SummaryCardContentComponent, SummaryCardHeaderComponent, SummaryCardSubtitleComponent, SummaryCardTagComponent, SummaryCardTagsComponent, SwitcherComponent, TabComponent, TabGroupComponent, TagComponent, ToastComponent, ToastService, TooltipComponent, TooltipDirective, backButton, cancelButton, defaultStepOptions, elementIsHidden, finishButton, fontMapButtonIcons, formatStepWithImage, makeButton, mapButtonIcons, ndwAgGridTheme, nextButton, svgMapButtonIcons };
|
|
4595
|
+
export { AccordionComponent, AccordionService, AlertComponent, AutoGrowDirective, AutosuggestAddOptionComponent, AutosuggestDirective, AutosuggestOptionComponent, AutosuggestPanelComponent, AvatarComponent, BROWSER_STORAGE, BadgeComponent, BannerComponent, BaseTourService, BreadcrumbComponent, BreadcrumbGroupComponent, ButtonDirective, CARD_COMPONENTS, CARD_ID_TOKEN, CalendarComponent, CardComponent, CardContentComponent, CardFooterComponent, CardHeaderComponent, CheckboxComponent, CheckboxGroupComponent, CollapsibleComponent, DEFAULT_BACKGROUNDS, DashboardCardComponent, DatepickerComponent, DropdownComponent, EditBarActionsComponent, EditBarComponent, EditBarMessageComponent, ErrorComponent, FavoriteComponent, FileUploadComponent, FormFieldComponent, FormFieldElement, GuidedTourService, HoverableListItemComponent, IconComponent, InfoComponent, InputButtonComponent, InputDirective, InputIconComponent, KeyValueListComponent, LANGUAGE_FLAGS, LANGUAGE_LABELS, LanguageSwitcherComponent, LayoutBannersComponent, LayoutComponent, ListComponent, ListItemComponent, LoaderComponent, MAP_BACKGROUNDS, MAP_BACKGROUND_IMAGES, MAP_LAYERS, MAP_LAYER_IMAGES, MODAL_COMPONENTS, MainNavigationComponent, MapButtonComponent, MapDisplayComponent, MapDisplayOptionComponent, MapLegendComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxCharDirective, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalService, MonthInputComponent, MultiSelectComponent, OptionComponent, OptionGroupComponent, PillComponent, PopoverTriggerDirective, RadioButtonComponent, RadioGroupComponent, RouterBreadcrumbsComponent, SplitterComponent, SummaryCardActionComponent, SummaryCardActionsComponent, SummaryCardComponent, SummaryCardContentComponent, SummaryCardHeaderComponent, SummaryCardSubtitleComponent, SummaryCardTagComponent, SummaryCardTagsComponent, SwitcherComponent, TabComponent, TabGroupComponent, TagComponent, ToastComponent, ToastService, TooltipComponent, TooltipDirective, backButton, cancelButton, defaultStepOptions, elementIsHidden, finishButton, fontMapButtonIcons, formatStepWithImage, makeButton, mapButtonIcons, ndwAgGridTheme, nextButton, svgMapButtonIcons };
|
|
4543
4596
|
//# sourceMappingURL=ndwnu-design-system.mjs.map
|