@ni/nimble-angular 1.0.0-beta.98 → 1.1.0

package/fesm2015/ni-nimble-angular.js

@@ -1,232 +1,238 @@
-import * as i0 from '@angular/core';
-import { Directive, HostBinding, Input, NgModule, forwardRef, Optional, Host, EventEmitter, Output, HostListener } from '@angular/core';
+import { Directive, Renderer2, ElementRef, Input, NgModule, forwardRef, EventEmitter, Output, HostListener, Inject, Optional, Host } from '@angular/core';
+export { ButtonAppearance } from '@ni/nimble-components/dist/esm/button/types';
 import { CommonModule } from '@angular/common';
-import '@ni/nimble-components/dist/esm/theme-provider';
-import { DefaultValueAccessor, NG_VALUE_ACCESSOR, NumberValueAccessor, SelectControlValueAccessor, NgSelectOption, CheckboxControlValueAccessor } from '@angular/forms';
-import '@ni/nimble-components/dist/esm/text-field';
-import '@ni/nimble-components/dist/esm/number-field';
-import '@ni/nimble-components/dist/esm/select';
-import '@ni/nimble-components/dist/esm/listbox-option';
 import '@ni/nimble-components/dist/esm/button';
-import '@ni/nimble-components/dist/esm/tree-view';
-import '@ni/nimble-components/dist/esm/tree-item';
+import { CheckboxControlValueAccessor, NG_VALUE_ACCESSOR, SelectControlValueAccessor, NgSelectOption, NumberValueAccessor, DefaultValueAccessor } from '@angular/forms';
 import '@ni/nimble-components/dist/esm/checkbox';
-import '@ni/nimble-components/dist/esm/tabs';
+import { DrawerState } from '@ni/nimble-components/dist/esm/drawer/types';
+export { DrawerLocation, DrawerState } from '@ni/nimble-components/dist/esm/drawer/types';
+import '@ni/nimble-components/dist/esm/drawer';
+import '@ni/nimble-components/dist/esm/listbox-option';
+import '@ni/nimble-components/dist/esm/menu';
+import '@ni/nimble-components/dist/esm/menu-item';
+import '@ni/nimble-components/dist/esm/number-field';
+import '@ni/nimble-components/dist/esm/select';
 import '@ni/nimble-components/dist/esm/tab';
 import '@ni/nimble-components/dist/esm/tab-panel';
+import '@ni/nimble-components/dist/esm/tabs';
 import '@ni/nimble-components/dist/esm/tabs-toolbar';
+export { TextFieldType } from '@ni/nimble-components/dist/esm/text-field/types';
+import '@ni/nimble-components/dist/esm/text-field';
+export { Theme } from '@ni/nimble-components/dist/esm/theme-provider/types';
+import '@ni/nimble-components/dist/esm/theme-provider';
+import '@ni/nimble-components/dist/esm/toggle-button';
+import '@ni/nimble-components/dist/esm/tree-item';
+export { TreeViewSelectionMode } from '@ni/nimble-components/dist/esm/tree-view/types';
+import '@ni/nimble-components/dist/esm/tree-view';
+import { waitForUpdatesAsync as waitForUpdatesAsync$1 } from '@ni/nimble-components/dist/esm/testing/async-helpers';
+export { processUpdates } from '@ni/nimble-components/dist/esm/testing/async-helpers';
 
 /**
- * Directive for Angular integration for the theme provider
+ * Conversion helpers for values coming from template attributes or property bindings
  */
-class NimbleThemeProviderDirective {
-}
-NimbleThemeProviderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleThemeProviderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleThemeProviderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleThemeProviderDirective, selector: "nimble-theme-provider", inputs: { theme: "theme" }, host: { properties: { "attr.theme": "this.theme" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleThemeProviderDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-theme-provider'
-                }]
-        }], propDecorators: { theme: [{
-                type: HostBinding,
-                args: ['attr.theme']
-            }, {
-                type: Input
-            }] } });
-
-class NimbleThemeProviderModule {
-}
-NimbleThemeProviderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleThemeProviderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleThemeProviderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleThemeProviderModule, declarations: [NimbleThemeProviderDirective], imports: [CommonModule], exports: [NimbleThemeProviderDirective] });
-NimbleThemeProviderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleThemeProviderModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleThemeProviderModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleThemeProviderDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleThemeProviderDirective]
-                }]
-        }] });
-
 /**
- * Directive to provide Angular integration for the text field
+ * Converts values from templates (empty string or null) or boolean bindings to a boolean property representation
  */
-class NimbleTextFieldDirective {
-}
-NimbleTextFieldDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTextFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTextFieldDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTextFieldDirective, selector: "nimble-text-field", inputs: { readonly: "readonly" }, host: { properties: { "attr.readonly": "this.readonly" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTextFieldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-text-field'
-                }]
-        }], propDecorators: { readonly: [{
-                type: HostBinding,
-                args: ['attr.readonly']
-            }, {
-                type: Input
-            }] } });
+const toBooleanProperty = (value) => {
+    if (value === false || value === null) {
+        return false;
+    }
+    // For boolean attributes the empty string value is true
+    return true;
+};
+/**
+ * Converts values from templates (empty string or null) or boolean bindings to an Aria boolean
+ * attribute representation (the strings "true" or "false")
+ */
+const toBooleanAriaAttribute = (value) => {
+    if (value === false || value === null) {
+        return 'false';
+    }
+    // For boolean attributes the empty string value is true
+    return 'true';
+};
+/**
+ * Converts values from templates (number representation as a string) or number bindings to a number property representation
+ */
+const toNumberProperty = (value) => {
+    // Angular: https://github.com/angular/angular/blob/2664bc2b3ef4ee5fd671f915828cfcc274a36c77/packages/forms/src/directives/number_value_accessor.ts#L67
+    // And Fast: https://github.com/microsoft/fast/blob/46bb6d9aab2c37105f4434db3795e176c2354a4f/packages/web-components/fast-element/src/components/attributes.ts#L100
+    // Handle numeric conversions from the view differently
+    // Since Number(val) https://tc39.es/ecma262/multipage/numbers-and-dates.html#sec-number-constructor-number-value
+    // and val * 1 https://tc39.es/ecma262/multipage/ecmascript-language-expressions.html#sec-applystringornumericbinaryoperator
+    // Are identical (use ToNumeric algorithm), went with Number() for clarity
+    return Number(value);
+};
 
 /**
- * Extension of Angular's DefaultValueAccessor to target the text-based inputs.
- *
- * Directive decorator based on DefaultValueAccessor decorator
- * https://github.com/angular/angular/blob/master/packages/forms/src/directives/default_value_accessor.ts#L72
+ * Directive to provide Angular integration for the button.
  */
