@ndwnu/design-system 1.0.0 → 1.0.2

package/components/collapsible/collapsible.component.d.ts

@@ -6,7 +6,7 @@ export declare class CollapsibleComponent {
     expanded: import("@angular/core").ModelSignal<boolean>;
     private readonly accordionService;
     get expandedClass(): boolean;
-    animationState: import("@angular/core").Signal<"in" | "out">;
+    animationState: import("@angular/core").Signal<"open" | "closed">;
     onClick(): void;
     onKeydown(event: KeyboardEvent): void;
     private toggle;

package/components/dropdown/dropdown-trigger.directive.d.ts

@@ -5,7 +5,6 @@ export declare class DropdownTriggerDirective implements OnDestroy {
     toggleOnClick: import("@angular/core").InputSignal<boolean>;
     isOpen: import("@angular/core").ModelSignal<boolean>;
     toggle(): void;
-    trapFocus(): void;
     private destroyRef;
     private elementRef;
     private overlay;
@@ -15,6 +14,7 @@ export declare class DropdownTriggerDirective implements OnDestroy {
     constructor();
     ngOnDestroy(): void;
     private open;
+    private trapFocus;
     private closeOverlayOnEscapeKey;
     private closeOverlayOnBackdropClick;
     private close;

package/components/form-field/form-field.component.d.ts

@@ -1,9 +1,8 @@
-import { OnChanges } from '@angular/core';
 import { CheckboxComponent } from './checkbox';
 import { InputDirective } from './input';
 import { RadioGroupComponent } from './radio-group';
 import * as i0 from "@angular/core";
-export declare class FormFieldComponent implements OnChanges {
+export declare class FormFieldComponent {
     input: import("@angular/core").Signal<InputDirective | undefined>;
     radioGroup: import("@angular/core").Signal<RadioGroupComponent | undefined>;
     checkboxes: import("@angular/core").Signal<readonly CheckboxComponent[]>;
@@ -17,7 +16,7 @@ export declare class FormFieldComponent implements OnChanges {
     inputSuffix: import("@angular/core").Signal<string | undefined>;
     uuid: `${string}-${string}-${string}-${string}-${string}`;
     constructor();
-    ngOnChanges(): void;
+    clearInput(): void;
     private addInputTypeBasedClass;
     private setInputDisabledState;
     private setInputErrorState;

package/components/form-field/input/input.directive.d.ts

@@ -5,6 +5,7 @@ export declare class InputDirective implements OnInit {
     set error(error: boolean);
     set id(id: string);
     private readonly elementRef;
+    private readonly destroyRef;
     get element(): HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputDirective, never>;

package/core/styles/ndw-styles.scss

@@ -20,6 +20,94 @@
   --ndw-text-primary: var(--ndw-color-primary);
 }
 
+.cdk-overlay-container, .cdk-global-overlay-wrapper {
+  pointer-events: none;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+}
+
+.cdk-overlay-container {
+  position: fixed;
+  z-index: 1000;
+}
+
+.cdk-overlay-container:empty {
+  display: none;
+}
+
+.cdk-global-overlay-wrapper {
+  display: flex;
+  position: absolute;
+  z-index: 1000;
+}
+
+.cdk-overlay-pane {
+  position: absolute;
+  pointer-events: auto;
+  box-sizing: border-box;
+  z-index: 1000;
+  display: flex;
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.cdk-overlay-backdrop {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  pointer-events: auto;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
+  opacity: 0;
+}
+
+.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
+  opacity: 1;
+}
+
+.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
+  opacity: 0.6;
+}
+
+.cdk-overlay-dark-backdrop {
+  background: rgba(0, 0, 0, 0.32);
+}
+
+.cdk-overlay-transparent-backdrop {
+  transition: visibility 1ms linear, opacity 1ms linear;
+  visibility: hidden;
+  opacity: 1;
+}
+
+.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
+  opacity: 0;
+  visibility: visible;
+}
+
+.cdk-overlay-backdrop-noop-animation {
+  transition: none;
+}
+
+.cdk-overlay-connected-position-bounding-box {
+  position: absolute;
+  z-index: 1000;
+  display: flex;
+  flex-direction: column;
+  min-width: 1px;
+  min-height: 1px;
+}
+
+.cdk-global-scrollblock {
+  position: fixed;
+  width: 100%;
+  overflow-y: scroll;
+}
+
 :root {
   /* Colors */
   --_grey: 0, 0%;

package/core/styles/nwb-styles.scss

@@ -20,6 +20,94 @@
   --ndw-text-primary: var(--ndw-color-grey-600);
 }
 
+.cdk-overlay-container, .cdk-global-overlay-wrapper {
+  pointer-events: none;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+}
+
+.cdk-overlay-container {
+  position: fixed;
+  z-index: 1000;
+}
+
+.cdk-overlay-container:empty {
+  display: none;
+}
+
+.cdk-global-overlay-wrapper {
+  display: flex;
+  position: absolute;
+  z-index: 1000;
+}
+
+.cdk-overlay-pane {
+  position: absolute;
+  pointer-events: auto;
+  box-sizing: border-box;
+  z-index: 1000;
+  display: flex;
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.cdk-overlay-backdrop {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  pointer-events: auto;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
+  opacity: 0;
+}
+
+.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
+  opacity: 1;
+}
+
+.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
+  opacity: 0.6;
+}
+
+.cdk-overlay-dark-backdrop {
+  background: rgba(0, 0, 0, 0.32);
+}
+
+.cdk-overlay-transparent-backdrop {
+  transition: visibility 1ms linear, opacity 1ms linear;
+  visibility: hidden;
+  opacity: 1;
+}
+
+.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
+  opacity: 0;
+  visibility: visible;
+}
+
+.cdk-overlay-backdrop-noop-animation {
+  transition: none;
+}
+
+.cdk-overlay-connected-position-bounding-box {
+  position: absolute;
+  z-index: 1000;
+  display: flex;
+  flex-direction: column;
+  min-width: 1px;
+  min-height: 1px;
+}
+
+.cdk-global-scrollblock {
+  position: fixed;
+  width: 100%;
+  overflow-y: scroll;
+}
+
 :root {
   /* Colors */
   --_grey: 0, 0%;

package/esm2022/components/accordion/accordion.component.mjs

@@ -18,10 +18,10 @@ export class AccordionComponent {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.0", type: AccordionComponent, isStandalone: true, selector: "ndw-accordion", inputs: { collapseOthers: { classPropertyName: "collapseOthers", publicName: "collapseOthers", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "collapsibles", predicate: CollapsibleComponent, isSignal: true }], ngImport: i0, template: "<ng-content />\n", styles: [""] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.1", type: AccordionComponent, isStandalone: true, selector: "ndw-accordion", inputs: { collapseOthers: { classPropertyName: "collapseOthers", publicName: "collapseOthers", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "collapsibles", predicate: CollapsibleComponent, isSignal: true }], ngImport: i0, template: "<ng-content />\n", styles: [""] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AccordionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: AccordionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ndw-accordion', standalone: true, imports: [], template: "<ng-content />\n" }]
         }] });

package/esm2022/components/accordion/accordion.service.mjs

@@ -8,10 +8,10 @@ export class AccordionService {
     setExpandedCollapsible(index) {
         this.expanded$.next(index);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AccordionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AccordionService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: AccordionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: AccordionService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AccordionService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: AccordionService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',