@breadstone/mosaik-elements-angular 0.0.16 → 0.0.18

package/fesm2022/mosaik-elements-angular.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, ChangeDetectorRef, ElementRef, NgZone, EventEmitter, Output, Input, ChangeDetectionStrategy, Component, makeEnvironmentProviders, DestroyRef, Directive, forwardRef, Pipe, ViewChild, ViewEncapsulation, TemplateRef, Injectable, Renderer2, signal, computed, effect } from '@angular/core';
 import { AbsoluteItemElement, AbsoluteElement, AnchorElement, AppHeaderElement, AppElement, AutoCompleteBoxElement, AvatarGroupElement, avatarElementValueAccessor, AvatarElement, BackdropElement, BadgeElement, BannerHeaderElement, BannerSubHeaderElement, BannerElement, BottomSheetElement, BoxElement, BreadcrumbItemElement, BreadcrumbElement, ButtonGroupElement, ButtonElement, CalendarHeaderElement, CalendarItemElement, CalendarSubHeaderElement, calendarElementValueAccessor, CalendarElement, CameraElement, CardActionsElement, CardContentElement, CardFooterElement, CardHeaderElement, CardSubTitleElement, CardTitleElement, CardElement, Carousel2Element, CarouselItem2Element, CarouselItemElement, CarouselElement, CellGroupElement, CellElement, ChartElement, ChatHeaderElement, ChatMarkerElement, ChatMessageAvatarElement, ChatMessageDividerElement, ChatMessageElement, ChatElement, checkBoxGroupElementValueAccessor, CheckBoxGroupElement, checkboxElementValueAccessor, CheckboxElement, CheckmarkElement, ChipElement, chipBoxElementValueAccessor, ChipBoxElement, ChoiceGroupHeaderElement, choiceGroupElementValueAccessor, ChoiceGroupElement, choiceElementValueAccessor, ChoiceElement, CodeElement, ColorAreaElement, ColorPickerElement, ColorSliderElement, ColorSwatchGroupElement, ColorSwatchElement, ColorThumbElement, colorBoxElementValueAccessor, ColorBoxElement, ComboItemElement, comboElementValueAccessor, ComboElement, CommentElement, CompoundButtonElement, CookiesConsentElement, DataListElement, DataTableElement, dateBoxElementValueAccessor, DateBoxElement, dateTimeBoxElementValueAccessor, DateTimeBoxElement, DialogActionsElement, DialogContentElement, DialogFooterElement, DialogHeaderSubTextElement, DialogHeaderTextElement, DialogHeaderElement, DialogElement, DialogHostElement, DisclosureElement, DividerElement, DotElement, DrawerContainerElement, DrawerContentElement, DrawerElement, DropZoneElement, DropDownButtonElement, ElevationElement, EmojiElement, EmptyStateElement, EpgChannelElement, EpgProgramElement, EpgElement, ErrorStateElement, ErrorElement, ExpandableElement, ExpanderGroupElement, ExpanderHeaderElement, ExpanderSubHeaderElement, ExpanderElement, FloatingActionButtonGroupElement, FloatingActionButtonElement, FilePickerElement, FileUploadItemElement, fileUploadElementValueAccessor, FileUploadElement, FlipElement, FloatingTriggerElement, FloatingElement, FocusRingElement, FooterItemGroupElement, FooterItemElement, FooterElement, FormFieldElement, FormElement, GridItemElement, GridElement, HelmetElement, HintElement, IconElement, ImageElement, JumbtronHeaderElement, JumbtronSubHeaderElement, JumbtronElement, KbdShortcutElement, KbdElement, LightChainElement, ListItemGroupElement, ListItemElement, ListElement, MarqueeElement, MasonryElement, MenuItemGroupElement, MenuItemElement, MenuElement, MessageBoxElement, MeterBarElement, MeterRingElement, NumberCounterElement, NumberElement, numberBoxElementValueAccessor, NumberBoxElement, PageContentElement, PageHeaderElement, PagePreContentElement, PagePreHeaderElement, PageElement, PageMenuElement, PaginatorElement, passwordBoxElementValueAccessor, PasswordBoxElement, PatternElement, PersonaElement, PerspectiveElement, pinBoxElementValueAccessor, PinBoxElement, PopupElement, PortalProjectionElement, PortalElement, ProgressBarElement, ProgressRingElement, QRCodeElement, radioGroupElementValueAccessor, RadioGroupElement, radioElementValueAccessor, RadioElement, RatingElement, RepeatButtonElement, ResizeAdornerElement, RibbonElement, richTextBoxElementValueAccessor, RichTextBoxElement, RippleElement, ScaleElement, ScrollElement, searchBoxElementValueAccessor, SearchBoxElement, SegmentItemElement, SegmentElement, SelectItemGroupElement, SelectItemElement, selectElementValueAccessor, SelectElement, signaturePadElementValueAccessor, SignaturePadElement, SkeletonElement, sliderElementValueAccessor, SliderElement, Slider2ThumbElement, Slider2Element, SpacerElement, SplitButtonElement, SplitElement, StackElement, StickyElement, SuccessStateElement, SummaryElement, SwipeElement, TabItemElement, TabPanelElement, TabStripItemElement, TabStripElement, TabElement, TableBodyElement, TableCellElement, TableHeaderElement, TableRowElement, TableElement, TextFormatElement, TextElement, textBoxElementValueAccessor, TextBoxElement, Theme2Element, TickBarElement, TileListItemElement, TileListElement, timeBoxElementValueAccessor, TimeBoxElement, ToastElement, ToggleButtonElement, toggleSwitchElementValueAccessor, ToggleSwitchElement, ToggleTipElement, ToolbarElement, TooltipElement, TreeItemElement, TreeElement, UpDownSpinnerElement, VideoElement, VirtualizeElement, WizardStepElement, WizardElement, WrapElement, EID, Key, ToastServiceLocator } from '@breadstone/mosaik-elements-foundation';
-import { fromEvent, of, isObservable, Subject, BehaviorSubject, filter, takeUntil, from } from 'rxjs';
-import { NgControl, NG_VALUE_ACCESSOR, FormGroup, FormControl, FormArray } from '@angular/forms';
+import { fromEvent, filter, of, isObservable, Subject, BehaviorSubject, takeUntil, from } from 'rxjs';
+import { NgControl, TouchedChangeEvent, NG_VALUE_ACCESSOR, FormGroup, FormControl, FormArray } from '@angular/forms';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
 import { CdkScrollable } from '@angular/cdk/scrolling';