-class NimbleDefaultControlValueAccessorDirective extends DefaultValueAccessor {
-}
-NimbleDefaultControlValueAccessorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleDefaultControlValueAccessorDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NimbleDefaultControlValueAccessorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleDefaultControlValueAccessorDirective, selector: "nimble-text-field[formControlName],nimble-text-field[formControl],nimble-text-field[ngModel]", host: { listeners: { "input": "$any(this)._handleInput($event.target.value)", "blur": "onTouched()", "compositionstart": "$any(this)._compositionStart()", "compositionend": "$any(this)._compositionEnd($event.target.value)" } }, providers: [{
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => NimbleDefaultControlValueAccessorDirective),
-            multi: true
-        }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleDefaultControlValueAccessorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-text-field[formControlName],nimble-text-field[formControl],nimble-text-field[ngModel]',
-                    // The following host metadata is duplicated from DefaultValueAccessor
-                    // eslint-disable-next-line @angular-eslint/no-host-metadata-property
-                    host: {
-                        '(input)': '$any(this)._handleInput($event.target.value)',
-                        '(blur)': 'onTouched()',
-                        '(compositionstart)': '$any(this)._compositionStart()',
-                        '(compositionend)': '$any(this)._compositionEnd($event.target.value)'
-                    },
-                    providers: [{
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => NimbleDefaultControlValueAccessorDirective),
-                            multi: true
-                        }]
-                }]
-        }] });
+class NimbleButtonDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get appearance() {
+        return this.elementRef.nativeElement.appearance;
+    }
+    set appearance(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'appearance', value);
+    }
+    get disabled() {
+        return this.elementRef.nativeElement.disabled;
+    }
+    set disabled(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', toBooleanProperty(value));
+    }
+    get type() {
+        return this.elementRef.nativeElement.type;
+    }
+    set type(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'type', value);
+    }
+    get contentHidden() {
+        return this.elementRef.nativeElement.contentHidden;
+    }
+    // contentHidden property intentionally maps to the content-hidden attribute
+    // eslint-disable-next-line @angular-eslint/no-input-rename
+    set contentHidden(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'contentHidden', toBooleanProperty(value));
+    }
+}
+NimbleButtonDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-button'
+            },] }
+];
+NimbleButtonDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleButtonDirective.propDecorators = {
+    appearance: [{ type: Input }],
+    disabled: [{ type: Input }],
+    type: [{ type: Input }],
+    contentHidden: [{ type: Input, args: ['content-hidden',] }]
+};
+
+class NimbleButtonModule {
+}
+NimbleButtonModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleButtonDirective],
+                imports: [CommonModule],
+                exports: [NimbleButtonDirective]
+            },] }
+];
 
 /**
- * Extension of Angular's NumberValueAccessor to target the number-based inputs.
+ * Extension of Angular's CheckboxControlValueAccessor to target the Nimble checkbox control.
  *
- * Directive decorator based on NumberValueAccessor decorator
- * https://github.com/angular/angular/blob/master/packages/forms/src/directives/number_value_accessor.ts#L43
+ * Directive decorator based on CheckboxControlValueAccessor decorator
+ * https://github.com/angular/angular/blob/bbababe5900ea8f4c8fccd88238f6fe08a2ceb63/packages/forms/src/directives/checkbox_value_accessor.ts#L42
  */
-class NimbleNumberControlValueAccessorDirective extends NumberValueAccessor {
-}
-NimbleNumberControlValueAccessorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberControlValueAccessorDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NimbleNumberControlValueAccessorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleNumberControlValueAccessorDirective, selector: "nimble-number-field[formControlName],nimble-number-field[formControl],nimble-number-field[ngModel]", host: { listeners: { "input": "onChange($event.target.value)", "blur": "onTouched()" } }, providers: [{
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => NimbleNumberControlValueAccessorDirective),
-            multi: true
-        }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberControlValueAccessorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-number-field[formControlName],nimble-number-field[formControl],nimble-number-field[ngModel]',
-                    // The following host metadata is duplicated from NumberValueAccessor
-                    // eslint-disable-next-line @angular-eslint/no-host-metadata-property
-                    host: { '(input)': 'onChange($event.target.value)', '(blur)': 'onTouched()' },
-                    providers: [{
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => NimbleNumberControlValueAccessorDirective),
-                            multi: true
-                        }]
-                }]
-        }] });
-
-class NimbleControlValueAccessorModule {
-}
-NimbleControlValueAccessorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleControlValueAccessorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleControlValueAccessorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleControlValueAccessorModule, declarations: [NimbleDefaultControlValueAccessorDirective, NimbleNumberControlValueAccessorDirective], imports: [CommonModule], exports: [NimbleDefaultControlValueAccessorDirective, NimbleNumberControlValueAccessorDirective] });
-NimbleControlValueAccessorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleControlValueAccessorModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleControlValueAccessorModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleDefaultControlValueAccessorDirective, NimbleNumberControlValueAccessorDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleDefaultControlValueAccessorDirective, NimbleNumberControlValueAccessorDirective]
-                }]
-        }] });
-
-class NimbleTextFieldModule {
+class NimbleCheckboxControlValueAccessorDirective extends CheckboxControlValueAccessor {
 }
-NimbleTextFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTextFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTextFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTextFieldModule, declarations: [NimbleTextFieldDirective], imports: [CommonModule, NimbleControlValueAccessorModule], exports: [NimbleTextFieldDirective, NimbleControlValueAccessorModule] });
-NimbleTextFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTextFieldModule, providers: [], imports: [[CommonModule, NimbleControlValueAccessorModule], NimbleControlValueAccessorModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTextFieldModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTextFieldDirective],
-                    imports: [CommonModule, NimbleControlValueAccessorModule],
-                    providers: [],
-                    exports: [NimbleTextFieldDirective, NimbleControlValueAccessorModule]
-                }]
-        }] });
+NimbleCheckboxControlValueAccessorDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-checkbox[formControlName],nimble-checkbox[formControl],nimble-checkbox[ngModel]',
+                // The following host metadata is duplicated from CheckboxControlValueAccessor
+                // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+                host: { '(change)': 'onChange($event.target.checked)', '(blur)': 'onTouched()' },
+                providers: [{
+                        provide: NG_VALUE_ACCESSOR,
+                        useExisting: forwardRef(() => NimbleCheckboxControlValueAccessorDirective),
+                        multi: true
+                    }]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the number field.
+ * Directive to provide Angular integration for the checkbox.
  */
