@ndwnu/design-system 6.0.0 → 7.0.0

package/index.d.ts

@@ -1,5 +1,2 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="@ndwnu/design-system" />
-export * from './public-api';
+export { IconSize } from '@ndwnu/core';
+export * from './lib/components';

package/{components → lib/components}/card/card.component.d.ts

@@ -5,7 +5,8 @@ export declare class CardComponent implements AfterContentInit {
     private readonly header;
     private readonly headerHeight;
     readonly cardId: string;
-    isCollapsed: import("@angular/core").ModelSignal<boolean>;
+    readonly isCollapsable: import("@angular/core").Signal<boolean>;
+    readonly isCollapsed: import("@angular/core").ModelSignal<boolean>;
     ngAfterContentInit(): void;
     animationState: import("@angular/core").Signal<{
         value: string;

package/{components → lib/components}/form-field/checkbox/checkbox.component.d.ts

@@ -3,7 +3,7 @@ import * as i0 from "@angular/core";
 export declare class CheckboxComponent implements ControlValueAccessor {
     checked: import("@angular/core").ModelSignal<boolean>;
     switch: import("@angular/core").InputSignal<boolean>;
-    disabled: import("@angular/core").InputSignal<boolean>;
+    disabled: import("@angular/core").ModelSignal<boolean>;
     error: import("@angular/core").InputSignal<boolean>;
     success: import("@angular/core").InputSignal<boolean>;
     indeterminate: import("@angular/core").InputSignal<boolean>;
@@ -14,6 +14,7 @@ export declare class CheckboxComponent implements ControlValueAccessor {
     writeValue(value: boolean): void;
     registerOnChange(fn: (value: boolean) => void): void;
     registerOnTouched(): void;
+    setDisabledState(isDisabled: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "ndw-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "switch": { "alias": "switch"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "ndw-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "switch": { "alias": "switch"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; }, never, ["*"], true, never>;
 }

package/{components → lib/components}/form-field/clear-search-button/clear-search-button.component.d.ts

@@ -1,5 +1,5 @@
 import { OnDestroy, OnInit } from '@angular/core';
-import { InputDirective } from '../input/input.directive';
+import { InputDirective } from '../input';
 import * as i0 from "@angular/core";
 export declare class ClearSearchButtonComponent implements OnInit, OnDestroy {
     readonly disabled: import("@angular/core").InputSignal<boolean>;

package/lib/components/form-field/clear-search-button/index.d.ts

@@ -0,0 +1 @@
+export * from './clear-search-button.component';

package/{components → lib/components}/form-field/file-upload/file-upload.component.d.ts

@@ -3,20 +3,20 @@ import { ControlValueAccessor } from '@angular/forms';
 import { FileUploadText } from './file-upload-text.interface';
 import * as i0 from "@angular/core";
 export declare class FileUploadComponent implements ControlValueAccessor {
-    readonly fileInputElement: import("@angular/core").Signal<ElementRef<HTMLInputElement>>;
     readonly allowedFileTypeRegex: import("@angular/core").InputSignal<RegExp | undefined>;
+    readonly disabled: import("@angular/core").ModelSignal<boolean>;
     readonly fileUploadText: import("@angular/core").InputSignal<FileUploadText>;
-    readonly uploadDate: import("@angular/core").InputSignal<string>;
     readonly maxFileSizeInBytes: import("@angular/core").InputSignal<number>;
-    readonly disabled: import("@angular/core").InputSignal<boolean>;
     readonly readonly: import("@angular/core").InputSignal<boolean>;
+    readonly uploadDate: import("@angular/core").InputSignal<string>;
     readonly draggingOver: import("@angular/core").ModelSignal<boolean>;
-    readonly selectedFile: import("@angular/core").ModelSignal<File | null | undefined>;
     readonly error: import("@angular/core").ModelSignal<boolean>;
-    readonly success: import("@angular/core").ModelSignal<boolean>;
-    readonly incorrectFileType: import("@angular/core").ModelSignal<boolean>;
     readonly incorrectFileSize: import("@angular/core").ModelSignal<boolean>;
+    readonly incorrectFileType: import("@angular/core").ModelSignal<boolean>;
+    readonly selectedFile: import("@angular/core").ModelSignal<File | null | undefined>;
+    readonly success: import("@angular/core").ModelSignal<boolean>;
     private readonly canEdit;
+    readonly fileInputElement: import("@angular/core").Signal<ElementRef<HTMLInputElement>>;
     onKeyDown(event: KeyboardEvent): void;
     onClick(): void;
     onDragLeave(event: DragEvent): void;
@@ -30,10 +30,11 @@ export declare class FileUploadComponent implements ControlValueAccessor {
     writeValue(value: File): void;
     registerOnChange(fn: (value: File | null | undefined) => void): void;
     registerOnTouched(): void;
+    setDisabledState(isDisabled: boolean): void;
     private selectFile;
     private resetFile;
     private correctFileSize;
     private correctFileType;
     static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadComponent, "ndw-file-upload", never, { "allowedFileTypeRegex": { "alias": "allowedFileTypeRegex"; "required": false; "isSignal": true; }; "fileUploadText": { "alias": "fileUploadText"; "required": false; "isSignal": true; }; "uploadDate": { "alias": "uploadDate"; "required": false; "isSignal": true; }; "maxFileSizeInBytes": { "alias": "maxFileSizeInBytes"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "draggingOver": { "alias": "draggingOver"; "required": false; "isSignal": true; }; "selectedFile": { "alias": "selectedFile"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "incorrectFileType": { "alias": "incorrectFileType"; "required": false; "isSignal": true; }; "incorrectFileSize": { "alias": "incorrectFileSize"; "required": false; "isSignal": true; }; }, { "draggingOver": "draggingOverChange"; "selectedFile": "selectedFileChange"; "error": "errorChange"; "success": "successChange"; "incorrectFileType": "incorrectFileTypeChange"; "incorrectFileSize": "incorrectFileSizeChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadComponent, "ndw-file-upload", never, { "allowedFileTypeRegex": { "alias": "allowedFileTypeRegex"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fileUploadText": { "alias": "fileUploadText"; "required": false; "isSignal": true; }; "maxFileSizeInBytes": { "alias": "maxFileSizeInBytes"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "uploadDate": { "alias": "uploadDate"; "required": false; "isSignal": true; }; "draggingOver": { "alias": "draggingOver"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "incorrectFileSize": { "alias": "incorrectFileSize"; "required": false; "isSignal": true; }; "incorrectFileType": { "alias": "incorrectFileType"; "required": false; "isSignal": true; }; "selectedFile": { "alias": "selectedFile"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "draggingOver": "draggingOverChange"; "error": "errorChange"; "incorrectFileSize": "incorrectFileSizeChange"; "incorrectFileType": "incorrectFileTypeChange"; "selectedFile": "selectedFileChange"; "success": "successChange"; }, never, never, true, never>;
 }

package/{components → lib/components}/form-field/input-button/input-button.component.d.ts

@@ -1,4 +1,4 @@
-import { InputDirective } from '../input/input.directive';
+import { InputDirective } from '../input';
 import * as i0 from "@angular/core";
 export declare class InputButtonComponent {
     readonly disabled: import("@angular/core").InputSignal<boolean>;

package/{components → lib/components}/form-field/month-input/month-input.component.d.ts

@@ -3,7 +3,8 @@ import { ControlValueAccessor, NgControl } from '@angular/forms';
 import { InputDirective } from '../input';
 import * as i0 from "@angular/core";
 export declare class MonthInputComponent implements ControlValueAccessor, OnInit {
-    readonly disabled: import("@angular/core").ModelSignal<boolean>;
+    private readonly destroyRef;
+    protected readonly ngControl: NgControl | null;
     readonly required: import("@angular/core").InputSignal<boolean>;
     readonly showMonthPickerLabel: import("@angular/core").InputSignal<string>;
     readonly placeholder: import("@angular/core").InputSignal<string>;
@@ -11,21 +12,21 @@ export declare class MonthInputComponent implements ControlValueAccessor, OnInit
     readonly minDate: import("@angular/core").InputSignal<Date>;
     readonly maxDate: import("@angular/core").InputSignal<Date>;
     readonly monthLabels: import("@angular/core").InputSignal<string[]>;
-    readonly input: import("@angular/core").Signal<InputDirective | undefined>;
-    readonly inputElement: import("@angular/core").Signal<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | undefined>;
-    protected showMonthPicker: boolean;
+    readonly disabled: import("@angular/core").ModelSignal<boolean>;
+    readonly readonly: import("@angular/core").InputSignal<boolean>;
     protected readonly selectedYear: import("@angular/core").ModelSignal<number>;
     protected readonly selectedMonth: import("@angular/core").ModelSignal<number | null>;
+    readonly inputElement: import("@angular/core").Signal<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | undefined>;
     protected readonly selectedDate: import("@angular/core").Signal<Date | null>;
     protected readonly inputValue: import("@angular/core").Signal<string | null>;
-    protected readonly ngControl: NgControl | null;
     protected readonly years: import("@angular/core").Signal<number[]>;
     protected readonly months: import("@angular/core").Signal<{
         label: string;
         value: number;
     }[]>;
+    readonly input: import("@angular/core").Signal<InputDirective | undefined>;
+    protected showMonthPicker: boolean;
     private onChange;
-    private readonly destroyRef;
     constructor();
     ngOnInit(): void;
     writeValue(value: Date | null): void;
@@ -38,5 +39,5 @@ export declare class MonthInputComponent implements ControlValueAccessor, OnInit
     protected onKeyDown(event: KeyboardEvent): void;
     private adjustMonth;
     static ɵfac: i0.ɵɵFactoryDeclaration<MonthInputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MonthInputComponent, "ndw-month-input", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "showMonthPickerLabel": { "alias": "showMonthPickerLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "yearPlaceholder": { "alias": "yearPlaceholder"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "monthLabels": { "alias": "monthLabels"; "required": false; "isSignal": true; }; "selectedYear": { "alias": "selectedYear"; "required": false; "isSignal": true; }; "selectedMonth": { "alias": "selectedMonth"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "selectedYear": "selectedYearChange"; "selectedMonth": "selectedMonthChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonthInputComponent, "ndw-month-input", never, { "required": { "alias": "required"; "required": false; "isSignal": true; }; "showMonthPickerLabel": { "alias": "showMonthPickerLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "yearPlaceholder": { "alias": "yearPlaceholder"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "monthLabels": { "alias": "monthLabels"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "selectedYear": { "alias": "selectedYear"; "required": false; "isSignal": true; }; "selectedMonth": { "alias": "selectedMonth"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "selectedYear": "selectedYearChange"; "selectedMonth": "selectedMonthChange"; }, never, never, true, never>;
 }

package/{components → lib/components}/form-field/option-group/option-group.component.d.ts

@@ -3,15 +3,18 @@ import { OptionGroupMode } from './option-group.model';
 import { OptionComponent } from './option.component';
 import * as i0 from "@angular/core";
 export declare class OptionGroupComponent implements ControlValueAccessor {
+    private readonly ngControl;
+    readonly error: import("@angular/core").InputSignal<boolean>;
+    readonly readonly: import("@angular/core").InputSignal<boolean>;
     readonly fluid: import("@angular/core").InputSignal<boolean>;
     readonly fluidColumns: import("@angular/core").InputSignal<number | null>;
-    readonly disabled: import("@angular/core").ModelSignal<boolean>;
     readonly mode: import("@angular/core").InputSignal<OptionGroupMode>;
     readonly required: import("@angular/core").InputSignal<boolean>;
-    readonly children: import("@angular/core").Signal<readonly OptionComponent[]>;
+    readonly success: import("@angular/core").InputSignal<boolean>;
     protected readonly checkedValues: import("@angular/core").ModelSignal<unknown[]>;
-    private readonly ngControl;
+    readonly disabled: import("@angular/core").ModelSignal<boolean>;
     protected readonly fluidColumnStyle: import("@angular/core").Signal<string | null>;
+    readonly children: import("@angular/core").Signal<readonly OptionComponent[]>;
     protected readonly uuid: `${string}-${string}-${string}-${string}-${string}`;
     constructor();
     get isRequiredOrHasRequiredValidator(): boolean | null;
@@ -22,5 +25,5 @@ export declare class OptionGroupComponent implements ControlValueAccessor {
     registerOnTouched(): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<OptionGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<OptionGroupComponent, "ndw-option-group", never, { "fluid": { "alias": "fluid"; "required": false; "isSignal": true; }; "fluidColumns": { "alias": "fluidColumns"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "checkedValues": { "alias": "checkedValues"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "checkedValues": "checkedValuesChange"; }, ["children"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<OptionGroupComponent, "ndw-option-group", never, { "error": { "alias": "error"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "fluid": { "alias": "fluid"; "required": false; "isSignal": true; }; "fluidColumns": { "alias": "fluidColumns"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "checkedValues": { "alias": "checkedValues"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "checkedValues": "checkedValuesChange"; "disabled": "disabledChange"; }, ["children"], never, true, never>;
 }

package/lib/components/form-field/picker-button/index.d.ts

@@ -0,0 +1 @@
+export * from './picker-button.component';

package/{components → lib/components}/form-field/picker-button/picker-button.component.d.ts

@@ -1,5 +1,4 @@
-import { InputType } from '../input';
-import { InputDirective } from '../input/input.directive';
+import { InputDirective, InputType } from '../input';
 import * as i0 from "@angular/core";
 export declare class PickerButtonComponent {
     readonly disabled: import("@angular/core").InputSignal<boolean>;

package/{components → lib/components}/icon/action-icon/action-icon.component.d.ts

@@ -1,4 +1,4 @@
-import { IconSize } from '../icon.component';
+import { IconSize } from '@ndwnu/core';
 import * as i0 from "@angular/core";
 export type ButtonType = 'button' | 'submit' | 'reset';
 export type IconVariant = 'primary' | 'link' | 'grey' | 'white';

package/lib/components/icon/icon.component.d.ts

@@ -0,0 +1,6 @@
+import { CoreIconComponent } from '@ndwnu/core';
+import * as i0 from "@angular/core";
+export declare class IconComponent extends CoreIconComponent {
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IconComponent, "ndw-icon", never, {}, {}, never, ["*"], true, never>;
+}

package/{components → lib/components}/layout/layout.component.d.ts

@@ -2,13 +2,13 @@ import { MenuItem, NdwBrand } from '../main-navigation';
 import * as i0 from "@angular/core";
 export declare class LayoutComponent {
     applicationName: import("@angular/core").InputSignal<string>;
-    topMenuItems: import("@angular/core").InputSignal<MenuItem[]>;
     bottomMenuItems: import("@angular/core").InputSignal<MenuItem[] | undefined>;
     brand: import("@angular/core").InputSignal<NdwBrand>;
     isCollapsible: import("@angular/core").InputSignal<boolean>;
     isExpanded: import("@angular/core").InputSignal<boolean>;
     menuFooterTexts: import("@angular/core").InputSignal<string[] | undefined>;
+    topMenuItems: import("@angular/core").InputSignal<MenuItem[]>;
     version: import("@angular/core").InputSignal<string | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<LayoutComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LayoutComponent, "ndw-layout", never, { "applicationName": { "alias": "applicationName"; "required": true; "isSignal": true; }; "topMenuItems": { "alias": "topMenuItems"; "required": true; "isSignal": true; }; "bottomMenuItems": { "alias": "bottomMenuItems"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "isCollapsible": { "alias": "isCollapsible"; "required": false; "isSignal": true; }; "isExpanded": { "alias": "isExpanded"; "required": false; "isSignal": true; }; "menuFooterTexts": { "alias": "menuFooterTexts"; "required": false; "isSignal": true; }; "version": { "alias": "version"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LayoutComponent, "ndw-layout", never, { "applicationName": { "alias": "applicationName"; "required": true; "isSignal": true; }; "bottomMenuItems": { "alias": "bottomMenuItems"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "isCollapsible": { "alias": "isCollapsible"; "required": false; "isSignal": true; }; "isExpanded": { "alias": "isExpanded"; "required": false; "isSignal": true; }; "menuFooterTexts": { "alias": "menuFooterTexts"; "required": false; "isSignal": true; }; "topMenuItems": { "alias": "topMenuItems"; "required": true; "isSignal": true; }; "version": { "alias": "version"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/{components → lib/components}/main-navigation/main-navigation.component.d.ts

@@ -7,11 +7,11 @@ import * as i0 from "@angular/core";
 export declare class MainNavigationComponent implements AfterViewInit, OnDestroy {
     #private;
     applicationName: import("@angular/core").InputSignal<string>;
-    topMenuItems: import("@angular/core").InputSignal<MenuItem[]>;
     bottomMenuItems: import("@angular/core").InputSignal<MenuItem[] | undefined>;
     brand: import("@angular/core").InputSignal<NdwBrand>;
     footerTexts: import("@angular/core").InputSignal<string[] | undefined>;
     isCollapsible: import("@angular/core").InputSignal<boolean>;
+    topMenuItems: import("@angular/core").InputSignal<MenuItem[]>;
     version: import("@angular/core").InputSignal<string | undefined>;
     closeButtonLabel: import("@angular/core").InputSignal<string>;
     menuButtonLabel: import("@angular/core").InputSignal<string>;
@@ -22,18 +22,11 @@ export declare class MainNavigationComponent implements AfterViewInit, OnDestroy
     isMobile: import("@angular/core").WritableSignal<boolean>;
     brandImagePath: import("@angular/core").Signal<string>;
     activeId?: number;
-    private selectedId?;
     protected mobilePortal?: TemplatePortal<MainNavigationMenuComponent>;
     onMouseMove(event: MouseEvent): void;
     onWindowResize(): void;
     activeChildItems: SimpleMenuItem[];
     overlayPositions: ConnectedPosition[];
-    private overlay;
-    private viewContainerRef;
-    private document;
-    private platform;
-    private activeButton?;
-    private overlayRef?;
     constructor();
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
@@ -44,7 +37,6 @@ export declare class MainNavigationComponent implements AfterViewInit, OnDestroy
     toggleChildMenu(item: MenuItem, event?: KeyboardEvent): void;
     toggleMobileView(): void;
     toggleView(): void;
-    private setPositionStrategy;
     static ɵfac: i0.ɵɵFactoryDeclaration<MainNavigationComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MainNavigationComponent, "ndw-main-navigation", never, { "applicationName": { "alias": "applicationName"; "required": true; "isSignal": true; }; "topMenuItems": { "alias": "topMenuItems"; "required": true; "isSignal": true; }; "bottomMenuItems": { "alias": "bottomMenuItems"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "footerTexts": { "alias": "footerTexts"; "required": false; "isSignal": true; }; "isCollapsible": { "alias": "isCollapsible"; "required": false; "isSignal": true; }; "version": { "alias": "version"; "required": false; "isSignal": true; }; "closeButtonLabel": { "alias": "closeButtonLabel"; "required": false; "isSignal": true; }; "menuButtonLabel": { "alias": "menuButtonLabel"; "required": false; "isSignal": true; }; "isExpanded": { "alias": "isExpanded"; "required": false; "isSignal": true; }; "isMobileExpanded": { "alias": "isMobileExpanded"; "required": false; "isSignal": true; }; }, { "isExpanded": "isExpandedChange"; "isMobileExpanded": "isMobileExpandedChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MainNavigationComponent, "ndw-main-navigation", never, { "applicationName": { "alias": "applicationName"; "required": true; "isSignal": true; }; "bottomMenuItems": { "alias": "bottomMenuItems"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "footerTexts": { "alias": "footerTexts"; "required": false; "isSignal": true; }; "isCollapsible": { "alias": "isCollapsible"; "required": false; "isSignal": true; }; "topMenuItems": { "alias": "topMenuItems"; "required": true; "isSignal": true; }; "version": { "alias": "version"; "required": false; "isSignal": true; }; "closeButtonLabel": { "alias": "closeButtonLabel"; "required": false; "isSignal": true; }; "menuButtonLabel": { "alias": "menuButtonLabel"; "required": false; "isSignal": true; }; "isExpanded": { "alias": "isExpanded"; "required": false; "isSignal": true; }; "isMobileExpanded": { "alias": "isMobileExpanded"; "required": false; "isSignal": true; }; }, { "isExpanded": "isExpandedChange"; "isMobileExpanded": "isMobileExpandedChange"; }, never, never, true, never>;
 }

package/lib/components/tab/tab.component.d.ts

@@ -0,0 +1,17 @@
+import { TemplatePortal } from '@angular/cdk/portal';
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class TabComponent implements OnInit {
+    private readonly _viewContainerRef;
+    private readonly _elementRef;
+    private _content;
+    private readonly _contentTemplate;
+    get content(): TemplatePortal | null;
+    title: import("@angular/core").InputSignal<string>;
+    active: boolean;
+    id: `${string}-${string}-${string}-${string}-${string}`;
+    ngOnInit(): void;
+    getNativeElement(): HTMLElement;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TabComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TabComponent, "ndw-tab", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/{components → lib/components}/tab-group/tab-group.component.d.ts

@@ -1,10 +1,12 @@
-import { AfterContentInit } from '@angular/core';
 import { TabComponent } from '../tab';
 import * as i0 from "@angular/core";
-export declare class TabGroupComponent implements AfterContentInit {
-    tabs: import("@angular/core").Signal<readonly TabComponent[]>;
+export declare class TabGroupComponent {
+    private readonly _tabs;
+    private readonly _tabButtons;
+    tabs: import("@angular/core").Signal<TabComponent[]>;
     activeTab: import("@angular/core").ModelSignal<number>;
-    ngAfterContentInit(): void;
+    selectTab(index: number): void;
+    onKeyDown(event: KeyboardEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TabGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabGroupComponent, "ndw-tab-group", never, { "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; }, ["tabs"], ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TabGroupComponent, "ndw-tab-group", never, { "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; }, ["_tabs"], never, true, never>;
 }

package/{components → lib/components}/toast/toast.component.d.ts

@@ -1,11 +1,11 @@
 import { OnDestroy, OnInit } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class ToastComponent implements OnInit, OnDestroy {
-    readonly message: import("@angular/core").ModelSignal<string>;
-    readonly close: import("@angular/core").OutputEmitterRef<void>;
-    private interval;
     private readonly renderer;
+    readonly close: import("@angular/core").OutputEmitterRef<void>;
+    readonly message: import("@angular/core").ModelSignal<string>;
     private readonly toastContainer;
+    private interval;
     ngOnInit(): void;
     ngOnDestroy(): void;
     open(): void;
@@ -15,5 +15,5 @@ export declare class ToastComponent implements OnInit, OnDestroy {
     private clearInterval;
     private truncateText;
     static ɵfac: i0.ɵɵFactoryDeclaration<ToastComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToastComponent, "ndw-toast", never, { "message": { "alias": "message"; "required": false; "isSignal": true; }; }, { "message": "messageChange"; "close": "close"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToastComponent, "ndw-toast", never, { "message": { "alias": "message"; "required": false; "isSignal": true; }; }, { "close": "close"; "message": "messageChange"; }, never, never, true, never>;
 }

package/package.json

@@ -1,14 +1,17 @@
 {
   "name": "@ndwnu/design-system",
-  "version": "6.0.0",
+  "version": "7.0.0",
   "peerDependencies": {
-    "@angular/cdk": "^19.0.1",
-    "@angular/common": "^19.0.1",
-    "@angular/core": "^19.0.1",
-    "@angular/platform-browser": "^19.0.1"
-  },
-  "dependencies": {
-    "tslib": "^2.3.0"
+    "@angular/animations": "~19.0.0",
+    "@angular/cdk": "~19.0.0",
+    "@angular/common": "^19.0.0",
+    "@angular/core": "^19.0.0",
+    "@angular/forms": "~19.0.0",
+    "@angular/router": "~19.0.0",
+    "@ndwnu/core": "0.0.1-beta.1",
+    "@storybook/addon-actions": "8.5.0",
+    "@storybook/angular": "8.5.0",
+    "rxjs": "~7.8.0"
   },
   "sideEffects": false,
   "module": "fesm2022/ndwnu-design-system.mjs",
@@ -21,5 +24,8 @@
       "types": "./index.d.ts",
       "default": "./fesm2022/ndwnu-design-system.mjs"
     }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
   }
 }

package/styles/base/_colors.scss

@@ -0,0 +1,234 @@
+:root {
+  /* Colors */
+  // Grey
+  --_grey-700: 195, 100%, 10%;
+  --_grey-600: 196, 13%, 29%;
+  --_grey-500: 197, 7%, 40%;
+  --_grey-400: 204, 2%, 54%;
+  --_grey-300: 192, 5%, 82%;
+  --_grey-200: 204, 11%, 91%;
+  --_grey-100: 200, 16%, 96%;
+  --_white: 0, 0%, 100%;
+
+  --ndw-color-grey-700: hsl(var(--_grey-700));
+  --ndw-color-grey-600: hsl(var(--_grey-600));
+  --ndw-color-grey-500: hsl(var(--_grey-500));
+  --ndw-color-grey-400: hsl(var(--_grey-400));
+  --ndw-color-grey-300: hsl(var(--_grey-300));
+  --ndw-color-grey-200: hsl(var(--_grey-200));
+  --ndw-color-grey-100: hsl(var(--_grey-100));
+  --ndw-color-white: hsl(var(--_white));
+
+  // Primary
+  --_primary: 19, 100%;
+  --_primary-050: var(--_primary), 95%;
+  --_primary-100: var(--_primary), 80%;
+  --_primary-200: var(--_primary), 73%;
+  --_primary-300: var(--_primary), 62%;
+  --_primary-400: var(--_primary), 50%;
+  --_primary-500: var(--_primary), 40%;
+  --_primary-600: var(--_primary), 35%;
+  --_primary-700: var(--_primary), 27%;
+  --_primary-800: var(--_primary), 15%;
+
+  --ndw-color-primary-050: hsl(var(--_primary-050));
+  --ndw-color-primary-100: hsl(var(--_primary-100));
+  --ndw-color-primary-200: hsl(var(--_primary-200));
+  --ndw-color-primary-300: hsl(var(--_primary-300));
+  --ndw-color-primary-400: hsl(var(--_primary-400));
+  --ndw-color-primary-500: hsl(var(--_primary-500));
+  --ndw-color-primary-600: hsl(var(--_primary-600));
+  --ndw-color-primary-700: hsl(var(--_primary-700));
+  --ndw-color-primary-800: hsl(var(--_primary-800));
+
+  --ndw-color-primary: var(--ndw-color-primary-500);
+  --ndw-color-primary-hover: var(--ndw-color-primary-600);
+  --ndw-color-primary-active: var(--ndw-color-primary-700);
+
+  // Secondary
+  --_secondary-050: 209, 100%, 96%;
+  --_secondary-100: 209, 85%, 91%;
+  --_secondary-200: 209, 85%, 78%;
+  --_secondary-300: 209, 85%, 69%;
+  --_secondary-400: 208, 100%, 46%;
+  --_secondary-500: 208, 100%, 41%;
+  --_secondary-600: 209, 100%, 32%;
+  --_secondary-700: 209, 100%, 18%;
+
+  --ndw-color-secondary-050: hsl(var(--_secondary-050));
+  --ndw-color-secondary-100: hsl(var(--_secondary-100));
+  --ndw-color-secondary-200: hsl(var(--_secondary-200));
+  --ndw-color-secondary-300: hsl(var(--_secondary-300));
+  --ndw-color-secondary-400: hsl(var(--_secondary-400));
+  --ndw-color-secondary-500: hsl(var(--_secondary-500));
+  --ndw-color-secondary-600: hsl(var(--_secondary-600));
+  --ndw-color-secondary-700: hsl(var(--_secondary-700));
+
+  --ndw-color-secondary: var(--ndw-color-secondary-500);
+  --ndw-color-secondary-hover: var(--ndw-color-secondary-600);
+  --ndw-color-secondary-active: var(--ndw-color-secondary-700);
+
+  // Tertiary
+  --_tertiary-400: 43, 100%, 50%;
+  --_tertiary-500: 42, 100%, 43%;
+
+  --ndw-color-tertiary-400: hsl(var(--_tertiary-400));
+  --ndw-color-tertiary-500: hsl(var(--_tertiary-500));
+
+  // Links
+  --_link: 208, 100%;
+  --_link-400: var(--_link), 41%;
+  --_link-500: var(--_link), 32%;
+
+  --ndw-color-link-400: hsl(var(--_link-400));
+  --ndw-color-link-500: hsl(var(--_link-500));
+
+  // Feedback
+  --_positive: 133, 92%;
+  --_positive-100: 117, 56%, 92%;
+  --_positive-500: var(--_positive), 33%;
+  --_positive-600: var(--_positive), 24%;
+  --_warning: 43, 93%;
+  --_warning-100: 44, 100%, 94%;
+  --_warning-500: var(--_warning), 43%;
+  --_warning-600: 42, 83%, 32%;
+  --_alternative: 292, 100%;
+  --_alternative-100: var(--_alternative), 95%;
+  --_alternative-500: 292, 95%, 33%;
+  --_critical: 0, 100%;
+  --_critical-100: var(--_critical), 98%;
+  --_critical-200: var(--_critical), 95%;
+  --_critical-300: var(--_critical), 90%;
+  --_critical-500: var(--_critical), 46%;
+  --_info-100: 210, 100%, 96%;
+  --_info-200: 210, 86%, 91%;
+  --_info-500: 208, 100%, 41%;
+
+  --ndw-color-positive-100: hsl(var(--_positive-100));
+  --ndw-color-positive-500: hsl(var(--_positive-500));
+  --ndw-color-positive-600: hsl(var(--_positive-600));
+  --ndw-color-warning-100: hsl(var(--_warning-100));
+  --ndw-color-warning-500: hsl(var(--_warning-500));
+  --ndw-color-warning-600: hsl(var(--_warning-600));
+  --ndw-color-alternative-100: hsl(var(--_alternative-100));
+  --ndw-color-alternative-500: hsl(var(--_alternative-500));
+  --ndw-color-critical-100: hsl(var(--_critical-100));
+  --ndw-color-critical-200: hsl(var(--_critical-200));
+  --ndw-color-critical-300: hsl(var(--_critical-300));
+  --ndw-color-critical-500: hsl(var(--_critical-500));
+  --ndw-color-info-100: hsl(var(--_info-100));
+  --ndw-color-info-200: hsl(var(--_info-200));
+  --ndw-color-info-500: hsl(var(--_info-500));
+
+  --ndw-color-notification: hsl(19, 100%, 35%);
+
+  // Data
+  --_data-a-500: 133, 100%, 21%;
+  --_data-a-100: 101, 61%, 81%;
+  --_data-b-500: 0, 0%, 27%;
+  --_data-b-100: 0, 0%, 87%;
+  --_data-c-500: 209, 97%, 38%;
+  --_data-c-100: 194, 95%, 84%;
+  --_data-d-500: 292, 95%, 33%;
+  --_data-d-100: 292, 100%, 87%;
+  --_data-e-500: 51, 95%, 23%;
+  --_data-e-100: 54, 89%, 79%;
+  --_data-f-500: 0, 97%, 35%;
+  --_data-f-100: 0, 100%, 94%;
+
+  --ndw-color-data-a-500: hsl(var(--_data-a-500));
+  --ndw-color-data-a-100: hsl(var(--_data-a-100));
+  --ndw-color-data-b-500: hsl(var(--_data-b-500));
+  --ndw-color-data-b-100: hsl(var(--_data-b-100));
+  --ndw-color-data-c-500: hsl(var(--_data-c-500));
+  --ndw-color-data-c-100: hsl(var(--_data-c-100));
+  --ndw-color-data-d-500: hsl(var(--_data-d-500));
+  --ndw-color-data-d-100: hsl(var(--_data-d-100));
+  --ndw-color-data-e-500: hsl(var(--_data-e-500));
+  --ndw-color-data-e-100: hsl(var(--_data-e-100));
+  --ndw-color-data-f-500: hsl(var(--_data-f-500));
+  --ndw-color-data-f-100: hsl(var(--_data-f-100));
+
+  // Alpha Primary
+  --_alpha-black: 0, 0%, 0%;
+  --_alpha-007: 0.07;
+  --_alpha-015: 0.15;
+  --_alpha-040: 0.4;
+
+  --ndw-alpha-black-007: hsla(var(--_alpha-black), var(--_alpha-007));
+  --ndw-alpha-black-015: hsla(var(--_alpha-black), var(--_alpha-015));
+  --ndw-alpha-black-040: hsla(var(--_alpha-black), var(--_alpha-040));
+
+  --ndw-alpha-white-040: hsla(var(--_white), var(--_alpha-040));
+
+  --ndw-alpha-primary-007: hsla(var(--_primary-500), var(--_alpha-007));
+  --ndw-alpha-primary-015: hsla(var(--_primary-500), var(--_alpha-015));
+
+  // Background
+  --ndw-color-background: var(--ndw-color-primary);
+  --ndw-color-background-hover: var(--ndw-color-primary-hover);
+  --ndw-color-background-active: var(--ndw-color-primary-active);
+  --ndw-color-background-disabled: var(--ndw-color-grey-300);
+
+  // Foreground
+  --ndw-color-foreground: var(--ndw-color-white);
+  --ndw-color-foreground-hover: var(--ndw-color-white);
+  --ndw-color-foreground-active: var(--ndw-color-white);
+
+  // Text
+  --ndw-color-text: var(--ndw-color-grey-700);
+}
+
+[data-theme='nwb'] {
+  /* Colors */
+  // Primary
+  --_primary-050: 176, 44%, 95%;
+  --_primary-100: 176, 44%, 82%;
+  --_primary-200: 176, 44%, 73%;
+  --_primary-300: 176, 50%, 60%;
+  --_primary-400: 176, 55%, 48%;
+  --_primary-500: 176, 58%, 41%;
+  --_primary-600: 176, 60%, 34%;
+  --_primary-700: 176, 68%, 21%;
+  --_primary-800: 176, 68%, 13%;
+
+  --ndw-color-primary-050: hsl(var(--_primary-050));
+  --ndw-color-primary-100: hsl(var(--_primary-100));
+  --ndw-color-primary-200: hsl(var(--_primary-200));
+  --ndw-color-primary-300: hsl(var(--_primary-300));
+  --ndw-color-primary-400: hsl(var(--_primary-400));
+  --ndw-color-primary-500: hsl(var(--_primary-500));
+  --ndw-color-primary-600: hsl(var(--_primary-600));
+  --ndw-color-primary-700: hsl(var(--_primary-700));
+  --ndw-color-primary-800: hsl(var(--_primary-800));
+
+  // Secondary
+  --_secondary-050: 0, 100%, 95%;
+  --_secondary-100: 0, 100%, 90%;
+  --_secondary-200: 0, 100%, 82%;
+  --_secondary-300: 0, 100%, 74%;
+  --_secondary-400: 0, 100%, 66%;
+  --_secondary-500: 0, 100%, 58%;
+  --_secondary-600: 0, 75%, 42%;
+  --_secondary-700: 0, 79%, 26%;
+
+  --ndw-color-secondary-050: hsl(var(--_secondary-050));
+  --ndw-color-secondary-100: hsl(var(--_secondary-100));
+  --ndw-color-secondary-200: hsl(var(--_secondary-200));
+  --ndw-color-secondary-300: hsl(var(--_secondary-300));
+  --ndw-color-secondary-400: hsl(var(--_secondary-400));
+  --ndw-color-secondary-500: hsl(var(--_secondary-500));
+  --ndw-color-secondary-600: hsl(var(--_secondary-600));
+  --ndw-color-secondary-700: hsl(var(--_secondary-700));
+
+  // Tertiary
+  --_tertiary-400: 309, 29%, 36%;
+  --_tertiary-500: 309, 29%, 18%;
+
+  --ndw-color-tertiary-400: hsl(var(--_tertiary-400));
+  --ndw-color-tertiary-500: hsl(var(--_tertiary-500));
+
+  // Alpha Primary
+  --ndw-alpha-primary-007: hsla(var(--_primary-500), var(--_alpha-007));
+  --ndw-alpha-primary-015: hsla(var(--_primary-500), var(--_alpha-015));
+}