@@ -1353,6 +1353,12 @@ function provideAvatarGroup(config) {
 
 // #region Imports
 // #endregion
+/**
+ * Injection token for the form status host.
+ *
+ * @internal
+ */
+const FORM_STATUS_HOST = new InjectionToken('FormStatusHost');
 /**
  * Matches elements with one or more Angular form state classes:
  * `.ng-invalid`, `.ng-dirty`, or `.ng-touched`.
@@ -1365,29 +1371,51 @@ function provideAvatarGroup(config) {
  */
 class FormStatusDirective {
     // #region Fields
-    _ngControl;
     _element;
+    _host;
+    _ngControl;
     _destroyRef;
     // #endregion
     // #region Ctor
+    /**
+     * Constructs a new instance of the `FormStatusDirective` class.
+     *
+     * @public
+     */
     constructor() {
+        this._element = inject((ElementRef)).nativeElement;
+        this._host = inject(FORM_STATUS_HOST);
         this._destroyRef = inject(DestroyRef);
-        this._element = inject((ElementRef), { self: true }).nativeElement;
         this._ngControl = inject(NgControl, { optional: true });
     }
     // #endregion
     // #region Methods
+    /**
+     * @public
+     */
     ngOnInit() {
-        if (!this._ngControl) {
-            return;
-        }
-        // this._ngControl.valueAccessor = this._element;
-        this._ngControl.statusChanges?.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => {
-            const isInvalid = this._ngControl?.invalid && this._ngControl.touched ? true : false;
-            if ('invalid' in this._element) {
-                this._element.invalid = isInvalid;
-            }
-        });
+        if (this._ngControl?.statusChanges) {
+            this._ngControl.valueAccessor = this._host;
+            // we need to handle the touch event, because when the element will be validated over {@link FormValidator.validate}
+            // it will set the touched state to true.
+            this._ngControl.control?.events
+                .pipe(takeUntilDestroyed(this._destroyRef), filter((x) => x instanceof TouchedChangeEvent && x.touched))
+                .subscribe(() => this.invalidate());
+            // this is the normal way to handle the status changes
+            this._ngControl.statusChanges
+                .pipe(takeUntilDestroyed(this._destroyRef))
+                .subscribe(() => this.invalidate());
+        }
+    }
+    /**
+     * Invalidates the host element by setting the `invalid` property to `true` or `false`.
+     *
+     * @private
+     */
+    invalidate() {
+        if ('invalid' in this._host) {
+            this._host.invalid = this._ngControl?.invalid && this._ngControl.touched ? true : false;
+        }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: FormStatusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: FormStatusDirective, isStandalone: true, selector: ".ng-invalid, .ng-dirty, .ng-touched", ngImport: i0 });
@@ -1594,7 +1622,17 @@ let AvatarComponent = class AvatarComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: AvatarComponent, isStandalone: true, selector: "mosaik-avatar", inputs: { displayMode: "displayMode", hasBadge: "hasBadge", text: "text", textAccessor: "textAccessor", icon: "icon", src: "src", themeName: "themeName", size: "size", appearance: "appearance", variant: "variant", disabled: "disabled", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => AvatarComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: AvatarComponent, isStandalone: true, selector: "mosaik-avatar", inputs: { displayMode: "displayMode", hasBadge: "hasBadge", text: "text", textAccessor: "textAccessor", icon: "icon", src: "src", themeName: "themeName", size: "size", appearance: "appearance", variant: "variant", disabled: "disabled", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => AvatarComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => AvatarComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 AvatarComponent = __decorate$3h([
     ProxyCmp({
@@ -1614,7 +1652,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['displayMode', 'hasBadge', 'text', 'textAccessor', 'icon', 'src', 'themeName', 'size', 'appearance', 'variant', 'disabled', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => AvatarComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => AvatarComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => AvatarComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { displayMode: [{
                 type: Input
@@ -4921,7 +4969,17 @@ let CalendarComponent = class CalendarComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: CalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CalendarComponent, isStandalone: true, selector: "mosaik-calendar", inputs: { intl: "intl", displayDate: "displayDate", displayDateStart: "displayDateStart", displayDateEnd: "displayDateEnd", header: "header", values: "values", view: "view", selectionMode: "selectionMode", blackoutDates: "blackoutDates", specialDates: "specialDates", minDate: "minDate", maxDate: "maxDate", firstDayOfWeek: "firstDayOfWeek", isTodayHighlighted: "isTodayHighlighted", isWeekendHighlighted: "isWeekendHighlighted", showWeekNumbers: "showWeekNumbers", showAdjacent: "showAdjacent", markerHandler: "markerHandler", themeName: "themeName", locale: "locale", appearance: "appearance", disabled: "disabled", invalid: "invalid", value: "value", orientation: "orientation", variant: "variant", fit: "fit", dir: "dir", lang: "lang" }, outputs: { dateChanged: "dateChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CalendarComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CalendarComponent, isStandalone: true, selector: "mosaik-calendar", inputs: { intl: "intl", displayDate: "displayDate", displayDateStart: "displayDateStart", displayDateEnd: "displayDateEnd", header: "header", values: "values", view: "view", selectionMode: "selectionMode", blackoutDates: "blackoutDates", specialDates: "specialDates", minDate: "minDate", maxDate: "maxDate", firstDayOfWeek: "firstDayOfWeek", isTodayHighlighted: "isTodayHighlighted", isWeekendHighlighted: "isWeekendHighlighted", showWeekNumbers: "showWeekNumbers", showAdjacent: "showAdjacent", markerHandler: "markerHandler", themeName: "themeName", locale: "locale", appearance: "appearance", disabled: "disabled", invalid: "invalid", value: "value", orientation: "orientation", variant: "variant", fit: "fit", dir: "dir", lang: "lang" }, outputs: { dateChanged: "dateChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CalendarComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => CalendarComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 CalendarComponent = __decorate$32([
     ProxyCmp({
@@ -4941,7 +4999,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['intl', 'displayDate', 'displayDateStart', 'displayDateEnd', 'header', 'values', 'view', 'selectionMode', 'blackoutDates', 'specialDates', 'minDate', 'maxDate', 'firstDayOfWeek', 'isTodayHighlighted', 'isWeekendHighlighted', 'showWeekNumbers', 'showAdjacent', 'markerHandler', 'themeName', 'locale', 'appearance', 'disabled', 'invalid', 'value', 'orientation', 'variant', 'fit', 'dir', 'lang'],
                     outputs: ['dateChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CalendarComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CalendarComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => CalendarComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { intl: [{
                 type: Input
@@ -9558,7 +9626,17 @@ let CheckBoxGroupComponent = class CheckBoxGroupComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: CheckBoxGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CheckBoxGroupComponent, isStandalone: true, selector: "mosaik-checkbox-group", inputs: { name: "name", required: "required", themeName: "themeName", invalid: "invalid", disabled: "disabled", orientation: "orientation", value: "value", appearance: "appearance", variant: "variant", dir: "dir", lang: "lang" }, outputs: { checkChanged: "checkChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CheckBoxGroupComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CheckBoxGroupComponent, isStandalone: true, selector: "mosaik-checkbox-group", inputs: { name: "name", required: "required", themeName: "themeName", invalid: "invalid", disabled: "disabled", orientation: "orientation", value: "value", appearance: "appearance", variant: "variant", dir: "dir", lang: "lang" }, outputs: { checkChanged: "checkChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CheckBoxGroupComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => CheckBoxGroupComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 CheckBoxGroupComponent = __decorate$2I([
     ProxyCmp({
@@ -9578,7 +9656,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['name', 'required', 'themeName', 'invalid', 'disabled', 'orientation', 'value', 'appearance', 'variant', 'dir', 'lang'],
                     outputs: ['checkChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CheckBoxGroupComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CheckBoxGroupComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => CheckBoxGroupComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { name: [{
                 type: Input
@@ -9855,7 +9943,17 @@ let CheckboxComponent = class CheckboxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CheckboxComponent, isStandalone: true, selector: "mosaik-checkbox", inputs: { labelPosition: "labelPosition", required: "required", name: "name", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", label: "label", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CheckboxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CheckboxComponent, isStandalone: true, selector: "mosaik-checkbox", inputs: { labelPosition: "labelPosition", required: "required", name: "name", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", label: "label", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CheckboxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => CheckboxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 CheckboxComponent = __decorate$2H([
     ProxyCmp({
@@ -9875,7 +9973,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['labelPosition', 'required', 'name', 'themeName', 'invalid', 'value', 'variant', 'appearance', 'disabled', 'label', 'isChecked', 'isThreeState', 'isFocused', 'dir', 'lang'],
                     outputs: ['checked', 'unchecked', 'indeterminate', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CheckboxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CheckboxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => CheckboxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { labelPosition: [{
                 type: Input
@@ -10742,7 +10850,17 @@ let ChipBoxComponent = class ChipBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: ChipBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ChipBoxComponent, isStandalone: true, selector: "mosaik-chipbox", inputs: { required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", isEditable: "isEditable", readonly: "readonly", pressBackspaceToRemove: "pressBackspaceToRemove", chips: "chips", separatorKeys: "separatorKeys", transform: "transform", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { chipAdded: "chipAdded", chipRemoved: "chipRemoved", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ChipBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ChipBoxComponent, isStandalone: true, selector: "mosaik-chipbox", inputs: { required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", isEditable: "isEditable", readonly: "readonly", pressBackspaceToRemove: "pressBackspaceToRemove", chips: "chips", separatorKeys: "separatorKeys", transform: "transform", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { chipAdded: "chipAdded", chipRemoved: "chipRemoved", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ChipBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => ChipBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 ChipBoxComponent = __decorate$2E([
     ProxyCmp({
@@ -10762,7 +10880,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'isEditable', 'readonly', 'pressBackspaceToRemove', 'chips', 'separatorKeys', 'transform', 'themeName', 'isClearable', 'cleared', 'invalid', 'value', 'variant', 'appearance', 'label', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['chipAdded', 'chipRemoved', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ChipBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ChipBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => ChipBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { required: [{
                 type: Input
@@ -11145,7 +11273,17 @@ let ChoiceGroupComponent = class ChoiceGroupComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: ChoiceGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ChoiceGroupComponent, isStandalone: true, selector: "mosaik-choice-group", inputs: { name: "name", required: "required", themeName: "themeName", orientation: "orientation", invalid: "invalid", value: "value", disabled: "disabled", appearance: "appearance", variant: "variant", dir: "dir", lang: "lang" }, outputs: { choiceChanged: "choiceChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ChoiceGroupComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ChoiceGroupComponent, isStandalone: true, selector: "mosaik-choice-group", inputs: { name: "name", required: "required", themeName: "themeName", orientation: "orientation", invalid: "invalid", value: "value", disabled: "disabled", appearance: "appearance", variant: "variant", dir: "dir", lang: "lang" }, outputs: { choiceChanged: "choiceChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ChoiceGroupComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => ChoiceGroupComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 ChoiceGroupComponent = __decorate$2C([
     ProxyCmp({
@@ -11165,7 +11303,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['name', 'required', 'themeName', 'orientation', 'invalid', 'value', 'disabled', 'appearance', 'variant', 'dir', 'lang'],
                     outputs: ['choiceChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ChoiceGroupComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ChoiceGroupComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => ChoiceGroupComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { name: [{
                 type: Input
@@ -11462,7 +11610,17 @@ let ChoiceComponent = class ChoiceComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: ChoiceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ChoiceComponent, isStandalone: true, selector: "mosaik-choice", inputs: { name: "name", additional: "additional", required: "required", icon: "icon", iconPosition: "iconPosition", themeName: "themeName", invalid: "invalid", disabled: "disabled", appearance: "appearance", variant: "variant", label: "label", value: "value", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ChoiceComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ChoiceComponent, isStandalone: true, selector: "mosaik-choice", inputs: { name: "name", additional: "additional", required: "required", icon: "icon", iconPosition: "iconPosition", themeName: "themeName", invalid: "invalid", disabled: "disabled", appearance: "appearance", variant: "variant", label: "label", value: "value", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ChoiceComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => ChoiceComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 ChoiceComponent = __decorate$2B([
     ProxyCmp({
@@ -11482,7 +11640,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['name', 'additional', 'required', 'icon', 'iconPosition', 'themeName', 'invalid', 'disabled', 'appearance', 'variant', 'label', 'value', 'isChecked', 'isThreeState', 'isFocused', 'dir', 'lang'],
                     outputs: ['checked', 'unchecked', 'indeterminate', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ChoiceComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ChoiceComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => ChoiceComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { name: [{
                 type: Input
@@ -13047,7 +13215,17 @@ let ColorBoxComponent = class ColorBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: ColorBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ColorBoxComponent, isStandalone: true, selector: "mosaik-colorbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", swatches: "swatches", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ColorBoxComponent, isStandalone: true, selector: "mosaik-colorbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", swatches: "swatches", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ColorBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => ColorBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 ColorBoxComponent = __decorate$2t([
     ProxyCmp({
@@ -13067,7 +13245,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['readonly', 'required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'swatches', 'themeName', 'isClearable', 'cleared', 'invalid', 'value', 'variant', 'appearance', 'dropDownPlacement', 'dropDownStrategy', 'dropDownDistance', 'dropDownSkidding', 'dropDownStaysOpen', 'maxDropDownHeight', 'isDropDownOpen', 'label', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ColorBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => ColorBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{
                 type: Input
@@ -13726,7 +13914,17 @@ let ComboComponent = class ComboComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: ComboComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ComboComponent, isStandalone: true, selector: "mosaik-combo", inputs: { selectionMode: "selectionMode", placeholder: "placeholder", required: "required", themeName: "themeName", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", appearance: "appearance", variant: "variant", label: "label", isClearable: "isClearable", cleared: "cleared", disabled: "disabled", invalid: "invalid", value: "value", selectedItems: "selectedItems", selectedItem: "selectedItem", dir: "dir", lang: "lang" }, outputs: { selectionChanged: "selectionChanged", itemsChanged: "itemsChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ComboComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ComboComponent, isStandalone: true, selector: "mosaik-combo", inputs: { selectionMode: "selectionMode", placeholder: "placeholder", required: "required", themeName: "themeName", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", appearance: "appearance", variant: "variant", label: "label", isClearable: "isClearable", cleared: "cleared", disabled: "disabled", invalid: "invalid", value: "value", selectedItems: "selectedItems", selectedItem: "selectedItem", dir: "dir", lang: "lang" }, outputs: { selectionChanged: "selectionChanged", itemsChanged: "itemsChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ComboComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => ComboComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 ComboComponent = __decorate$2r([
     ProxyCmp({
@@ -13746,7 +13944,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['selectionMode', 'placeholder', 'required', 'themeName', 'dropDownPlacement', 'dropDownStrategy', 'dropDownDistance', 'dropDownSkidding', 'dropDownStaysOpen', 'maxDropDownHeight', 'isDropDownOpen', 'appearance', 'variant', 'label', 'isClearable', 'cleared', 'disabled', 'invalid', 'value', 'selectedItems', 'selectedItem', 'dir', 'lang'],
                     outputs: ['selectionChanged', 'itemsChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ComboComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ComboComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => ComboComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { selectionMode: [{
                 type: Input
@@ -15499,7 +15707,17 @@ let DateBoxComponent = class DateBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: DateBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: DateBoxComponent, isStandalone: true, selector: "mosaik-datebox", inputs: { displayDate: "displayDate", displayDateStart: "displayDateStart", displayDateEnd: "displayDateEnd", displayValue: "displayValue", values: "values", view: "view", selectionMode: "selectionMode", blackoutDates: "blackoutDates", specialDates: "specialDates", minDate: "minDate", maxDate: "maxDate", firstDayOfWeek: "firstDayOfWeek", isTodayHighlighted: "isTodayHighlighted", isWeekendHighlighted: "isWeekendHighlighted", showWeekNumbers: "showWeekNumbers", markerHandler: "markerHandler", showAdjacent: "showAdjacent", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", placeholder: "placeholder", autocomplete: "autocomplete", format: "format", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", locale: "locale", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => DateBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: DateBoxComponent, isStandalone: true, selector: "mosaik-datebox", inputs: { displayDate: "displayDate", displayDateStart: "displayDateStart", displayDateEnd: "displayDateEnd", displayValue: "displayValue", values: "values", view: "view", selectionMode: "selectionMode", blackoutDates: "blackoutDates", specialDates: "specialDates", minDate: "minDate", maxDate: "maxDate", firstDayOfWeek: "firstDayOfWeek", isTodayHighlighted: "isTodayHighlighted", isWeekendHighlighted: "isWeekendHighlighted", showWeekNumbers: "showWeekNumbers", markerHandler: "markerHandler", showAdjacent: "showAdjacent", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", placeholder: "placeholder", autocomplete: "autocomplete", format: "format", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", locale: "locale", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => DateBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => DateBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 DateBoxComponent = __decorate$2l([
     ProxyCmp({
@@ -15519,7 +15737,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['displayDate', 'displayDateStart', 'displayDateEnd', 'displayValue', 'values', 'view', 'selectionMode', 'blackoutDates', 'specialDates', 'minDate', 'maxDate', 'firstDayOfWeek', 'isTodayHighlighted', 'isWeekendHighlighted', 'showWeekNumbers', 'markerHandler', 'showAdjacent', 'readonly', 'required', 'autofocus', 'name', 'placeholder', 'autocomplete', 'format', 'themeName', 'isClearable', 'cleared', 'locale', 'invalid', 'value', 'variant', 'appearance', 'dropDownPlacement', 'dropDownStrategy', 'dropDownDistance', 'dropDownSkidding', 'dropDownStaysOpen', 'maxDropDownHeight', 'isDropDownOpen', 'label', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => DateBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => DateBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => DateBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { displayDate: [{
                 type: Input
@@ -16158,7 +16386,17 @@ let DateTimeBoxComponent = class DateTimeBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: DateTimeBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: DateTimeBoxComponent, isStandalone: true, selector: "mosaik-datetimebox", inputs: { displayDate: "displayDate", displayDateStart: "displayDateStart", displayDateEnd: "displayDateEnd", displayValue: "displayValue", values: "values", view: "view", blackoutDates: "blackoutDates", specialDates: "specialDates", minDate: "minDate", maxDate: "maxDate", firstDayOfWeek: "firstDayOfWeek", isTodayHighlighted: "isTodayHighlighted", isWeekendHighlighted: "isWeekendHighlighted", showWeekNumbers: "showWeekNumbers", markerHandler: "markerHandler", showAdjacent: "showAdjacent", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", placeholder: "placeholder", autocomplete: "autocomplete", format: "format", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", locale: "locale", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => DateTimeBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: DateTimeBoxComponent, isStandalone: true, selector: "mosaik-datetimebox", inputs: { displayDate: "displayDate", displayDateStart: "displayDateStart", displayDateEnd: "displayDateEnd", displayValue: "displayValue", values: "values", view: "view", blackoutDates: "blackoutDates", specialDates: "specialDates", minDate: "minDate", maxDate: "maxDate", firstDayOfWeek: "firstDayOfWeek", isTodayHighlighted: "isTodayHighlighted", isWeekendHighlighted: "isWeekendHighlighted", showWeekNumbers: "showWeekNumbers", markerHandler: "markerHandler", showAdjacent: "showAdjacent", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", placeholder: "placeholder", autocomplete: "autocomplete", format: "format", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", locale: "locale", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => DateTimeBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => DateTimeBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 DateTimeBoxComponent = __decorate$2k([
     ProxyCmp({
@@ -16178,7 +16416,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['displayDate', 'displayDateStart', 'displayDateEnd', 'displayValue', 'values', 'view', 'blackoutDates', 'specialDates', 'minDate', 'maxDate', 'firstDayOfWeek', 'isTodayHighlighted', 'isWeekendHighlighted', 'showWeekNumbers', 'markerHandler', 'showAdjacent', 'readonly', 'required', 'autofocus', 'name', 'placeholder', 'autocomplete', 'format', 'themeName', 'isClearable', 'cleared', 'locale', 'invalid', 'value', 'variant', 'appearance', 'dropDownPlacement', 'dropDownStrategy', 'dropDownDistance', 'dropDownSkidding', 'dropDownStaysOpen', 'maxDropDownHeight', 'isDropDownOpen', 'label', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => DateTimeBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => DateTimeBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => DateTimeBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { displayDate: [{
                 type: Input
@@ -23099,7 +23347,17 @@ let FileUploadComponent = class FileUploadComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: FileUploadComponent, isStandalone: true, selector: "mosaik-file-upload", inputs: { isDragging: "isDragging", intl: "intl", fileAdded: "fileAdded", fileDeleted: "fileDeleted", fileFailed: "fileFailed", filesChanged: "filesChanged", autoUpload: "autoUpload", view: "view", multiple: "multiple", directory: "directory", accept: "accept", strategy: "strategy", placeholder: "placeholder", maxSize: "maxSize", themeName: "themeName", disabled: "disabled", appearance: "appearance", variant: "variant", invalid: "invalid", value: "value", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => FileUploadComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: FileUploadComponent, isStandalone: true, selector: "mosaik-file-upload", inputs: { isDragging: "isDragging", intl: "intl", fileAdded: "fileAdded", fileDeleted: "fileDeleted", fileFailed: "fileFailed", filesChanged: "filesChanged", autoUpload: "autoUpload", view: "view", multiple: "multiple", directory: "directory", accept: "accept", strategy: "strategy", placeholder: "placeholder", maxSize: "maxSize", themeName: "themeName", disabled: "disabled", appearance: "appearance", variant: "variant", invalid: "invalid", value: "value", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => FileUploadComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => FileUploadComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 FileUploadComponent = __decorate$1O([
     ProxyCmp({
@@ -23119,7 +23377,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['isDragging', 'intl', 'fileAdded', 'fileDeleted', 'fileFailed', 'filesChanged', 'autoUpload', 'view', 'multiple', 'directory', 'accept', 'strategy', 'placeholder', 'maxSize', 'themeName', 'disabled', 'appearance', 'variant', 'invalid', 'value', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => FileUploadComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => FileUploadComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => FileUploadComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { isDragging: [{
                 type: Input
@@ -23823,7 +24091,7 @@ FloatingComponent = __decorate$1L([
     ProxyCmp({
         defineCustomElementFn: () => customElements.define('mosaik-floating', FloatingElement),
         inputs: ['anchor', 'active', 'placement', 'strategy', 'distance', 'skidding', 'arrow', 'arrowPlacement', 'arrowPadding', 'flip', 'flipFallbackPlacements', 'flipBoundary', 'flipPadding', 'flipFallbackStrategy', 'shift', 'shiftBoundary', 'shiftPadding', 'autoSize', 'autoSizeBoundary', 'autoSizePadding', 'sync', 'maxWidth', 'maxHeight', 'isFullScreen', 'themeName', 'enter', 'exit', 'elevation', 'dir', 'lang'],
-        methods: ['open', 'close', 'reposition', 'getScollableElement', 'play', 'adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
+        methods: ['open', 'close', 'reposition', 'getScrollableElement', 'play', 'adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
     }),
     __metadata$1L("design:paramtypes", [])
 ], FloatingComponent);
@@ -30350,7 +30618,17 @@ let NumberBoxComponent = class NumberBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NumberBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: NumberBoxComponent, isStandalone: true, selector: "mosaik-numberbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", keyboard: "keyboard", spinPosition: "spinPosition", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", appearance: "appearance", invalid: "invalid", value: "value", variant: "variant", label: "label", isBusy: "isBusy", step: "step", decimalPlaces: "decimalPlaces", min: "min", max: "max", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { change: "change", input: "input", focus: "focus", blur: "blur", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: NumberBoxComponent, isStandalone: true, selector: "mosaik-numberbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", keyboard: "keyboard", spinPosition: "spinPosition", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", appearance: "appearance", invalid: "invalid", value: "value", variant: "variant", label: "label", isBusy: "isBusy", step: "step", decimalPlaces: "decimalPlaces", min: "min", max: "max", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { change: "change", input: "input", focus: "focus", blur: "blur", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => NumberBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => NumberBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 NumberBoxComponent = __decorate$1f([
     ProxyCmp({
@@ -30370,7 +30648,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['readonly', 'required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'keyboard', 'spinPosition', 'themeName', 'isClearable', 'cleared', 'appearance', 'invalid', 'value', 'variant', 'label', 'isBusy', 'step', 'decimalPlaces', 'min', 'max', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['change', 'input', 'focus', 'blur', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => NumberBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => NumberBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{
                 type: Input
@@ -31865,7 +32153,17 @@ let PasswordBoxComponent = class PasswordBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: PasswordBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: PasswordBoxComponent, isStandalone: true, selector: "mosaik-passwordbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", revealable: "revealable", isReveal: "isReveal", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", label: "label", appearance: "appearance", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { revealed: "revealed", concealed: "concealed", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: PasswordBoxComponent, isStandalone: true, selector: "mosaik-passwordbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", revealable: "revealable", isReveal: "isReveal", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", label: "label", appearance: "appearance", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { revealed: "revealed", concealed: "concealed", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => PasswordBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => PasswordBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 PasswordBoxComponent = __decorate$17([
     ProxyCmp({
@@ -31885,7 +32183,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['readonly', 'required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'revealable', 'isReveal', 'themeName', 'isClearable', 'cleared', 'invalid', 'value', 'variant', 'label', 'appearance', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['revealed', 'concealed', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => PasswordBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => PasswordBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{
                 type: Input
@@ -32940,7 +33248,17 @@ let PinBoxComponent = class PinBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: PinBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: PinBoxComponent, isStandalone: true, selector: "mosaik-pinbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", length: "length", mode: "mode", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PinBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: PinBoxComponent, isStandalone: true, selector: "mosaik-pinbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", length: "length", mode: "mode", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => PinBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => PinBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 PinBoxComponent = __decorate$13([
     ProxyCmp({
@@ -32960,7 +33278,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['readonly', 'required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'length', 'mode', 'themeName', 'invalid', 'value', 'variant', 'appearance', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PinBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => PinBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => PinBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{
                 type: Input
@@ -34535,7 +34863,17 @@ let RadioGroupComponent = class RadioGroupComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: RadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: RadioGroupComponent, isStandalone: true, selector: "mosaik-radio-group", inputs: { name: "name", required: "required", themeName: "themeName", invalid: "invalid", disabled: "disabled", orientation: "orientation", value: "value", appearance: "appearance", variant: "variant", dir: "dir", lang: "lang" }, outputs: { radioChanged: "radioChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: RadioGroupComponent, isStandalone: true, selector: "mosaik-radio-group", inputs: { name: "name", required: "required", themeName: "themeName", invalid: "invalid", disabled: "disabled", orientation: "orientation", value: "value", appearance: "appearance", variant: "variant", dir: "dir", lang: "lang" }, outputs: { radioChanged: "radioChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RadioGroupComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => RadioGroupComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 RadioGroupComponent = __decorate$Y([
     ProxyCmp({
@@ -34555,7 +34893,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['name', 'required', 'themeName', 'invalid', 'disabled', 'orientation', 'value', 'appearance', 'variant', 'dir', 'lang'],
                     outputs: ['radioChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => RadioGroupComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RadioGroupComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => RadioGroupComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { name: [{
                 type: Input
@@ -34832,7 +35180,17 @@ let RadioComponent = class RadioComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: RadioComponent, isStandalone: true, selector: "mosaik-radio", inputs: { labelPosition: "labelPosition", required: "required", name: "name", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", label: "label", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => RadioComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: RadioComponent, isStandalone: true, selector: "mosaik-radio", inputs: { labelPosition: "labelPosition", required: "required", name: "name", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", label: "label", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RadioComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => RadioComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 RadioComponent = __decorate$X([
     ProxyCmp({
@@ -34852,7 +35210,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['labelPosition', 'required', 'name', 'themeName', 'invalid', 'value', 'variant', 'appearance', 'disabled', 'label', 'isChecked', 'isThreeState', 'isFocused', 'dir', 'lang'],
                     outputs: ['checked', 'unchecked', 'indeterminate', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => RadioComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RadioComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => RadioComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { labelPosition: [{
                 type: Input
@@ -36261,7 +36629,17 @@ let RichTextBoxComponent = class RichTextBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: RichTextBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: RichTextBoxComponent, isStandalone: true, selector: "mosaik-richtextbox", inputs: { intl: "intl", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", minlength: "minlength", maxlength: "maxlength", multilineRows: "multilineRows", resize: "resize", showToolbar: "showToolbar", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", appearance: "appearance", variant: "variant", invalid: "invalid", value: "value", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => RichTextBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: RichTextBoxComponent, isStandalone: true, selector: "mosaik-richtextbox", inputs: { intl: "intl", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", minlength: "minlength", maxlength: "maxlength", multilineRows: "multilineRows", resize: "resize", showToolbar: "showToolbar", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", appearance: "appearance", variant: "variant", invalid: "invalid", value: "value", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RichTextBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => RichTextBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 RichTextBoxComponent = __decorate$S([
     ProxyCmp({
@@ -36281,7 +36659,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['intl', 'readonly', 'required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'minlength', 'maxlength', 'multilineRows', 'resize', 'showToolbar', 'themeName', 'isClearable', 'cleared', 'appearance', 'variant', 'invalid', 'value', 'label', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => RichTextBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RichTextBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => RichTextBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { intl: [{
                 type: Input
@@ -37196,7 +37584,17 @@ let SearchBoxComponent = class SearchBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SearchBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SearchBoxComponent, isStandalone: true, selector: "mosaik-searchbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", mode: "mode", delay: "delay", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", isBusy: "isBusy", appearance: "appearance", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { searched: "searched", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SearchBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SearchBoxComponent, isStandalone: true, selector: "mosaik-searchbox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", mode: "mode", delay: "delay", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", invalid: "invalid", value: "value", variant: "variant", isBusy: "isBusy", appearance: "appearance", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { searched: "searched", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SearchBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => SearchBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SearchBoxComponent = __decorate$O([
     ProxyCmp({
@@ -37216,7 +37614,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['readonly', 'required', 'autofocus', 'name', 'pattern', 'placeholder', 'autocomplete', 'mode', 'delay', 'themeName', 'isClearable', 'cleared', 'invalid', 'value', 'variant', 'isBusy', 'appearance', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['searched', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SearchBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SearchBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => SearchBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{
                 type: Input
@@ -38465,7 +38873,17 @@ let SelectComponent = class SelectComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SelectComponent, isStandalone: true, selector: "mosaik-select", inputs: { isEditable: "isEditable", isReadOnly: "isReadOnly", placeholder: "placeholder", required: "required", themeName: "themeName", appearance: "appearance", variant: "variant", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", isClearable: "isClearable", cleared: "cleared", disabled: "disabled", invalid: "invalid", value: "value", selectedItem: "selectedItem", dir: "dir", lang: "lang" }, outputs: { selectionChanged: "selectionChanged", itemsChanged: "itemsChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SelectComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SelectComponent, isStandalone: true, selector: "mosaik-select", inputs: { isEditable: "isEditable", isReadOnly: "isReadOnly", placeholder: "placeholder", required: "required", themeName: "themeName", appearance: "appearance", variant: "variant", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", isClearable: "isClearable", cleared: "cleared", disabled: "disabled", invalid: "invalid", value: "value", selectedItem: "selectedItem", dir: "dir", lang: "lang" }, outputs: { selectionChanged: "selectionChanged", itemsChanged: "itemsChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SelectComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => SelectComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SelectComponent = __decorate$J([
     ProxyCmp({
@@ -38485,7 +38903,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['isEditable', 'isReadOnly', 'placeholder', 'required', 'themeName', 'appearance', 'variant', 'dropDownPlacement', 'dropDownStrategy', 'dropDownDistance', 'dropDownSkidding', 'dropDownStaysOpen', 'maxDropDownHeight', 'isDropDownOpen', 'label', 'isClearable', 'cleared', 'disabled', 'invalid', 'value', 'selectedItem', 'dir', 'lang'],
                     outputs: ['selectionChanged', 'itemsChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SelectComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SelectComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => SelectComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { isEditable: [{
                 type: Input
@@ -38894,7 +39322,17 @@ let SignaturePadComponent = class SignaturePadComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SignaturePadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SignaturePadComponent, isStandalone: true, selector: "mosaik-signaturepad", inputs: { isEmpty: "isEmpty", width: "width", height: "height", placeholder: "placeholder", minDistance: "minDistance", throttle: "throttle", dotSize: "dotSize", minWidth: "minWidth", maxWidth: "maxWidth", velocityFilterWeight: "velocityFilterWeight", backgroundColor: "backgroundColor", penColor: "penColor", required: "required", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", disabled: "disabled", isFocused: "isFocused", variant: "variant", invalid: "invalid", value: "value", label: "label", appearance: "appearance", dir: "dir", lang: "lang" }, outputs: { signStarted: "signStarted", signEnded: "signEnded", signStrokeBeforeUpdated: "signStrokeBeforeUpdated", signStrokeAfterUpdated: "signStrokeAfterUpdated", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SignaturePadComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SignaturePadComponent, isStandalone: true, selector: "mosaik-signaturepad", inputs: { isEmpty: "isEmpty", width: "width", height: "height", placeholder: "placeholder", minDistance: "minDistance", throttle: "throttle", dotSize: "dotSize", minWidth: "minWidth", maxWidth: "maxWidth", velocityFilterWeight: "velocityFilterWeight", backgroundColor: "backgroundColor", penColor: "penColor", required: "required", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", disabled: "disabled", isFocused: "isFocused", variant: "variant", invalid: "invalid", value: "value", label: "label", appearance: "appearance", dir: "dir", lang: "lang" }, outputs: { signStarted: "signStarted", signEnded: "signEnded", signStrokeBeforeUpdated: "signStrokeBeforeUpdated", signStrokeAfterUpdated: "signStrokeAfterUpdated", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SignaturePadComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => SignaturePadComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SignaturePadComponent = __decorate$I([
     ProxyCmp({
@@ -38914,7 +39352,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['isEmpty', 'width', 'height', 'placeholder', 'minDistance', 'throttle', 'dotSize', 'minWidth', 'maxWidth', 'velocityFilterWeight', 'backgroundColor', 'penColor', 'required', 'themeName', 'isClearable', 'cleared', 'disabled', 'isFocused', 'variant', 'invalid', 'value', 'label', 'appearance', 'dir', 'lang'],
                     outputs: ['signStarted', 'signEnded', 'signStrokeBeforeUpdated', 'signStrokeAfterUpdated', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SignaturePadComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SignaturePadComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => SignaturePadComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { isEmpty: [{
                 type: Input
@@ -39447,7 +39895,17 @@ let SliderComponent = class SliderComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SliderComponent, isStandalone: true, selector: "mosaik-slider", inputs: { step: "step", track: "track", ticks: "ticks", tickPlacement: "tickPlacement", showTickLabels: "showTickLabels", tickLabelAccessor: "tickLabelAccessor", tooltipPlacement: "tooltipPlacement", tooltipAccessor: "tooltipAccessor", themeName: "themeName", orientation: "orientation", disabled: "disabled", variant: "variant", appearance: "appearance", isFocused: "isFocused", invalid: "invalid", min: "min", max: "max", value: "value", dir: "dir", lang: "lang" }, outputs: { valueChanged: "valueChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SliderComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: SliderComponent, isStandalone: true, selector: "mosaik-slider", inputs: { step: "step", track: "track", ticks: "ticks", tickPlacement: "tickPlacement", showTickLabels: "showTickLabels", tickLabelAccessor: "tickLabelAccessor", tooltipPlacement: "tooltipPlacement", tooltipAccessor: "tooltipAccessor", themeName: "themeName", orientation: "orientation", disabled: "disabled", variant: "variant", appearance: "appearance", isFocused: "isFocused", invalid: "invalid", min: "min", max: "max", value: "value", dir: "dir", lang: "lang" }, outputs: { valueChanged: "valueChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SliderComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => SliderComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SliderComponent = __decorate$G([
     ProxyCmp({
@@ -39467,7 +39925,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['step', 'track', 'ticks', 'tickPlacement', 'showTickLabels', 'tickLabelAccessor', 'tooltipPlacement', 'tooltipAccessor', 'themeName', 'orientation', 'disabled', 'variant', 'appearance', 'isFocused', 'invalid', 'min', 'max', 'value', 'dir', 'lang'],
                     outputs: ['valueChanged', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SliderComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SliderComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => SliderComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { step: [{
                 type: Input
@@ -44460,7 +44928,17 @@ let TextBoxComponent = class TextBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TextBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: TextBoxComponent, isStandalone: true, selector: "mosaik-textbox", inputs: { multiline: "multiline", multilineRows: "multilineRows", multilineMaxRows: "multilineMaxRows", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", type: "type", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", keyboard: "keyboard", minlength: "minlength", maxlength: "maxlength", resize: "resize", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", appearance: "appearance", variant: "variant", label: "label", invalid: "invalid", value: "value", isBusy: "isBusy", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TextBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: TextBoxComponent, isStandalone: true, selector: "mosaik-textbox", inputs: { multiline: "multiline", multilineRows: "multilineRows", multilineMaxRows: "multilineMaxRows", readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", type: "type", pattern: "pattern", placeholder: "placeholder", autocomplete: "autocomplete", keyboard: "keyboard", minlength: "minlength", maxlength: "maxlength", resize: "resize", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", appearance: "appearance", variant: "variant", label: "label", invalid: "invalid", value: "value", isBusy: "isBusy", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => TextBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => TextBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 TextBoxComponent = __decorate$j([
     ProxyCmp({
@@ -44480,7 +44958,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['multiline', 'multilineRows', 'multilineMaxRows', 'readonly', 'required', 'autofocus', 'name', 'type', 'pattern', 'placeholder', 'autocomplete', 'keyboard', 'minlength', 'maxlength', 'resize', 'themeName', 'isClearable', 'cleared', 'appearance', 'variant', 'label', 'invalid', 'value', 'isBusy', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TextBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => TextBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => TextBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { multiline: [{
                 type: Input
@@ -45747,7 +46235,17 @@ let TimeBoxComponent = class TimeBoxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TimeBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: TimeBoxComponent, isStandalone: true, selector: "mosaik-timebox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", placeholder: "placeholder", autocomplete: "autocomplete", isEditable: "isEditable", interval: "interval", blackoutTimes: "blackoutTimes", specialTimes: "specialTimes", minTime: "minTime", maxTime: "maxTime", markerHandler: "markerHandler", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", locale: "locale", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TimeBoxComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: TimeBoxComponent, isStandalone: true, selector: "mosaik-timebox", inputs: { readonly: "readonly", required: "required", autofocus: "autofocus", name: "name", placeholder: "placeholder", autocomplete: "autocomplete", isEditable: "isEditable", interval: "interval", blackoutTimes: "blackoutTimes", specialTimes: "specialTimes", minTime: "minTime", maxTime: "maxTime", markerHandler: "markerHandler", themeName: "themeName", isClearable: "isClearable", cleared: "cleared", locale: "locale", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", dropDownPlacement: "dropDownPlacement", dropDownStrategy: "dropDownStrategy", dropDownDistance: "dropDownDistance", dropDownSkidding: "dropDownSkidding", dropDownStaysOpen: "dropDownStaysOpen", maxDropDownHeight: "maxDropDownHeight", isDropDownOpen: "isDropDownOpen", label: "label", disabled: "disabled", state: "state", formatter: "formatter", parser: "parser", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => TimeBoxComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => TimeBoxComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 TimeBoxComponent = __decorate$e([
     ProxyCmp({
@@ -45767,7 +46265,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['readonly', 'required', 'autofocus', 'name', 'placeholder', 'autocomplete', 'isEditable', 'interval', 'blackoutTimes', 'specialTimes', 'minTime', 'maxTime', 'markerHandler', 'themeName', 'isClearable', 'cleared', 'locale', 'invalid', 'value', 'variant', 'appearance', 'dropDownPlacement', 'dropDownStrategy', 'dropDownDistance', 'dropDownSkidding', 'dropDownStaysOpen', 'maxDropDownHeight', 'isDropDownOpen', 'label', 'disabled', 'state', 'formatter', 'parser', 'isFocused', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TimeBoxComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => TimeBoxComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => TimeBoxComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{
                 type: Input
@@ -46788,7 +47296,17 @@ let ToggleSwitchComponent = class ToggleSwitchComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: ToggleSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ToggleSwitchComponent, isStandalone: true, selector: "mosaik-toggle-switch", inputs: { labelPosition: "labelPosition", required: "required", name: "name", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", label: "label", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ToggleSwitchComponent), multi: true }], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ToggleSwitchComponent, isStandalone: true, selector: "mosaik-toggle-switch", inputs: { labelPosition: "labelPosition", required: "required", name: "name", themeName: "themeName", invalid: "invalid", value: "value", variant: "variant", appearance: "appearance", disabled: "disabled", label: "label", isChecked: "isChecked", isThreeState: "isThreeState", isFocused: "isFocused", dir: "dir", lang: "lang" }, outputs: { checked: "checked", unchecked: "unchecked", indeterminate: "indeterminate", connected: "connected", disconnected: "disconnected", changed: "changed" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ToggleSwitchComponent),
+                multi: true
+            },
+            {
+                provide: FORM_STATUS_HOST,
+                useExisting: forwardRef(() => ToggleSwitchComponent)
+            }
+        ], hostDirectives: [{ directive: FormStatusDirective }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 ToggleSwitchComponent = __decorate$b([
     ProxyCmp({
@@ -46808,7 +47326,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     inputs: ['labelPosition', 'required', 'name', 'themeName', 'invalid', 'value', 'variant', 'appearance', 'disabled', 'label', 'isChecked', 'isThreeState', 'isFocused', 'dir', 'lang'],
                     outputs: ['checked', 'unchecked', 'indeterminate', 'connected', 'disconnected', 'changed'],
                     hostDirectives: [FormStatusDirective],
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ToggleSwitchComponent), multi: true }]
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ToggleSwitchComponent),
+                            multi: true
+                        },
+                        {
+                            provide: FORM_STATUS_HOST,
+                            useExisting: forwardRef(() => ToggleSwitchComponent)
+                        }
+                    ]
                 }]
         }], ctorParameters: () => [], propDecorators: { labelPosition: [{
                 type: Input
@@ -50621,5 +51149,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ABSOLUTE_DEFAULT_PROPS, ABSOLUTE_ITEM_DEFAULT_PROPS, ANCHOR_DEFAULT_PROPS, APP_DEFAULT_PROPS, APP_HEADER_DEFAULT_PROPS, AUTO_COMPLETE_BOX_DEFAULT_PROPS, AVATAR_DEFAULT_PROPS, AVATAR_GROUP_DEFAULT_PROPS, AbsoluteComponent, AbsoluteItemComponent, AnchorComponent, AppComponent, AppHeaderComponent, AutoCompleteBoxComponent, AvatarComponent, AvatarGroupComponent, BACKDROP_DEFAULT_PROPS, BADGE_DEFAULT_PROPS, BANNER_DEFAULT_PROPS, BANNER_HEADER_DEFAULT_PROPS, BANNER_SUB_HEADER_DEFAULT_PROPS, BOTTOM_SHEET_DEFAULT_PROPS, BOX_DEFAULT_PROPS, BREADCRUMB_DEFAULT_PROPS, BREADCRUMB_ITEM_DEFAULT_PROPS, BUTTON_DEFAULT_PROPS, BUTTON_GROUP_DEFAULT_PROPS, BackdropComponent, BadgeComponent, BannerComponent, BannerHeaderComponent, BannerSubHeaderComponent, BottomSheetComponent, BoxComponent, BreadcrumbComponent, BreadcrumbItemComponent, ButtonComponent, ButtonGroupComponent, CALENDAR_DEFAULT_PROPS, CALENDAR_HEADER_DEFAULT_PROPS, CALENDAR_ITEM_DEFAULT_PROPS, CALENDAR_SUB_HEADER_DEFAULT_PROPS, CAMERA_DEFAULT_PROPS, CARD_ACTIONS_DEFAULT_PROPS, CARD_CONTENT_DEFAULT_PROPS, CARD_DEFAULT_PROPS, CARD_FOOTER_DEFAULT_PROPS, CARD_HEADER_DEFAULT_PROPS, CARD_SUB_TITLE_DEFAULT_PROPS, CARD_TITLE_DEFAULT_PROPS, CAROUSEL2_DEFAULT_PROPS, CAROUSEL_DEFAULT_PROPS, CAROUSEL_ITEM2_DEFAULT_PROPS, CAROUSEL_ITEM_DEFAULT_PROPS, CELL_DEFAULT_PROPS, CELL_GROUP_DEFAULT_PROPS, CHART_DEFAULT_PROPS, CHAT_DEFAULT_PROPS, CHAT_HEADER_DEFAULT_PROPS, CHAT_MARKER_DEFAULT_PROPS, CHAT_MESSAGE_AVATAR_DEFAULT_PROPS, CHAT_MESSAGE_DEFAULT_PROPS, CHAT_MESSAGE_DIVIDER_DEFAULT_PROPS, CHECKBOX_DEFAULT_PROPS, CHECKMARK_DEFAULT_PROPS, CHECK_BOX_GROUP_DEFAULT_PROPS, CHIP_BOX_DEFAULT_PROPS, CHIP_DEFAULT_PROPS, CHOICE_DEFAULT_PROPS, CHOICE_GROUP_DEFAULT_PROPS, CHOICE_GROUP_HEADER_DEFAULT_PROPS, CODE_DEFAULT_PROPS, COLOR_AREA_DEFAULT_PROPS, COLOR_BOX_DEFAULT_PROPS, COLOR_PICKER_DEFAULT_PROPS, COLOR_SLIDER_DEFAULT_PROPS, COLOR_SWATCH_DEFAULT_PROPS, COLOR_SWATCH_GROUP_DEFAULT_PROPS, COLOR_THUMB_DEFAULT_PROPS, COMBO_DEFAULT_PROPS, COMBO_ITEM_DEFAULT_PROPS, COMMENT_DEFAULT_PROPS, COMPOUND_BUTTON_DEFAULT_PROPS, COOKIES_CONSENT_DEFAULT_PROPS, CalendarComponent, CalendarHeaderComponent, CalendarItemComponent, CalendarSubHeaderComponent, CameraComponent, Cancel, CardActionsComponent, CardComponent, CardContentComponent, CardFooterComponent, CardHeaderComponent, CardSubTitleComponent, CardTitleComponent, Carousel2Component, CarouselComponent, CarouselItem2Component, CarouselItemComponent, CellComponent, CellGroupComponent, ChartComponent, ChatComponent, ChatHeaderComponent, ChatMarkerComponent, ChatMessageAvatarComponent, ChatMessageComponent, ChatMessageDividerComponent, CheckBoxGroupComponent, CheckboxComponent, CheckmarkComponent, ChipBoxComponent, ChipComponent, ChoiceComponent, ChoiceGroupComponent, ChoiceGroupHeaderComponent, CodeComponent, ColorAreaComponent, ColorBoxComponent, ColorPickerComponent, ColorSliderComponent, ColorSwatchComponent, ColorSwatchGroupComponent, ColorThumbComponent, ComboComponent, ComboItemComponent, CommentComponent, CompoundButtonComponent, CookiesConsentComponent, DATA_LIST_DEFAULT_PROPS, DATA_TABLE_DEFAULT_PROPS, DATE_BOX_DEFAULT_PROPS, DATE_TIME_BOX_DEFAULT_PROPS, DIALOG_ACTIONS_DEFAULT_PROPS, DIALOG_CONFIG, DIALOG_CONTENT_DEFAULT_PROPS, DIALOG_DEFAULT_PROPS, DIALOG_FOOTER_DEFAULT_PROPS, DIALOG_HEADER_DEFAULT_PROPS, DIALOG_HEADER_SUB_TEXT_DEFAULT_PROPS, DIALOG_HEADER_TEXT_DEFAULT_PROPS, DIALOG_HOST_DEFAULT_PROPS, DIALOG_REF, DIALOG_REF_DATA, DISCLOSURE_DEFAULT_PROPS, DIVIDER_DEFAULT_PROPS, DOT_DEFAULT_PROPS, DRAWER_CONTAINER_DEFAULT_PROPS, DRAWER_CONTENT_DEFAULT_PROPS, DRAWER_DEFAULT_PROPS, DROP_DOWN_BUTTON_DEFAULT_PROPS, DROP_ZONE_DEFAULT_PROPS, DataListComponent, DataTableComponent, DateBoxComponent, DateTimeBoxComponent, DialogActionsComponent, DialogComponent, DialogContentComponent, DialogFooterComponent, DialogHeaderComponent, DialogHeaderSubTextComponent, DialogHeaderTextComponent, DialogHostComponent, DialogPortalComponent, DialogRef, DialogService, DisclosureComponent, DividerComponent, DotComponent, DrawerComponent, DrawerContainerComponent, DrawerContentComponent, DropDownButtonComponent, DropZoneComponent, ELEVATION_DEFAULT_PROPS, EMOJI_DEFAULT_PROPS, EMPTY_STATE_DEFAULT_PROPS, EPG_CHANNEL_DEFAULT_PROPS, EPG_DEFAULT_PROPS, EPG_PROGRAM_DEFAULT_PROPS, ERROR_DEFAULT_PROPS, ERROR_STATE_DEFAULT_PROPS, EXPANDABLE_DEFAULT_PROPS, EXPANDER_DEFAULT_PROPS, EXPANDER_GROUP_DEFAULT_PROPS, EXPANDER_HEADER_DEFAULT_PROPS, EXPANDER_SUB_HEADER_DEFAULT_PROPS, ElevationComponent, EmojiComponent, EmptyStateComponent, EpgChannelComponent, EpgComponent, EpgProgramComponent, ErrorComponent, ErrorStateComponent, ExpandableComponent, ExpanderComponent, ExpanderGroupComponent, ExpanderHeaderComponent, ExpanderSubHeaderComponent, FILE_PICKER_DEFAULT_PROPS, FILE_UPLOAD_DEFAULT_PROPS, FILE_UPLOAD_ITEM_DEFAULT_PROPS, FLIP_DEFAULT_PROPS, FLOATING_ACTION_BUTTON_DEFAULT_PROPS, FLOATING_ACTION_BUTTON_GROUP_DEFAULT_PROPS, FLOATING_DEFAULT_PROPS, FLOATING_TRIGGER_DEFAULT_PROPS, FOCUS_RING_DEFAULT_PROPS, FOOTER_DEFAULT_PROPS, FOOTER_ITEM_DEFAULT_PROPS, FOOTER_ITEM_GROUP_DEFAULT_PROPS, FORM_DEFAULT_PROPS, FORM_FIELD_DEFAULT_PROPS, FilePickerComponent, FileUploadComponent, FileUploadItemComponent, FlipComponent, FloatingActionButtonComponent, FloatingActionButtonGroupComponent, FloatingComponent, FloatingTriggerComponent, FocusRingComponent, FooterComponent, FooterItemComponent, FooterItemGroupComponent, FormComponent, FormFieldComponent, FormStatusDirective, FormValidator, GRID_DEFAULT_PROPS, GRID_ITEM_DEFAULT_PROPS, GridComponent, GridItemComponent, HELMET_DEFAULT_PROPS, HINT_DEFAULT_PROPS, HelmetComponent, HintComponent, ICON_DEFAULT_PROPS, IMAGE_DEFAULT_PROPS, IconComponent, ImageComponent, JUMBTRON_DEFAULT_PROPS, JUMBTRON_HEADER_DEFAULT_PROPS, JUMBTRON_SUB_HEADER_DEFAULT_PROPS, JumbtronComponent, JumbtronHeaderComponent, JumbtronSubHeaderComponent, KBD_DEFAULT_PROPS, KBD_SHORTCUT_DEFAULT_PROPS, KbdComponent, KbdShortcutComponent, LIGHT_CHAIN_DEFAULT_PROPS, LIST_DEFAULT_PROPS, LIST_ITEM_DEFAULT_PROPS, LIST_ITEM_GROUP_DEFAULT_PROPS, LightChainComponent, ListComponent, ListItemComponent, ListItemGroupComponent, MARQUEE_DEFAULT_PROPS, MASONRY_DEFAULT_PROPS, MENU_DEFAULT_PROPS, MENU_ITEM_DEFAULT_PROPS, MENU_ITEM_GROUP_DEFAULT_PROPS, MESSAGE_BOX_DEFAULT_PROPS, METER_BAR_DEFAULT_PROPS, METER_RING_DEFAULT_PROPS, MarqueeComponent, MasonryComponent, MenuComponent, MenuItemComponent, MenuItemGroupComponent, MessageBoxComponent, MeterBarComponent, MeterRingComponent, NUMBER_BOX_DEFAULT_PROPS, NUMBER_COUNTER_DEFAULT_PROPS, NUMBER_DEFAULT_PROPS, NumberBoxComponent, NumberComponent, NumberCounterComponent, PAGE_CONTENT_DEFAULT_PROPS, PAGE_DEFAULT_PROPS, PAGE_HEADER_DEFAULT_PROPS, PAGE_MENU_DEFAULT_PROPS, PAGE_PRE_CONTENT_DEFAULT_PROPS, PAGE_PRE_HEADER_DEFAULT_PROPS, PAGINATOR_DEFAULT_PROPS, PASSWORD_BOX_DEFAULT_PROPS, PATTERN_DEFAULT_PROPS, PERSONA_DEFAULT_PROPS, PERSPECTIVE_DEFAULT_PROPS, PIN_BOX_DEFAULT_PROPS, POPUP_DEFAULT_PROPS, PORTAL_DEFAULT_PROPS, PORTAL_PROJECTION_DEFAULT_PROPS, PROGRESS_BAR_DEFAULT_PROPS, PROGRESS_RING_DEFAULT_PROPS, PageComponent, PageContentComponent, PageHeaderComponent, PageMenuComponent, PagePreContentComponent, PagePreHeaderComponent, PaginatorComponent, PasswordBoxComponent, PatternComponent, PersonaComponent, PerspectiveComponent, PinBoxComponent, PopupComponent, PortalComponent$1 as PortalComponent, PortalProjectionComponent, ProgressBarComponent, ProgressRingComponent, QRCODE_DEFAULT_PROPS, QRCodeComponent, RADIO_DEFAULT_PROPS, RADIO_GROUP_DEFAULT_PROPS, RATING_DEFAULT_PROPS, REPEAT_BUTTON_DEFAULT_PROPS, RESIZE_ADORNER_DEFAULT_PROPS, RIBBON_DEFAULT_PROPS, RICH_TEXT_BOX_DEFAULT_PROPS, RIPPLE_DEFAULT_PROPS, RadioComponent, RadioGroupComponent, RatingComponent, RepeatButtonComponent, ResizeAdornerComponent, RibbonComponent, RichTextBoxComponent, RippleComponent, SCALE_DEFAULT_PROPS, SCROLL_DEFAULT_PROPS, SEARCH_BOX_DEFAULT_PROPS, SEGMENT_DEFAULT_PROPS, SEGMENT_ITEM_DEFAULT_PROPS, SELECT_DEFAULT_PROPS, SELECT_ITEM_DEFAULT_PROPS, SELECT_ITEM_GROUP_DEFAULT_PROPS, SIGNATURE_PAD_DEFAULT_PROPS, SKELETON_DEFAULT_PROPS, SLIDER2THUMB_DEFAULT_PROPS, SLIDER2_DEFAULT_PROPS, SLIDER_DEFAULT_PROPS, SPACER_DEFAULT_PROPS, SPLIT_BUTTON_DEFAULT_PROPS, SPLIT_DEFAULT_PROPS, STACK_DEFAULT_PROPS, STICKY_DEFAULT_PROPS, SUCCESS_STATE_DEFAULT_PROPS, SUMMARY_DEFAULT_PROPS, SWIPE_DEFAULT_PROPS, ScaleComponent, ScrollComponent, SearchBoxComponent, SegmentComponent, SegmentItemComponent, SelectComponent, SelectItemComponent, SelectItemGroupComponent, SignaturePadComponent, SkeletonComponent, Slider2Component, Slider2ThumbComponent, SliderComponent, SpacerComponent, SplitButtonComponent, SplitComponent, StackComponent, StickyComponent, SuccessStateComponent, SummaryComponent, SwipeComponent, TABLE_BODY_DEFAULT_PROPS, TABLE_CELL_DEFAULT_PROPS, TABLE_DEFAULT_PROPS, TABLE_HEADER_DEFAULT_PROPS, TABLE_ROW_DEFAULT_PROPS, TAB_DEFAULT_PROPS, TAB_ITEM_DEFAULT_PROPS, TAB_PANEL_DEFAULT_PROPS, TAB_STRIP_DEFAULT_PROPS, TAB_STRIP_ITEM_DEFAULT_PROPS, TEXT_BOX_DEFAULT_PROPS, TEXT_DEFAULT_PROPS, TEXT_FORMAT_DEFAULT_PROPS, THEME2_DEFAULT_PROPS, TICK_BAR_DEFAULT_PROPS, TILE_LIST_DEFAULT_PROPS, TILE_LIST_ITEM_DEFAULT_PROPS, TIME_BOX_DEFAULT_PROPS, TOAST_DEFAULT_PROPS, TOGGLE_BUTTON_DEFAULT_PROPS, TOGGLE_SWITCH_DEFAULT_PROPS, TOGGLE_TIP_DEFAULT_PROPS, TOOLBAR_DEFAULT_PROPS, TOOLTIP_DEFAULT_PROPS, TREE_DEFAULT_PROPS, TREE_ITEM_DEFAULT_PROPS, TabComponent, TabItemComponent, TabPanelComponent, TabStripComponent, TabStripItemComponent, TableBodyComponent, TableCellComponent, TableComponent, TableHeaderComponent, TableRowComponent, TextBoxComponent, TextComponent, TextFormatComponent, Theme2Component, TickBarComponent, TileListComponent, TileListItemComponent, TimeBoxComponent, ToastComponent, ToastService, ToggleButtonComponent, ToggleSwitchComponent, ToggleTipComponent, ToolbarComponent, TooltipComponent, TreeComponent, TreeItemComponent, TypographyDirective, UP_DOWN_SPINNER_DEFAULT_PROPS, UpDownSpinnerComponent, VIDEO_DEFAULT_PROPS, VIRTUALIZE_DEFAULT_PROPS, VideoComponent, VirtualizeComponent, WIZARD_DEFAULT_PROPS, WIZARD_STEP_DEFAULT_PROPS, WRAP_DEFAULT_PROPS, WizardComponent, WizardStepComponent, WrapComponent, provideAbsolute, provideAbsoluteItem, provideAnchor, provideApp, provideAppHeader, provideAutoCompleteBox, provideAvatar, provideAvatarGroup, provideBackdrop, provideBadge, provideBanner, provideBannerHeader, provideBannerSubHeader, provideBottomSheet, provideBox, provideBreadcrumb, provideBreadcrumbItem, provideButton, provideButtonGroup, provideCalendar, provideCalendarHeader, provideCalendarItem, provideCalendarSubHeader, provideCamera, provideCard, provideCardActions, provideCardContent, provideCardFooter, provideCardHeader, provideCardSubTitle, provideCardTitle, provideCarousel, provideCarousel2, provideCarouselItem, provideCarouselItem2, provideCell, provideCellGroup, provideChart, provideChat, provideChatHeader, provideChatMarker, provideChatMessage, provideChatMessageAvatar, provideChatMessageDivider, provideCheckBoxGroup, provideCheckbox, provideCheckmark, provideChip, provideChipBox, provideChoice, provideChoiceGroup, provideChoiceGroupHeader, provideCode, provideColorArea, provideColorBox, provideColorPicker, provideColorSlider, provideColorSwatch, provideColorSwatchGroup, provideColorThumb, provideCombo, provideComboItem, provideComment, provideCompoundButton, provideCookiesConsent, provideDataList, provideDataTable, provideDateBox, provideDateTimeBox, provideDialog, provideDialogActions, provideDialogContent, provideDialogFooter, provideDialogHeader, provideDialogHeaderSubText, provideDialogHeaderText, provideDialogHost, provideDisclosure, provideDivider, provideDot, provideDrawer, provideDrawerContainer, provideDrawerContent, provideDropDownButton, provideDropZone, provideElevation, provideEmoji, provideEmptyState, provideEpg, provideEpgChannel, provideEpgProgram, provideError, provideErrorState, provideExpandable, provideExpander, provideExpanderGroup, provideExpanderHeader, provideExpanderSubHeader, provideFilePicker, provideFileUpload, provideFileUploadItem, provideFlip, provideFloating, provideFloatingActionButton, provideFloatingActionButtonGroup, provideFloatingTrigger, provideFocusRing, provideFooter, provideFooterItem, provideFooterItemGroup, provideForm, provideFormField, provideGrid, provideGridItem, provideHelmet, provideHint, provideIcon, provideImage, provideJumbtron, provideJumbtronHeader, provideJumbtronSubHeader, provideKbd, provideKbdShortcut, provideLightChain, provideList, provideListItem, provideListItemGroup, provideMarquee, provideMasonry, provideMenu, provideMenuItem, provideMenuItemGroup, provideMessageBox, provideMeterBar, provideMeterRing, provideNumber, provideNumberBox, provideNumberCounter, providePage, providePageContent, providePageHeader, providePageMenu, providePagePreContent, providePagePreHeader, providePaginator, providePasswordBox, providePattern, providePersona, providePerspective, providePinBox, providePopup, providePortal, providePortalProjection, provideProgressBar, provideProgressRing, provideQRCode, provideRadio, provideRadioGroup, provideRating, provideRepeatButton, provideResizeAdorner, provideRibbon, provideRichTextBox, provideRipple, provideScale, provideScroll, provideSearchBox, provideSegment, provideSegmentItem, provideSelect, provideSelectItem, provideSelectItemGroup, provideSignaturePad, provideSkeleton, provideSlider, provideSlider2, provideSlider2Thumb, provideSpacer, provideSplit, provideSplitButton, provideStack, provideSticky, provideSuccessState, provideSummary, provideSwipe, provideTab, provideTabItem, provideTabPanel, provideTabStrip, provideTabStripItem, provideTable, provideTableBody, provideTableCell, provideTableHeader, provideTableRow, provideText, provideTextBox, provideTextFormat, provideTheme2, provideTickBar, provideTileList, provideTileListItem, provideTimeBox, provideToast, provideToggleButton, provideToggleSwitch, provideToggleTip, provideToolbar, provideTooltip, provideTree, provideTreeItem, provideUpDownSpinner, provideVideo, provideVirtualize, provideWizard, provideWizardStep, provideWrap };
+export { ABSOLUTE_DEFAULT_PROPS, ABSOLUTE_ITEM_DEFAULT_PROPS, ANCHOR_DEFAULT_PROPS, APP_DEFAULT_PROPS, APP_HEADER_DEFAULT_PROPS, AUTO_COMPLETE_BOX_DEFAULT_PROPS, AVATAR_DEFAULT_PROPS, AVATAR_GROUP_DEFAULT_PROPS, AbsoluteComponent, AbsoluteItemComponent, AnchorComponent, AppComponent, AppHeaderComponent, AutoCompleteBoxComponent, AvatarComponent, AvatarGroupComponent, BACKDROP_DEFAULT_PROPS, BADGE_DEFAULT_PROPS, BANNER_DEFAULT_PROPS, BANNER_HEADER_DEFAULT_PROPS, BANNER_SUB_HEADER_DEFAULT_PROPS, BOTTOM_SHEET_DEFAULT_PROPS, BOX_DEFAULT_PROPS, BREADCRUMB_DEFAULT_PROPS, BREADCRUMB_ITEM_DEFAULT_PROPS, BUTTON_DEFAULT_PROPS, BUTTON_GROUP_DEFAULT_PROPS, BackdropComponent, BadgeComponent, BannerComponent, BannerHeaderComponent, BannerSubHeaderComponent, BottomSheetComponent, BoxComponent, BreadcrumbComponent, BreadcrumbItemComponent, ButtonComponent, ButtonGroupComponent, CALENDAR_DEFAULT_PROPS, CALENDAR_HEADER_DEFAULT_PROPS, CALENDAR_ITEM_DEFAULT_PROPS, CALENDAR_SUB_HEADER_DEFAULT_PROPS, CAMERA_DEFAULT_PROPS, CARD_ACTIONS_DEFAULT_PROPS, CARD_CONTENT_DEFAULT_PROPS, CARD_DEFAULT_PROPS, CARD_FOOTER_DEFAULT_PROPS, CARD_HEADER_DEFAULT_PROPS, CARD_SUB_TITLE_DEFAULT_PROPS, CARD_TITLE_DEFAULT_PROPS, CAROUSEL2_DEFAULT_PROPS, CAROUSEL_DEFAULT_PROPS, CAROUSEL_ITEM2_DEFAULT_PROPS, CAROUSEL_ITEM_DEFAULT_PROPS, CELL_DEFAULT_PROPS, CELL_GROUP_DEFAULT_PROPS, CHART_DEFAULT_PROPS, CHAT_DEFAULT_PROPS, CHAT_HEADER_DEFAULT_PROPS, CHAT_MARKER_DEFAULT_PROPS, CHAT_MESSAGE_AVATAR_DEFAULT_PROPS, CHAT_MESSAGE_DEFAULT_PROPS, CHAT_MESSAGE_DIVIDER_DEFAULT_PROPS, CHECKBOX_DEFAULT_PROPS, CHECKMARK_DEFAULT_PROPS, CHECK_BOX_GROUP_DEFAULT_PROPS, CHIP_BOX_DEFAULT_PROPS, CHIP_DEFAULT_PROPS, CHOICE_DEFAULT_PROPS, CHOICE_GROUP_DEFAULT_PROPS, CHOICE_GROUP_HEADER_DEFAULT_PROPS, CODE_DEFAULT_PROPS, COLOR_AREA_DEFAULT_PROPS, COLOR_BOX_DEFAULT_PROPS, COLOR_PICKER_DEFAULT_PROPS, COLOR_SLIDER_DEFAULT_PROPS, COLOR_SWATCH_DEFAULT_PROPS, COLOR_SWATCH_GROUP_DEFAULT_PROPS, COLOR_THUMB_DEFAULT_PROPS, COMBO_DEFAULT_PROPS, COMBO_ITEM_DEFAULT_PROPS, COMMENT_DEFAULT_PROPS, COMPOUND_BUTTON_DEFAULT_PROPS, COOKIES_CONSENT_DEFAULT_PROPS, CalendarComponent, CalendarHeaderComponent, CalendarItemComponent, CalendarSubHeaderComponent, CameraComponent, Cancel, CardActionsComponent, CardComponent, CardContentComponent, CardFooterComponent, CardHeaderComponent, CardSubTitleComponent, CardTitleComponent, Carousel2Component, CarouselComponent, CarouselItem2Component, CarouselItemComponent, CellComponent, CellGroupComponent, ChartComponent, ChatComponent, ChatHeaderComponent, ChatMarkerComponent, ChatMessageAvatarComponent, ChatMessageComponent, ChatMessageDividerComponent, CheckBoxGroupComponent, CheckboxComponent, CheckmarkComponent, ChipBoxComponent, ChipComponent, ChoiceComponent, ChoiceGroupComponent, ChoiceGroupHeaderComponent, CodeComponent, ColorAreaComponent, ColorBoxComponent, ColorPickerComponent, ColorSliderComponent, ColorSwatchComponent, ColorSwatchGroupComponent, ColorThumbComponent, ComboComponent, ComboItemComponent, CommentComponent, CompoundButtonComponent, CookiesConsentComponent, DATA_LIST_DEFAULT_PROPS, DATA_TABLE_DEFAULT_PROPS, DATE_BOX_DEFAULT_PROPS, DATE_TIME_BOX_DEFAULT_PROPS, DIALOG_ACTIONS_DEFAULT_PROPS, DIALOG_CONFIG, DIALOG_CONTENT_DEFAULT_PROPS, DIALOG_DEFAULT_PROPS, DIALOG_FOOTER_DEFAULT_PROPS, DIALOG_HEADER_DEFAULT_PROPS, DIALOG_HEADER_SUB_TEXT_DEFAULT_PROPS, DIALOG_HEADER_TEXT_DEFAULT_PROPS, DIALOG_HOST_DEFAULT_PROPS, DIALOG_REF, DIALOG_REF_DATA, DISCLOSURE_DEFAULT_PROPS, DIVIDER_DEFAULT_PROPS, DOT_DEFAULT_PROPS, DRAWER_CONTAINER_DEFAULT_PROPS, DRAWER_CONTENT_DEFAULT_PROPS, DRAWER_DEFAULT_PROPS, DROP_DOWN_BUTTON_DEFAULT_PROPS, DROP_ZONE_DEFAULT_PROPS, DataListComponent, DataTableComponent, DateBoxComponent, DateTimeBoxComponent, DialogActionsComponent, DialogComponent, DialogContentComponent, DialogFooterComponent, DialogHeaderComponent, DialogHeaderSubTextComponent, DialogHeaderTextComponent, DialogHostComponent, DialogPortalComponent, DialogRef, DialogService, DisclosureComponent, DividerComponent, DotComponent, DrawerComponent, DrawerContainerComponent, DrawerContentComponent, DropDownButtonComponent, DropZoneComponent, ELEVATION_DEFAULT_PROPS, EMOJI_DEFAULT_PROPS, EMPTY_STATE_DEFAULT_PROPS, EPG_CHANNEL_DEFAULT_PROPS, EPG_DEFAULT_PROPS, EPG_PROGRAM_DEFAULT_PROPS, ERROR_DEFAULT_PROPS, ERROR_STATE_DEFAULT_PROPS, EXPANDABLE_DEFAULT_PROPS, EXPANDER_DEFAULT_PROPS, EXPANDER_GROUP_DEFAULT_PROPS, EXPANDER_HEADER_DEFAULT_PROPS, EXPANDER_SUB_HEADER_DEFAULT_PROPS, ElevationComponent, EmojiComponent, EmptyStateComponent, EpgChannelComponent, EpgComponent, EpgProgramComponent, ErrorComponent, ErrorStateComponent, ExpandableComponent, ExpanderComponent, ExpanderGroupComponent, ExpanderHeaderComponent, ExpanderSubHeaderComponent, FILE_PICKER_DEFAULT_PROPS, FILE_UPLOAD_DEFAULT_PROPS, FILE_UPLOAD_ITEM_DEFAULT_PROPS, FLIP_DEFAULT_PROPS, FLOATING_ACTION_BUTTON_DEFAULT_PROPS, FLOATING_ACTION_BUTTON_GROUP_DEFAULT_PROPS, FLOATING_DEFAULT_PROPS, FLOATING_TRIGGER_DEFAULT_PROPS, FOCUS_RING_DEFAULT_PROPS, FOOTER_DEFAULT_PROPS, FOOTER_ITEM_DEFAULT_PROPS, FOOTER_ITEM_GROUP_DEFAULT_PROPS, FORM_DEFAULT_PROPS, FORM_FIELD_DEFAULT_PROPS, FORM_STATUS_HOST, FilePickerComponent, FileUploadComponent, FileUploadItemComponent, FlipComponent, FloatingActionButtonComponent, FloatingActionButtonGroupComponent, FloatingComponent, FloatingTriggerComponent, FocusRingComponent, FooterComponent, FooterItemComponent, FooterItemGroupComponent, FormComponent, FormFieldComponent, FormStatusDirective, FormValidator, GRID_DEFAULT_PROPS, GRID_ITEM_DEFAULT_PROPS, GridComponent, GridItemComponent, HELMET_DEFAULT_PROPS, HINT_DEFAULT_PROPS, HelmetComponent, HintComponent, ICON_DEFAULT_PROPS, IMAGE_DEFAULT_PROPS, IconComponent, ImageComponent, JUMBTRON_DEFAULT_PROPS, JUMBTRON_HEADER_DEFAULT_PROPS, JUMBTRON_SUB_HEADER_DEFAULT_PROPS, JumbtronComponent, JumbtronHeaderComponent, JumbtronSubHeaderComponent, KBD_DEFAULT_PROPS, KBD_SHORTCUT_DEFAULT_PROPS, KbdComponent, KbdShortcutComponent, LIGHT_CHAIN_DEFAULT_PROPS, LIST_DEFAULT_PROPS, LIST_ITEM_DEFAULT_PROPS, LIST_ITEM_GROUP_DEFAULT_PROPS, LightChainComponent, ListComponent, ListItemComponent, ListItemGroupComponent, MARQUEE_DEFAULT_PROPS, MASONRY_DEFAULT_PROPS, MENU_DEFAULT_PROPS, MENU_ITEM_DEFAULT_PROPS, MENU_ITEM_GROUP_DEFAULT_PROPS, MESSAGE_BOX_DEFAULT_PROPS, METER_BAR_DEFAULT_PROPS, METER_RING_DEFAULT_PROPS, MarqueeComponent, MasonryComponent, MenuComponent, MenuItemComponent, MenuItemGroupComponent, MessageBoxComponent, MeterBarComponent, MeterRingComponent, NUMBER_BOX_DEFAULT_PROPS, NUMBER_COUNTER_DEFAULT_PROPS, NUMBER_DEFAULT_PROPS, NumberBoxComponent, NumberComponent, NumberCounterComponent, PAGE_CONTENT_DEFAULT_PROPS, PAGE_DEFAULT_PROPS, PAGE_HEADER_DEFAULT_PROPS, PAGE_MENU_DEFAULT_PROPS, PAGE_PRE_CONTENT_DEFAULT_PROPS, PAGE_PRE_HEADER_DEFAULT_PROPS, PAGINATOR_DEFAULT_PROPS, PASSWORD_BOX_DEFAULT_PROPS, PATTERN_DEFAULT_PROPS, PERSONA_DEFAULT_PROPS, PERSPECTIVE_DEFAULT_PROPS, PIN_BOX_DEFAULT_PROPS, POPUP_DEFAULT_PROPS, PORTAL_DEFAULT_PROPS, PORTAL_PROJECTION_DEFAULT_PROPS, PROGRESS_BAR_DEFAULT_PROPS, PROGRESS_RING_DEFAULT_PROPS, PageComponent, PageContentComponent, PageHeaderComponent, PageMenuComponent, PagePreContentComponent, PagePreHeaderComponent, PaginatorComponent, PasswordBoxComponent, PatternComponent, PersonaComponent, PerspectiveComponent, PinBoxComponent, PopupComponent, PortalComponent$1 as PortalComponent, PortalProjectionComponent, ProgressBarComponent, ProgressRingComponent, QRCODE_DEFAULT_PROPS, QRCodeComponent, RADIO_DEFAULT_PROPS, RADIO_GROUP_DEFAULT_PROPS, RATING_DEFAULT_PROPS, REPEAT_BUTTON_DEFAULT_PROPS, RESIZE_ADORNER_DEFAULT_PROPS, RIBBON_DEFAULT_PROPS, RICH_TEXT_BOX_DEFAULT_PROPS, RIPPLE_DEFAULT_PROPS, RadioComponent, RadioGroupComponent, RatingComponent, RepeatButtonComponent, ResizeAdornerComponent, RibbonComponent, RichTextBoxComponent, RippleComponent, SCALE_DEFAULT_PROPS, SCROLL_DEFAULT_PROPS, SEARCH_BOX_DEFAULT_PROPS, SEGMENT_DEFAULT_PROPS, SEGMENT_ITEM_DEFAULT_PROPS, SELECT_DEFAULT_PROPS, SELECT_ITEM_DEFAULT_PROPS, SELECT_ITEM_GROUP_DEFAULT_PROPS, SIGNATURE_PAD_DEFAULT_PROPS, SKELETON_DEFAULT_PROPS, SLIDER2THUMB_DEFAULT_PROPS, SLIDER2_DEFAULT_PROPS, SLIDER_DEFAULT_PROPS, SPACER_DEFAULT_PROPS, SPLIT_BUTTON_DEFAULT_PROPS, SPLIT_DEFAULT_PROPS, STACK_DEFAULT_PROPS, STICKY_DEFAULT_PROPS, SUCCESS_STATE_DEFAULT_PROPS, SUMMARY_DEFAULT_PROPS, SWIPE_DEFAULT_PROPS, ScaleComponent, ScrollComponent, SearchBoxComponent, SegmentComponent, SegmentItemComponent, SelectComponent, SelectItemComponent, SelectItemGroupComponent, SignaturePadComponent, SkeletonComponent, Slider2Component, Slider2ThumbComponent, SliderComponent, SpacerComponent, SplitButtonComponent, SplitComponent, StackComponent, StickyComponent, SuccessStateComponent, SummaryComponent, SwipeComponent, TABLE_BODY_DEFAULT_PROPS, TABLE_CELL_DEFAULT_PROPS, TABLE_DEFAULT_PROPS, TABLE_HEADER_DEFAULT_PROPS, TABLE_ROW_DEFAULT_PROPS, TAB_DEFAULT_PROPS, TAB_ITEM_DEFAULT_PROPS, TAB_PANEL_DEFAULT_PROPS, TAB_STRIP_DEFAULT_PROPS, TAB_STRIP_ITEM_DEFAULT_PROPS, TEXT_BOX_DEFAULT_PROPS, TEXT_DEFAULT_PROPS, TEXT_FORMAT_DEFAULT_PROPS, THEME2_DEFAULT_PROPS, TICK_BAR_DEFAULT_PROPS, TILE_LIST_DEFAULT_PROPS, TILE_LIST_ITEM_DEFAULT_PROPS, TIME_BOX_DEFAULT_PROPS, TOAST_DEFAULT_PROPS, TOGGLE_BUTTON_DEFAULT_PROPS, TOGGLE_SWITCH_DEFAULT_PROPS, TOGGLE_TIP_DEFAULT_PROPS, TOOLBAR_DEFAULT_PROPS, TOOLTIP_DEFAULT_PROPS, TREE_DEFAULT_PROPS, TREE_ITEM_DEFAULT_PROPS, TabComponent, TabItemComponent, TabPanelComponent, TabStripComponent, TabStripItemComponent, TableBodyComponent, TableCellComponent, TableComponent, TableHeaderComponent, TableRowComponent, TextBoxComponent, TextComponent, TextFormatComponent, Theme2Component, TickBarComponent, TileListComponent, TileListItemComponent, TimeBoxComponent, ToastComponent, ToastService, ToggleButtonComponent, ToggleSwitchComponent, ToggleTipComponent, ToolbarComponent, TooltipComponent, TreeComponent, TreeItemComponent, TypographyDirective, UP_DOWN_SPINNER_DEFAULT_PROPS, UpDownSpinnerComponent, VIDEO_DEFAULT_PROPS, VIRTUALIZE_DEFAULT_PROPS, VideoComponent, VirtualizeComponent, WIZARD_DEFAULT_PROPS, WIZARD_STEP_DEFAULT_PROPS, WRAP_DEFAULT_PROPS, WizardComponent, WizardStepComponent, WrapComponent, provideAbsolute, provideAbsoluteItem, provideAnchor, provideApp, provideAppHeader, provideAutoCompleteBox, provideAvatar, provideAvatarGroup, provideBackdrop, provideBadge, provideBanner, provideBannerHeader, provideBannerSubHeader, provideBottomSheet, provideBox, provideBreadcrumb, provideBreadcrumbItem, provideButton, provideButtonGroup, provideCalendar, provideCalendarHeader, provideCalendarItem, provideCalendarSubHeader, provideCamera, provideCard, provideCardActions, provideCardContent, provideCardFooter, provideCardHeader, provideCardSubTitle, provideCardTitle, provideCarousel, provideCarousel2, provideCarouselItem, provideCarouselItem2, provideCell, provideCellGroup, provideChart, provideChat, provideChatHeader, provideChatMarker, provideChatMessage, provideChatMessageAvatar, provideChatMessageDivider, provideCheckBoxGroup, provideCheckbox, provideCheckmark, provideChip, provideChipBox, provideChoice, provideChoiceGroup, provideChoiceGroupHeader, provideCode, provideColorArea, provideColorBox, provideColorPicker, provideColorSlider, provideColorSwatch, provideColorSwatchGroup, provideColorThumb, provideCombo, provideComboItem, provideComment, provideCompoundButton, provideCookiesConsent, provideDataList, provideDataTable, provideDateBox, provideDateTimeBox, provideDialog, provideDialogActions, provideDialogContent, provideDialogFooter, provideDialogHeader, provideDialogHeaderSubText, provideDialogHeaderText, provideDialogHost, provideDisclosure, provideDivider, provideDot, provideDrawer, provideDrawerContainer, provideDrawerContent, provideDropDownButton, provideDropZone, provideElevation, provideEmoji, provideEmptyState, provideEpg, provideEpgChannel, provideEpgProgram, provideError, provideErrorState, provideExpandable, provideExpander, provideExpanderGroup, provideExpanderHeader, provideExpanderSubHeader, provideFilePicker, provideFileUpload, provideFileUploadItem, provideFlip, provideFloating, provideFloatingActionButton, provideFloatingActionButtonGroup, provideFloatingTrigger, provideFocusRing, provideFooter, provideFooterItem, provideFooterItemGroup, provideForm, provideFormField, provideGrid, provideGridItem, provideHelmet, provideHint, provideIcon, provideImage, provideJumbtron, provideJumbtronHeader, provideJumbtronSubHeader, provideKbd, provideKbdShortcut, provideLightChain, provideList, provideListItem, provideListItemGroup, provideMarquee, provideMasonry, provideMenu, provideMenuItem, provideMenuItemGroup, provideMessageBox, provideMeterBar, provideMeterRing, provideNumber, provideNumberBox, provideNumberCounter, providePage, providePageContent, providePageHeader, providePageMenu, providePagePreContent, providePagePreHeader, providePaginator, providePasswordBox, providePattern, providePersona, providePerspective, providePinBox, providePopup, providePortal, providePortalProjection, provideProgressBar, provideProgressRing, provideQRCode, provideRadio, provideRadioGroup, provideRating, provideRepeatButton, provideResizeAdorner, provideRibbon, provideRichTextBox, provideRipple, provideScale, provideScroll, provideSearchBox, provideSegment, provideSegmentItem, provideSelect, provideSelectItem, provideSelectItemGroup, provideSignaturePad, provideSkeleton, provideSlider, provideSlider2, provideSlider2Thumb, provideSpacer, provideSplit, provideSplitButton, provideStack, provideSticky, provideSuccessState, provideSummary, provideSwipe, provideTab, provideTabItem, provideTabPanel, provideTabStrip, provideTabStripItem, provideTable, provideTableBody, provideTableCell, provideTableHeader, provideTableRow, provideText, provideTextBox, provideTextFormat, provideTheme2, provideTickBar, provideTileList, provideTileListItem, provideTimeBox, provideToast, provideToggleButton, provideToggleSwitch, provideToggleTip, provideToolbar, provideTooltip, provideTree, provideTreeItem, provideUpDownSpinner, provideVideo, provideVirtualize, provideWizard, provideWizardStep, provideWrap };
 //# sourceMappingURL=mosaik-elements-angular.mjs.map