-class NimbleNumberFieldDirective {
+class NimbleCheckboxDirective {
 }
-NimbleNumberFieldDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleNumberFieldDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleNumberFieldDirective, selector: "nimble-number-field", inputs: { readonly: "readonly", min: "min", max: "max", step: "step", placeholder: "placeholder" }, host: { properties: { "attr.readonly": "this.readonly", "attr.min": "this.min", "attr.max": "this.max", "attr.step": "this.step", "attr.placeholder": "this.placeholder" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberFieldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-number-field'
-                }]
-        }], propDecorators: { readonly: [{
-                type: HostBinding,
-                args: ['attr.readonly']
-            }, {
-                type: Input
-            }], min: [{
-                type: HostBinding,
-                args: ['attr.min']
-            }, {
-                type: Input
-            }], max: [{
-                type: HostBinding,
-                args: ['attr.max']
-            }, {
-                type: Input
-            }], step: [{
-                type: HostBinding,
-                args: ['attr.step']
-            }, {
-                type: Input
-            }], placeholder: [{
-                type: HostBinding,
-                args: ['attr.placeholder']
-            }, {
-                type: Input
-            }] } });
+NimbleCheckboxDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-checkbox'
+            },] }
+];
 
-class NimbleNumberFieldModule {
+class NimbleCheckboxModule {
 }
-NimbleNumberFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleNumberFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberFieldModule, declarations: [NimbleNumberFieldDirective], imports: [CommonModule, NimbleControlValueAccessorModule], exports: [NimbleNumberFieldDirective, NimbleControlValueAccessorModule] });
-NimbleNumberFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberFieldModule, providers: [], imports: [[CommonModule, NimbleControlValueAccessorModule], NimbleControlValueAccessorModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleNumberFieldModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleNumberFieldDirective],
-                    imports: [CommonModule, NimbleControlValueAccessorModule],
-                    providers: [],
-                    exports: [NimbleNumberFieldDirective, NimbleControlValueAccessorModule]
-                }]
-        }] });
+NimbleCheckboxModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleCheckboxDirective, NimbleCheckboxControlValueAccessorDirective],
+                imports: [CommonModule],
+                exports: [NimbleCheckboxDirective, NimbleCheckboxControlValueAccessorDirective]
+            },] }
+];
 
 /**
- * Directive for Nimble select control Angular integration
+ * Directive to provide Angular integration for the drawer.
  */
-class NimbleSelectDirective {
+class NimbleDrawerDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+        this.stateChange = new EventEmitter();
+    }
+    get location() {
+        return this.elementRef.nativeElement.location;
+    }
+    set location(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'location', value);
+    }
+    get state() {
+        return this.elementRef.nativeElement.state;
+    }
+    set state(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'state', value);
+    }
+    get modal() {
+        return this.elementRef.nativeElement.modal;
+    }
+    set modal(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'modal', toBooleanProperty(value));
+    }
+    show() {
+        this.state = DrawerState.Opening;
+    }
+    hide() {
+        this.state = DrawerState.Closing;
+    }
+    onStateChanged($event) {
+        if ($event.target === this.elementRef.nativeElement) {
+            this.stateChange.emit(this.state);
+        }
+    }
 }
-NimbleSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleSelectDirective, selector: "nimble-select", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-select',
-                }]
-        }] });
+NimbleDrawerDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-drawer'
+            },] }
+];
+NimbleDrawerDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleDrawerDirective.propDecorators = {
+    location: [{ type: Input }],
+    state: [{ type: Input }],
+    modal: [{ type: Input }],
+    stateChange: [{ type: Output }],
+    onStateChanged: [{ type: HostListener, args: ['state-change', ['$event'],] }]
+};
+
+class NimbleDrawerModule {
+}
+NimbleDrawerModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleDrawerDirective],
+                imports: [CommonModule],
+                exports: [NimbleDrawerDirective]
+            },] }
+];
 
 /**
  * Extension of Angular's SelectControlValueAccessor to target the Nimble select control.
@@ -238,412 +244,664 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
  */
 class NimbleSelectControlValueAccessorDirective extends SelectControlValueAccessor {
 }
-NimbleSelectControlValueAccessorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectControlValueAccessorDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NimbleSelectControlValueAccessorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleSelectControlValueAccessorDirective, selector: "nimble-select:not([multiple])[formControlName],nimble-select:not([multiple])[formControl],nimble-select:not([multiple])[ngModel]", host: { listeners: { "change": "onChange($event.target.value)", "blur": "onTouched()" } }, providers: [{
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => NimbleSelectControlValueAccessorDirective),
-            multi: true
-        }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectControlValueAccessorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-select:not([multiple])[formControlName],nimble-select:not([multiple])[formControl],nimble-select:not([multiple])[ngModel]',
-                    // The following host metadata is duplicated from SelectControlValueAccessor
-                    // eslint-disable-next-line @angular-eslint/no-host-metadata-property
-                    host: { '(change)': 'onChange($event.target.value)', '(blur)': 'onTouched()' },
-                    providers: [{
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => NimbleSelectControlValueAccessorDirective),
-                            multi: true
-                        }]
-                }]
-        }] });
-
-class NimbleSelectModule {
-}
-NimbleSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectModule, declarations: [NimbleSelectDirective, NimbleSelectControlValueAccessorDirective], imports: [CommonModule], exports: [NimbleSelectDirective, NimbleSelectControlValueAccessorDirective] });
-NimbleSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleSelectModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleSelectDirective, NimbleSelectControlValueAccessorDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleSelectDirective, NimbleSelectControlValueAccessorDirective]
-                }]
-        }] });
+NimbleSelectControlValueAccessorDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-select:not([multiple])[formControlName],nimble-select:not([multiple])[formControl],nimble-select:not([multiple])[ngModel]',
+                // The following host metadata is duplicated from SelectControlValueAccessor
+                // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+                host: { '(change)': 'onChange($event.target.value)', '(blur)': 'onTouched()' },
+                providers: [{
+                        provide: NG_VALUE_ACCESSOR,
+                        useExisting: forwardRef(() => NimbleSelectControlValueAccessorDirective),
+                        multi: true
+                    }]
+            },] }
+];
 
 /**
  * Directive to provide Angular integration for the listbox option.
  */
 class NimbleListboxOptionDirective extends NgSelectOption {
-    constructor(element, renderer, select) {
-        super(element, renderer, select);
-    }
-}
-NimbleListboxOptionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleListboxOptionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: NimbleSelectControlValueAccessorDirective, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-NimbleListboxOptionDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleListboxOptionDirective, selector: "nimble-listbox-option", inputs: { disabled: "disabled" }, host: { properties: { "attr.disabled": "this.disabled" } }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleListboxOptionDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-listbox-option'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: NimbleSelectControlValueAccessorDirective, decorators: [{
-                    type: Optional
-                }, {
-                    type: Host
-                }] }]; }, propDecorators: { disabled: [{
-                type: HostBinding,
-                args: ['attr.disabled']
-            }, {
-                type: Input
-            }] } });
+    constructor(elementRef, renderer, select) {
+        super(elementRef, renderer, select);
+        this.elementRef = elementRef;
+        this.renderer = renderer;
+    }
+    get disabled() {
+        return this.elementRef.nativeElement.disabled;
+    }
+    set disabled(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', toBooleanProperty(value));
+    }
+}
+NimbleListboxOptionDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-listbox-option'
+            },] }
+];
+NimbleListboxOptionDirective.ctorParameters = () => [
+    { type: ElementRef },
+    { type: Renderer2 },
+    { type: NimbleSelectControlValueAccessorDirective, decorators: [{ type: Inject, args: [NimbleSelectControlValueAccessorDirective,] }, { type: Optional }, { type: Host }] }
+];
+NimbleListboxOptionDirective.propDecorators = {
+    disabled: [{ type: Input }]
+};
 
 class NimbleListboxOptionModule {
 }
-NimbleListboxOptionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleListboxOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleListboxOptionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleListboxOptionModule, declarations: [NimbleListboxOptionDirective], imports: [CommonModule], exports: [NimbleListboxOptionDirective] });
-NimbleListboxOptionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleListboxOptionModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleListboxOptionModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleListboxOptionDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleListboxOptionDirective]
-                }]
-        }] });
+NimbleListboxOptionModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleListboxOptionDirective],
+                imports: [CommonModule],
+                exports: [NimbleListboxOptionDirective]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the button.
+ * Directive to provide Angular integration for the menu.
  */
-class NimbleButtonDirective {
+class NimbleMenuDirective {
 }
-NimbleButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleButtonDirective, selector: "nimble-button", inputs: { disabled: "disabled", appearance: "appearance" }, host: { properties: { "disabled": "this.disabled", "appearance": "this.appearance" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleButtonDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-button'
-                }]
-        }], propDecorators: { disabled: [{
-                type: HostBinding,
-                args: ['disabled']
-            }, {
-                type: Input
-            }], appearance: [{
-                type: HostBinding,
-                args: ['appearance']
-            }, {
-                type: Input
-            }] } });
+NimbleMenuDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-menu'
+            },] }
+];
 
-class NimbleButtonModule {
+class NimbleMenuModule {
 }
-NimbleButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleButtonModule, declarations: [NimbleButtonDirective], imports: [CommonModule], exports: [NimbleButtonDirective] });
-NimbleButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleButtonModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleButtonModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleButtonDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleButtonDirective]
-                }]
-        }] });
+NimbleMenuModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleMenuDirective],
+                imports: [CommonModule],
+                exports: [NimbleMenuDirective]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the tree view.
+ * Directive to provide Angular integration for the menu.
  */
-class NimbleTreeViewDirective {
+class NimbleMenuItemDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get disabled() {
+        return this.elementRef.nativeElement.disabled;
+    }
+    set disabled(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', toBooleanProperty(value));
+    }
+}
+NimbleMenuItemDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-menu-item'
+            },] }
+];
+NimbleMenuItemDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleMenuItemDirective.propDecorators = {
+    disabled: [{ type: Input }]
+};
+
+class NimbleMenuItemModule {
 }
-NimbleTreeViewDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeViewDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTreeViewDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTreeViewDirective, selector: "nimble-tree-view", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeViewDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-tree-view'
-                }]
-        }] });
+NimbleMenuItemModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleMenuItemDirective],
+                imports: [CommonModule],
+                exports: [NimbleMenuItemDirective]
+            },] }
+];
 
-class NimbleTreeViewModule {
+/**
+ * Extension of Angular's NumberValueAccessor to target the number-based inputs.
+ *
+ * Directive decorator based on NumberValueAccessor decorator
+ * https://github.com/angular/angular/blob/master/packages/forms/src/directives/number_value_accessor.ts#L43
+ */
+class NimbleNumberFieldControlValueAccessorDirective extends NumberValueAccessor {
 }
-NimbleTreeViewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTreeViewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeViewModule, declarations: [NimbleTreeViewDirective], imports: [CommonModule], exports: [NimbleTreeViewDirective] });
-NimbleTreeViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeViewModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeViewModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTreeViewDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleTreeViewDirective]
-                }]
-        }] });
+NimbleNumberFieldControlValueAccessorDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-number-field[formControlName],nimble-number-field[formControl],nimble-number-field[ngModel]',
+                // The following host metadata is duplicated from NumberValueAccessor
+                // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+                host: { '(input)': 'onChange($event.target.value)', '(blur)': 'onTouched()' },
+                providers: [{
+                        provide: NG_VALUE_ACCESSOR,
+                        useExisting: forwardRef(() => NimbleNumberFieldControlValueAccessorDirective),
+                        multi: true
+                    }]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the tree item.
+ * Directive to provide Angular integration for the number field.
  */
-class NimbleTreeItemDirective {
-    constructor(treeItemReference) {
-        this.treeItemReference = treeItemReference;
-        this.selectedChange = new EventEmitter();
-        this.expandedChange = new EventEmitter();
+class NimbleNumberFieldDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
     }
-    onSelectedChange($event) {
-        const treeItemElement = this.treeItemReference.nativeElement;
-        if ($event.target === treeItemElement) {
-            this.selected = treeItemElement.selected;
-            this.selectedChange.emit(this.selected);
-        }
+    get readOnly() {
+        return this.elementRef.nativeElement.readOnly;
     }
-    onExpandedChange($event) {
-        const treeItemElement = this.treeItemReference.nativeElement;
-        if ($event.target === treeItemElement) {
-            this.expanded = treeItemElement.expanded;
-            this.expandedChange.emit(treeItemElement.expanded);
-        }
+    // readOnly property maps to the readonly attribute
+    // https://github.com/microsoft/fast/blob/46bb6d9aab2c37105f4434db3795e176c2354a4f/packages/web-components/fast-foundation/src/number-field/number-field.ts#L38
+    // eslint-disable-next-line @angular-eslint/no-input-rename
+    set readOnly(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'readOnly', toBooleanProperty(value));
+    }
+    get min() {
+        return this.elementRef.nativeElement.min;
+    }
+    set min(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'min', toNumberProperty(value));
+    }
+    get max() {
+        return this.elementRef.nativeElement.max;
+    }
+    set max(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'max', toNumberProperty(value));
+    }
+    get step() {
+        return this.elementRef.nativeElement.step;
+    }
+    set step(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'step', toNumberProperty(value));
+    }
+    get placeholder() {
+        return this.elementRef.nativeElement.placeholder;
+    }
+    set placeholder(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'placeholder', value);
     }
 }
-NimbleTreeItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTreeItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTreeItemDirective, selector: "nimble-tree-item", inputs: { disabled: "disabled", expanded: "expanded", selected: "selected" }, outputs: { selectedChange: "selectedChange", expandedChange: "expandedChange" }, host: { listeners: { "selected-change": "onSelectedChange($event)", "expanded-change": "onExpandedChange($event)" }, properties: { "disabled": "this.disabled", "expanded": "this.expanded", "selected": "this.selected", "attr.aria-selected": "this.selected" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeItemDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-tree-item'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { disabled: [{
-                type: HostBinding,
-                args: ['disabled']
-            }, {
-                type: Input
-            }], expanded: [{
-                type: HostBinding,
-                args: ['expanded']
-            }, {
-                type: Input
-            }], selected: [{
-                type: HostBinding,
-                args: ['selected']
-            }, {
-                type: HostBinding,
-                args: ['attr.aria-selected']
-            }, {
-                type: Input
-            }], selectedChange: [{
-                type: Output
-            }], expandedChange: [{
-                type: Output
-            }], onSelectedChange: [{
-                type: HostListener,
-                args: ['selected-change', ['$event']]
-            }], onExpandedChange: [{
-                type: HostListener,
-                args: ['expanded-change', ['$event']]
-            }] } });
+NimbleNumberFieldDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-number-field'
+            },] }
+];
+NimbleNumberFieldDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleNumberFieldDirective.propDecorators = {
+    readOnly: [{ type: Input, args: ['readonly',] }],
+    min: [{ type: Input }],
+    max: [{ type: Input }],
+    step: [{ type: Input }],
+    placeholder: [{ type: Input }]
+};
 
-class NimbleTreeItemModule {
+class NimbleNumberFieldModule {
 }
-NimbleTreeItemModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTreeItemModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeItemModule, declarations: [NimbleTreeItemDirective], imports: [CommonModule], exports: [NimbleTreeItemDirective] });
-NimbleTreeItemModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeItemModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTreeItemModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTreeItemDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleTreeItemDirective]
-                }]
-        }] });
+NimbleNumberFieldModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleNumberFieldDirective, NimbleNumberFieldControlValueAccessorDirective],
+                imports: [CommonModule],
+                exports: [NimbleNumberFieldDirective, NimbleNumberFieldControlValueAccessorDirective]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the checkbox.
+ * Directive for Nimble select control Angular integration
  */
-class NimbleCheckboxDirective {
+class NimbleSelectDirective {
+}
+NimbleSelectDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-select',
+            },] }
+];
+
+class NimbleSelectModule {
 }
-NimbleCheckboxDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleCheckboxDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleCheckboxDirective, selector: "nimble-checkbox", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-checkbox'
-                }]
-        }] });
+NimbleSelectModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleSelectDirective, NimbleSelectControlValueAccessorDirective],
+                imports: [CommonModule],
+                exports: [NimbleSelectDirective, NimbleSelectControlValueAccessorDirective]
+            },] }
+];
 
 /**
- * Extension of Angular's CheckboxControlValueAccessor to target the Nimble checkbox control.
- *
- * Directive decorator based on CheckboxControlValueAccessor decorator
- * https://github.com/angular/angular/blob/master/packages/forms/src/directives/checkbox_value_accessor.ts#L42
+ * Directive to provide Angular integration for the tab element.
  */
-class NimbleCheckboxControlValueAccessorDirective extends CheckboxControlValueAccessor {
+class NimbleTabDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get disabled() {
+        return this.elementRef.nativeElement.disabled;
+    }
+    set disabled(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', toBooleanProperty(value));
+    }
 }
-NimbleCheckboxControlValueAccessorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxControlValueAccessorDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NimbleCheckboxControlValueAccessorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleCheckboxControlValueAccessorDirective, selector: "nimble-checkbox[formControlName],nimble-checkbox[formControl],nimble-checkbox[ngModel]", host: { listeners: { "change": "onChange($event.target.checked)", "blur": "onTouched()" } }, providers: [{
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => NimbleCheckboxControlValueAccessorDirective),
-            multi: true
-        }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxControlValueAccessorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-checkbox[formControlName],nimble-checkbox[formControl],nimble-checkbox[ngModel]',
-                    // The following host metadata is duplicated from CheckboxControlValueAccessor
-                    // eslint-disable-next-line @angular-eslint/no-host-metadata-property
-                    host: { '(change)': 'onChange($event.target.checked)', '(blur)': 'onTouched()' },
-                    providers: [{
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => NimbleCheckboxControlValueAccessorDirective),
-                            multi: true
-                        }]
-                }]
-        }] });
+NimbleTabDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-tab'
+            },] }
+];
+NimbleTabDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleTabDirective.propDecorators = {
+    disabled: [{ type: Input }]
+};
 
-class NimbleCheckboxModule {
+class NimbleTabModule {
 }
-NimbleCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxModule, declarations: [NimbleCheckboxDirective, NimbleCheckboxControlValueAccessorDirective], imports: [CommonModule], exports: [NimbleCheckboxDirective, NimbleCheckboxControlValueAccessorDirective] });
-NimbleCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleCheckboxModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleCheckboxDirective, NimbleCheckboxControlValueAccessorDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleCheckboxDirective, NimbleCheckboxControlValueAccessorDirective]
-                }]
-        }] });
+NimbleTabModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTabDirective],
+                imports: [CommonModule],
+                exports: [NimbleTabDirective]
+            },] }
+];
+
+/**
+ * Directive to provide Angular integration for the tab panel.
+ */
+class NimbleTabPanelDirective {
+}
+NimbleTabPanelDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-tab-panel'
+            },] }
+];
+
+class NimbleTabPanelModule {
+}
+NimbleTabPanelModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTabPanelDirective],
+                imports: [CommonModule],
+                exports: [NimbleTabPanelDirective]
+            },] }
+];
 
 /**
  * Directive to provide Angular integration for the tabs element.
  */
 class NimbleTabsDirective {
-    constructor(tabs) {
-        this.tabs = tabs;
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
         this.activeidChange = new EventEmitter();
     }
-    onChange() {
-        this.activeidChange.emit(this.tabs.nativeElement.activeid);
-    }
-}
-NimbleTabsDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTabsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTabsDirective, selector: "nimble-tabs", inputs: { activeid: "activeid" }, outputs: { activeidChange: "activeidChange" }, host: { listeners: { "change": "onChange()" }, properties: { "attr.activeid": "this.activeid" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-tabs'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { activeid: [{
-                type: HostBinding,
-                args: ['attr.activeid']
-            }, {
-                type: Input
-            }], activeidChange: [{
-                type: Output
-            }], onChange: [{
-                type: HostListener,
-                args: ['change']
-            }] } });
+    get activeid() {
+        return this.elementRef.nativeElement.activeid;
+    }
+    set activeid(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'activeid', value);
+    }
+    onChange($event) {
+        if ($event.target === this.elementRef.nativeElement) {
+            this.activeidChange.emit(this.activeid);
+        }
+    }
+}
+NimbleTabsDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-tabs'
+            },] }
+];
+NimbleTabsDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleTabsDirective.propDecorators = {
+    activeid: [{ type: Input }],
+    activeidChange: [{ type: Output }],
+    onChange: [{ type: HostListener, args: ['change', ['$event'],] }]
+};
 
 class NimbleTabsModule {
 }
-NimbleTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsModule, declarations: [NimbleTabsDirective], imports: [CommonModule], exports: [NimbleTabsDirective] });
-NimbleTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTabsDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleTabsDirective]
-                }]
-        }] });
+NimbleTabsModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTabsDirective],
+                imports: [CommonModule],
+                exports: [NimbleTabsDirective]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the tab element.
+ * Directive to provide Angular integration for the tabs toolbar.
  */
-class NimbleTabDirective {
+class NimbleTabsToolbarDirective {
 }
-NimbleTabDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTabDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTabDirective, selector: "nimble-tab", inputs: { disabled: "disabled" }, host: { properties: { "attr.disabled": "this.disabled" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-tab'
-                }]
-        }], propDecorators: { disabled: [{
-                type: HostBinding,
-                args: ['attr.disabled']
-            }, {
-                type: Input
-            }] } });
+NimbleTabsToolbarDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-tabs-toolbar'
+            },] }
+];
 
-class NimbleTabModule {
+class NimbleTabsToolbarModule {
 }
-NimbleTabModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTabModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabModule, declarations: [NimbleTabDirective], imports: [CommonModule], exports: [NimbleTabDirective] });
-NimbleTabModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTabDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleTabDirective]
-                }]
-        }] });
+NimbleTabsToolbarModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTabsToolbarDirective],
+                imports: [CommonModule],
+                exports: [NimbleTabsToolbarDirective]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the tab panel.
+ * Extension of Angular's DefaultValueAccessor to target the text-based inputs.
+ *
+ * Directive decorator based on DefaultValueAccessor decorator
+ * https://github.com/angular/angular/blob/master/packages/forms/src/directives/default_value_accessor.ts#L72
  */
-class NimbleTabPanelDirective {
+class NimbleTextFieldControlValueAccessorDirective extends DefaultValueAccessor {
 }
-NimbleTabPanelDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabPanelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTabPanelDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTabPanelDirective, selector: "nimble-tab-panel", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabPanelDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-tab-panel'
-                }]
-        }] });
+NimbleTextFieldControlValueAccessorDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-text-field[formControlName],nimble-text-field[formControl],nimble-text-field[ngModel]',
+                // The following host metadata is duplicated from DefaultValueAccessor
+                // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+                host: {
+                    '(input)': '$any(this)._handleInput($event.target.value)',
+                    '(blur)': 'onTouched()',
+                    '(compositionstart)': '$any(this)._compositionStart()',
+                    '(compositionend)': '$any(this)._compositionEnd($event.target.value)'
+                },
+                providers: [{
+                        provide: NG_VALUE_ACCESSOR,
+                        useExisting: forwardRef(() => NimbleTextFieldControlValueAccessorDirective),
+                        multi: true
+                    }]
+            },] }
+];
 
-class NimbleTabPanelModule {
+/**
+ * Directive to provide Angular integration for the text field
+ */
+class NimbleTextFieldDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get readOnly() {
+        return this.elementRef.nativeElement.readOnly;
+    }
+    // readOnly property maps to the readonly attribute
+    // See: https://github.com/microsoft/fast/blob/46bb6d9aab2c37105f4434db3795e176c2354a4f/packages/web-components/fast-foundation/src/text-field/text-field.ts#L33
+    // eslint-disable-next-line @angular-eslint/no-input-rename
+    set readOnly(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'readOnly', toBooleanProperty(value));
+    }
+    get type() {
+        return this.elementRef.nativeElement.type;
+    }
+    set type(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'type', value);
+    }
 }
-NimbleTabPanelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTabPanelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabPanelModule, declarations: [NimbleTabPanelDirective], imports: [CommonModule], exports: [NimbleTabPanelDirective] });
-NimbleTabPanelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabPanelModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabPanelModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTabPanelDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleTabPanelDirective]
-                }]
-        }] });
+NimbleTextFieldDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-text-field'
+            },] }
+];
+NimbleTextFieldDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleTextFieldDirective.propDecorators = {
+    readOnly: [{ type: Input, args: ['readonly',] }],
+    type: [{ type: Input }]
+};
+
+class NimbleTextFieldModule {
+}
+NimbleTextFieldModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTextFieldDirective, NimbleTextFieldControlValueAccessorDirective],
+                imports: [CommonModule],
+                exports: [NimbleTextFieldDirective, NimbleTextFieldControlValueAccessorDirective]
+            },] }
+];
 
 /**
- * Directive to provide Angular integration for the tabs toolbar.
+ * Directive for Angular integration for the theme provider
  */
-class NimbleTabsToolbarDirective {
+class NimbleThemeProviderDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get theme() {
+        return this.elementRef.nativeElement.theme;
+    }
+    set theme(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'theme', value);
+    }
 }
-NimbleTabsToolbarDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsToolbarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NimbleTabsToolbarDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: NimbleTabsToolbarDirective, selector: "nimble-tabs-toolbar", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsToolbarDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'nimble-tabs-toolbar'
-                }]
-        }] });
+NimbleThemeProviderDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-theme-provider'
+            },] }
+];
+NimbleThemeProviderDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleThemeProviderDirective.propDecorators = {
+    theme: [{ type: Input }]
+};
 
-class NimbleTabsToolbarModule {
+class NimbleThemeProviderModule {
+}
+NimbleThemeProviderModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleThemeProviderDirective],
+                imports: [CommonModule],
+                exports: [NimbleThemeProviderDirective]
+            },] }
+];
+
+/**
+ * Directive to provide Angular integration for the toggle button.
+ */
+class NimbleToggleButtonDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get appearance() {
+        return this.elementRef.nativeElement.appearance;
+    }
+    set appearance(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'appearance', value);
+    }
+    get disabled() {
+        return this.elementRef.nativeElement.disabled;
+    }
+    set disabled(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', toBooleanProperty(value));
+    }
+    get contentHidden() {
+        return this.elementRef.nativeElement.contentHidden;
+    }
+    // contentHidden property intentionally maps to the content-hidden attribute
+    // eslint-disable-next-line @angular-eslint/no-input-rename
+    set contentHidden(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'contentHidden', toBooleanProperty(value));
+    }
+    get checked() {
+        return this.elementRef.nativeElement.checked;
+    }
+    set checked(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'checked', toBooleanProperty(value));
+    }
+}
+NimbleToggleButtonDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-toggle-button'
+            },] }
+];
+NimbleToggleButtonDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleToggleButtonDirective.propDecorators = {
+    appearance: [{ type: Input }],
+    disabled: [{ type: Input }],
+    contentHidden: [{ type: Input, args: ['content-hidden',] }],
+    checked: [{ type: Input }]
+};
+
+/**
+ * Extension of Angular's CheckboxControlValueAccessor to target the Nimble toggle button control.
+ *
+ * Directive decorator based on CheckboxControlValueAccessor decorator
+ * https://github.com/angular/angular/blob/bbababe5900ea8f4c8fccd88238f6fe08a2ceb63/packages/forms/src/directives/checkbox_value_accessor.ts#L42
+ */
+class NimbleToggleButtonControlValueAccessorDirective extends CheckboxControlValueAccessor {
+}
+NimbleToggleButtonControlValueAccessorDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-toggle-button[formControlName],nimble-toggle-button[formControl],nimble-toggle-button[ngModel]',
+                // The following host metadata is duplicated from CheckboxControlValueAccessor
+                // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+                host: { '(change)': 'onChange($event.target.checked)', '(blur)': 'onTouched()' },
+                providers: [{
+                        provide: NG_VALUE_ACCESSOR,
+                        useExisting: forwardRef(() => NimbleToggleButtonControlValueAccessorDirective),
+                        multi: true
+                    }]
+            },] }
+];
+
+class NimbleToggleButtonModule {
+}
+NimbleToggleButtonModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleToggleButtonDirective, NimbleToggleButtonControlValueAccessorDirective],
+                imports: [CommonModule],
+                exports: [NimbleToggleButtonDirective, NimbleToggleButtonControlValueAccessorDirective]
+            },] }
+];
+
+/**
+ * Directive to provide Angular integration for the tree item.
+ */
+class NimbleTreeItemDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+        this.expandedChange = new EventEmitter();
+    }
+    get disabled() {
+        return this.elementRef.nativeElement.disabled;
+    }
+    set disabled(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', toBooleanProperty(value));
+    }
+    get expanded() {
+        return this.elementRef.nativeElement.expanded;
+    }
+    set expanded(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'expanded', toBooleanProperty(value));
+    }
+    get selected() {
+        return this.elementRef.nativeElement.selected;
+    }
+    set selected(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'selected', toBooleanProperty(value));
+        // Needed because fast-foundation TreeView sets initial selection with an aria-selected query
+        this.renderer.setAttribute(this.elementRef.nativeElement, 'selected', toBooleanAriaAttribute(value));
+    }
+    onExpandedChange($event) {
+        if ($event.target === this.elementRef.nativeElement) {
+            this.expandedChange.emit(this.expanded);
+        }
+    }
+}
+NimbleTreeItemDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-tree-item'
+            },] }
+];
+NimbleTreeItemDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleTreeItemDirective.propDecorators = {
+    disabled: [{ type: Input }],
+    expanded: [{ type: Input }],
+    selected: [{ type: Input }],
+    expandedChange: [{ type: Output }],
+    onExpandedChange: [{ type: HostListener, args: ['expanded-change', ['$event'],] }]
+};
+
+class NimbleTreeItemModule {
+}
+NimbleTreeItemModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTreeItemDirective],
+                imports: [CommonModule],
+                exports: [NimbleTreeItemDirective]
+            },] }
+];
+
+/**
+ * Directive to provide Angular integration for the tree view.
+ */
+class NimbleTreeViewDirective {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get selectionMode() {
+        return this.elementRef.nativeElement.selectionMode;
+    }
+    // selectionMode property intentionally maps to the selection-mode attribute
+    // eslint-disable-next-line @angular-eslint/no-input-rename
+    set selectionMode(value) {
+        this.renderer.setProperty(this.elementRef.nativeElement, 'selectionMode', value);
+    }
 }
-NimbleTabsToolbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NimbleTabsToolbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsToolbarModule, declarations: [NimbleTabsToolbarDirective], imports: [CommonModule], exports: [NimbleTabsToolbarDirective] });
-NimbleTabsToolbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsToolbarModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NimbleTabsToolbarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NimbleTabsToolbarDirective],
-                    imports: [CommonModule],
-                    exports: [NimbleTabsToolbarDirective]
-                }]
-        }] });
+NimbleTreeViewDirective.decorators = [
+    { type: Directive, args: [{
+                selector: 'nimble-tree-view'
+            },] }
+];
+NimbleTreeViewDirective.ctorParameters = () => [
+    { type: Renderer2 },
+    { type: ElementRef }
+];
+NimbleTreeViewDirective.propDecorators = {
+    selectionMode: [{ type: Input, args: ['selection-mode',] }]
+};
+
+class NimbleTreeViewModule {
+}
+NimbleTreeViewModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [NimbleTreeViewDirective],
+                imports: [CommonModule],
+                exports: [NimbleTreeViewDirective]
+            },] }
+];
+
+/**
+ * Immediately processes all updates in queue.
+ *
+ * Useful for synchronously testing Nimble elements. Call this in fakeAsync tests to
+ * immediately resolve tasks which otherwise would require waiting for an animation
+ * frame. This should also be called after every fakeAsync test to clear the internal
+ * process queue and allow subsequent tests to run normally.
+ */
+const waitForUpdatesAsync = waitForUpdatesAsync$1;
 
 /*
  * Public API Surface of nimble-angular
@@ -653,5 +911,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NimbleButtonDirective, NimbleButtonModule, NimbleCheckboxControlValueAccessorDirective, NimbleCheckboxDirective, NimbleCheckboxModule, NimbleControlValueAccessorModule, NimbleDefaultControlValueAccessorDirective, NimbleListboxOptionDirective, NimbleListboxOptionModule, NimbleNumberControlValueAccessorDirective, NimbleNumberFieldDirective, NimbleNumberFieldModule, NimbleSelectControlValueAccessorDirective, NimbleSelectDirective, NimbleSelectModule, NimbleTabDirective, NimbleTabModule, NimbleTabPanelDirective, NimbleTabPanelModule, NimbleTabsDirective, NimbleTabsModule, NimbleTabsToolbarDirective, NimbleTabsToolbarModule, NimbleTextFieldDirective, NimbleTextFieldModule, NimbleThemeProviderDirective, NimbleThemeProviderModule, NimbleTreeItemDirective, NimbleTreeItemModule, NimbleTreeViewDirective, NimbleTreeViewModule };
+export { NimbleButtonDirective, NimbleButtonModule, NimbleCheckboxControlValueAccessorDirective, NimbleCheckboxDirective, NimbleCheckboxModule, NimbleDrawerDirective, NimbleDrawerModule, NimbleListboxOptionDirective, NimbleListboxOptionModule, NimbleMenuDirective, NimbleMenuItemDirective, NimbleMenuItemModule, NimbleMenuModule, NimbleNumberFieldControlValueAccessorDirective, NimbleNumberFieldDirective, NimbleNumberFieldModule, NimbleSelectControlValueAccessorDirective, NimbleSelectDirective, NimbleSelectModule, NimbleTabDirective, NimbleTabModule, NimbleTabPanelDirective, NimbleTabPanelModule, NimbleTabsDirective, NimbleTabsModule, NimbleTabsToolbarDirective, NimbleTabsToolbarModule, NimbleTextFieldControlValueAccessorDirective, NimbleTextFieldDirective, NimbleTextFieldModule, NimbleThemeProviderDirective, NimbleThemeProviderModule, NimbleToggleButtonDirective, NimbleToggleButtonModule, NimbleTreeItemDirective, NimbleTreeItemModule, NimbleTreeViewDirective, NimbleTreeViewModule, waitForUpdatesAsync, NimbleToggleButtonControlValueAccessorDirective as ɵa };
 //# sourceMappingURL=ni-nimble-angular.js.map