@six-group/ui-library-angular 0.0.0-insider.ec3ffc2 → 0.0.0-insider.ed8065e

package/fesm2022/six-group-ui-library-angular.mjs

@@ -1,13 +1,14 @@
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, Injectable, inject, Directive, HostListener, Input, EventEmitter, Output, Optional, APP_INITIALIZER, NgModule, NgZone } from '@angular/core';
+import { EventEmitter, Output, ChangeDetectionStrategy, Component, Injectable, InjectionToken, inject, HostListener, Directive, Input, Optional, HostBinding, ContentChildren, APP_INITIALIZER, NgModule, NgZone } from '@angular/core';
 import { __decorate } from 'tslib';
 import { fromEvent } from 'rxjs';
 import { defineCustomElements } from '@six-group/ui-library/loader';
 import * as i1 from '@angular/forms';
-import { NgControl, NG_VALUE_ACCESSOR, FormControl, FormGroup, FormArray, NG_VALIDATORS, Validators } from '@angular/forms';
+import { Validators, NgControl, NG_VALUE_ACCESSOR, FormControl, FormGroup, FormArray, NG_VALIDATORS } from '@angular/forms';
 import { getErrorMessage, getLanguage, showAlert } from '@six-group/ui-library';
 import * as i1$1 from '@angular/common';
 import * as i2 from '@angular/router';
+import { RouterLinkActive } from '@angular/router';
 
 /* eslint-disable */
 /* tslint:disable */
@@ -68,14 +69,19 @@ function ProxyCmp(opts) {
 }
 
 let SixAlert = class SixAlert {
+    z;
+    el;
+    sixAlertShow = new EventEmitter();
+    sixAlertAfterShow = new EventEmitter();
+    sixAlertHide = new EventEmitter();
+    sixAlertAfterHide = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-alert-show', 'six-alert-after-show', 'six-alert-hide', 'six-alert-after-hide']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixAlert, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixAlert, selector: "six-alert", inputs: { closable: "closable", duration: "duration", open: "open", type: "type" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixAlert, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixAlert, isStandalone: false, selector: "six-alert", inputs: { closable: "closable", duration: "duration", open: "open", type: "type" }, outputs: { sixAlertShow: "sixAlertShow", sixAlertAfterShow: "sixAlertAfterShow", sixAlertHide: "sixAlertHide", sixAlertAfterHide: "sixAlertAfterHide" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixAlert = __decorate([
     ProxyCmp({
@@ -83,7 +89,7 @@ SixAlert = __decorate([
         methods: ['show', 'hide', 'toast']
     })
 ], SixAlert);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixAlert, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixAlert, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-alert',
@@ -91,23 +97,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['closable', 'duration', 'open', 'type'],
+                    outputs: ['sixAlertShow:six-alert-show', 'sixAlertAfterShow:six-alert-after-show', 'sixAlertHide:six-alert-hide', 'sixAlertAfterHide:six-alert-after-hide'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixAlertShow: [{
+                type: Output
+            }], sixAlertAfterShow: [{
+                type: Output
+            }], sixAlertHide: [{
+                type: Output
+            }], sixAlertAfterHide: [{
+                type: Output
+            }] } });
 let SixAvatar = class SixAvatar {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixAvatar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixAvatar, selector: "six-avatar", inputs: { alt: "alt", image: "image", initials: "initials", shape: "shape" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixAvatar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixAvatar, isStandalone: false, selector: "six-avatar", inputs: { alt: "alt", image: "image", initials: "initials", shape: "shape" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixAvatar = __decorate([
     ProxyCmp({
         inputs: ['alt', 'image', 'initials', 'shape']
     })
 ], SixAvatar);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixAvatar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixAvatar, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-avatar',
@@ -115,23 +133,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['alt', 'image', 'initials', 'shape'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixBadge = class SixBadge {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixBadge, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixBadge, selector: "six-badge", inputs: { pill: "pill", pulse: "pulse", type: "type" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixBadge, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixBadge, isStandalone: false, selector: "six-badge", inputs: { pill: "pill", pulse: "pulse", type: "type" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixBadge = __decorate([
     ProxyCmp({
         inputs: ['pill', 'pulse', 'type']
     })
 ], SixBadge);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixBadge, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixBadge, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-badge',
@@ -139,17 +160,75 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['pill', 'pulse', 'type'],
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
+let SixBreadcrumbs = class SixBreadcrumbs {
+    z;
+    el;
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixBreadcrumbs, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixBreadcrumbs, isStandalone: false, selector: "six-breadcrumbs", inputs: { separatorIcon: "separatorIcon" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+};
+SixBreadcrumbs = __decorate([
+    ProxyCmp({
+        inputs: ['separatorIcon']
+    })
+], SixBreadcrumbs);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixBreadcrumbs, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'six-breadcrumbs',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+                    inputs: ['separatorIcon'],
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
+let SixBreadcrumbsItem = class SixBreadcrumbsItem {
+    z;
+    el;
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixBreadcrumbsItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixBreadcrumbsItem, isStandalone: false, selector: "six-breadcrumbs-item", inputs: { href: "href", readonly: "readonly", size: "size", target: "target" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+};
+SixBreadcrumbsItem = __decorate([
+    ProxyCmp({
+        inputs: ['href', 'readonly', 'size', 'target']
+    })
+], SixBreadcrumbsItem);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixBreadcrumbsItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'six-breadcrumbs-item',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+                    inputs: ['href', 'readonly', 'size', 'target'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixButton = class SixButton {
+    z;
+    el;
+    sixButtonBlur = new EventEmitter();
+    sixButtonFocus = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-button-blur', 'six-button-focus']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixButton, selector: "six-button", inputs: { caret: "caret", circle: "circle", disabled: "disabled", download: "download", href: "href", loading: "loading", name: "name", pill: "pill", reset: "reset", size: "size", submit: "submit", target: "target", type: "type", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixButton, isStandalone: false, selector: "six-button", inputs: { caret: "caret", circle: "circle", disabled: "disabled", download: "download", href: "href", loading: "loading", name: "name", pill: "pill", reset: "reset", size: "size", submit: "submit", target: "target", type: "type", value: "value" }, outputs: { sixButtonBlur: "sixButtonBlur", sixButtonFocus: "sixButtonFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixButton = __decorate([
     ProxyCmp({
@@ -157,7 +236,7 @@ SixButton = __decorate([
         methods: ['setFocus', 'removeFocus']
     })
 ], SixButton);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixButton, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-button',
@@ -165,21 +244,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['caret', 'circle', 'disabled', 'download', 'href', 'loading', 'name', 'pill', 'reset', 'size', 'submit', 'target', 'type', 'value'],
+                    outputs: ['sixButtonBlur:six-button-blur', 'sixButtonFocus:six-button-focus'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixButtonBlur: [{
+                type: Output
+            }], sixButtonFocus: [{
+                type: Output
+            }] } });
 let SixCard = class SixCard {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixCard, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixCard, selector: "six-card", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixCard, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixCard, isStandalone: false, selector: "six-card", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixCard = __decorate([
     ProxyCmp({})
 ], SixCard);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixCard, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-card',
@@ -187,17 +274,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: [],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixCheckbox = class SixCheckbox {
+    z;
+    el;
+    sixCheckboxBlur = new EventEmitter();
+    sixCheckboxChange = new EventEmitter();
+    sixCheckboxFocus = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-checkbox-blur', 'six-checkbox-change', 'six-checkbox-focus']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixCheckbox, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixCheckbox, selector: "six-checkbox", inputs: { checked: "checked", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", indeterminate: "indeterminate", invalid: "invalid", label: "label", name: "name", required: "required", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixCheckbox, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixCheckbox, isStandalone: false, selector: "six-checkbox", inputs: { checked: "checked", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", indeterminate: "indeterminate", invalid: "invalid", label: "label", name: "name", required: "required", value: "value" }, outputs: { sixCheckboxBlur: "sixCheckboxBlur", sixCheckboxChange: "sixCheckboxChange", sixCheckboxFocus: "sixCheckboxFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixCheckbox = __decorate([
     ProxyCmp({
@@ -205,7 +297,7 @@ SixCheckbox = __decorate([
         methods: ['setFocus', 'removeFocus']
     })
 ], SixCheckbox);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixCheckbox, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-checkbox',
@@ -213,17 +305,64 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['checked', 'disabled', 'errorText', 'errorTextCount', 'indeterminate', 'invalid', 'label', 'name', 'required', 'value'],
+                    outputs: ['sixCheckboxBlur:six-checkbox-blur', 'sixCheckboxChange:six-checkbox-change', 'sixCheckboxFocus:six-checkbox-focus'],
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixCheckboxBlur: [{
+                type: Output
+            }], sixCheckboxChange: [{
+                type: Output
+            }], sixCheckboxFocus: [{
+                type: Output
+            }] } });
+let SixDate = class SixDate {
+    z;
+    el;
+    sixChange = new EventEmitter();
+    sixBlur = new EventEmitter();
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDate, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixDate, isStandalone: false, selector: "six-date", inputs: { allowedDates: "allowedDates", clearable: "clearable", dateFormat: "dateFormat", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", invalid: "invalid", label: "label", language: "language", max: "max", min: "min", name: "name", placeholder: "placeholder", readonly: "readonly", required: "required", size: "size", value: "value" }, outputs: { sixChange: "sixChange", sixBlur: "sixBlur" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+};
+SixDate = __decorate([
+    ProxyCmp({
+        inputs: ['allowedDates', 'clearable', 'dateFormat', 'disabled', 'errorText', 'errorTextCount', 'helpText', 'invalid', 'label', 'language', 'max', 'min', 'name', 'placeholder', 'readonly', 'required', 'size', 'value'],
+        methods: ['setFocus']
+    })
+], SixDate);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDate, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'six-date',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+                    inputs: ['allowedDates', 'clearable', 'dateFormat', 'disabled', 'errorText', 'errorTextCount', 'helpText', 'invalid', 'label', 'language', 'max', 'min', 'name', 'placeholder', 'readonly', 'required', 'size', 'value'],
+                    outputs: ['sixChange:six-change', 'sixBlur:six-blur'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixChange: [{
+                type: Output
+            }], sixBlur: [{
+                type: Output
+            }] } });
 let SixDatepicker = class SixDatepicker {
+    z;
+    el;
+    sixDatepickerSelect = new EventEmitter();
+    sixDatepickerClear = new EventEmitter();
+    sixDatepickerBlur = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-datepicker-select', 'six-datepicker-clear', 'six-datepicker-blur']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDatepicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixDatepicker, selector: "six-datepicker", inputs: { allowedDates: "allowedDates", clearable: "clearable", closeOnSelect: "closeOnSelect", containingElement: "containingElement", dateFormat: "dateFormat", debounce: "debounce", defaultDate: "defaultDate", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", hoist: "hoist", iconPosition: "iconPosition", inline: "inline", invalid: "invalid", label: "label", locale: "locale", max: "max", min: "min", name: "name", open: "open", placeholder: "placeholder", placement: "placement", readonly: "readonly", required: "required", size: "size", type: "type", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDatepicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixDatepicker, isStandalone: false, selector: "six-datepicker", inputs: { allowedDates: "allowedDates", clearable: "clearable", closeOnSelect: "closeOnSelect", containingElement: "containingElement", dateFormat: "dateFormat", debounce: "debounce", defaultDate: "defaultDate", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", hoist: "hoist", iconPosition: "iconPosition", inline: "inline", invalid: "invalid", label: "label", locale: "locale", max: "max", min: "min", name: "name", open: "open", placeholder: "placeholder", placement: "placement", readonly: "readonly", required: "required", size: "size", type: "type", value: "value" }, outputs: { sixDatepickerSelect: "sixDatepickerSelect", sixDatepickerClear: "sixDatepickerClear", sixDatepickerBlur: "sixDatepickerBlur" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixDatepicker = __decorate([
     ProxyCmp({
@@ -231,7 +370,7 @@ SixDatepicker = __decorate([
         methods: ['setFocus', 'select']
     })
 ], SixDatepicker);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDatepicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDatepicker, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-datepicker',
@@ -239,17 +378,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['allowedDates', 'clearable', 'closeOnSelect', 'containingElement', 'dateFormat', 'debounce', 'defaultDate', 'disabled', 'errorText', 'errorTextCount', 'hoist', 'iconPosition', 'inline', 'invalid', 'label', 'locale', 'max', 'min', 'name', 'open', 'placeholder', 'placement', 'readonly', 'required', 'size', 'type', 'value'],
+                    outputs: ['sixDatepickerSelect:six-datepicker-select', 'sixDatepickerClear:six-datepicker-clear', 'sixDatepickerBlur:six-datepicker-blur'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixDatepickerSelect: [{
+                type: Output
+            }], sixDatepickerClear: [{
+                type: Output
+            }], sixDatepickerBlur: [{
+                type: Output
+            }] } });
 let SixDetails = class SixDetails {
+    z;
+    el;
+    sixDetailsShow = new EventEmitter();
+    sixDetailsAfterShow = new EventEmitter();
+    sixDetailsHide = new EventEmitter();
+    sixDetailsAfterHide = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-details-show', 'six-details-after-show', 'six-details-hide', 'six-details-after-hide']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDetails, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixDetails, selector: "six-details", inputs: { disabled: "disabled", hasContent: "hasContent", inline: "inline", open: "open", selectableEmpty: "selectableEmpty", summary: "summary", summaryIcon: "summaryIcon", summaryIconSize: "summaryIconSize" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDetails, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixDetails, isStandalone: false, selector: "six-details", inputs: { disabled: "disabled", hasContent: "hasContent", inline: "inline", open: "open", selectableEmpty: "selectableEmpty", summary: "summary", summaryIcon: "summaryIcon", summaryIconSize: "summaryIconSize" }, outputs: { sixDetailsShow: "sixDetailsShow", sixDetailsAfterShow: "sixDetailsAfterShow", sixDetailsHide: "sixDetailsHide", sixDetailsAfterHide: "sixDetailsAfterHide" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixDetails = __decorate([
     ProxyCmp({
@@ -257,7 +409,7 @@ SixDetails = __decorate([
         methods: ['show', 'hide']
     })
 ], SixDetails);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDetails, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDetails, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-details',
@@ -265,17 +417,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['disabled', 'hasContent', 'inline', 'open', 'selectableEmpty', 'summary', 'summaryIcon', 'summaryIconSize'],
+                    outputs: ['sixDetailsShow:six-details-show', 'sixDetailsAfterShow:six-details-after-show', 'sixDetailsHide:six-details-hide', 'sixDetailsAfterHide:six-details-after-hide'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixDetailsShow: [{
+                type: Output
+            }], sixDetailsAfterShow: [{
+                type: Output
+            }], sixDetailsHide: [{
+                type: Output
+            }], sixDetailsAfterHide: [{
+                type: Output
+            }] } });
 let SixDialog = class SixDialog {
+    z;
+    el;
+    sixDialogShow = new EventEmitter();
+    sixDialogAfterShow = new EventEmitter();
+    sixDialogHide = new EventEmitter();
+    sixDialogAfterHide = new EventEmitter();
+    sixDialogInitialFocus = new EventEmitter();
+    sixDialogRequestClose = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-dialog-show', 'six-dialog-after-show', 'six-dialog-hide', 'six-dialog-after-hide', 'six-dialog-initial-focus', 'six-dialog-overlay-dismiss']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDialog, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixDialog, selector: "six-dialog", inputs: { label: "label", noHeader: "noHeader", open: "open" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDialog, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixDialog, isStandalone: false, selector: "six-dialog", inputs: { label: "label", noHeader: "noHeader", open: "open" }, outputs: { sixDialogShow: "sixDialogShow", sixDialogAfterShow: "sixDialogAfterShow", sixDialogHide: "sixDialogHide", sixDialogAfterHide: "sixDialogAfterHide", sixDialogInitialFocus: "sixDialogInitialFocus", sixDialogRequestClose: "sixDialogRequestClose" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixDialog = __decorate([
     ProxyCmp({
@@ -283,7 +452,7 @@ SixDialog = __decorate([
         methods: ['show', 'hide']
     })
 ], SixDialog);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDialog, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-dialog',
@@ -291,17 +460,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['label', 'noHeader', 'open'],
+                    outputs: ['sixDialogShow:six-dialog-show', 'sixDialogAfterShow:six-dialog-after-show', 'sixDialogHide:six-dialog-hide', 'sixDialogAfterHide:six-dialog-after-hide', 'sixDialogInitialFocus:six-dialog-initial-focus', 'sixDialogRequestClose:six-dialog-request-close'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixDialogShow: [{
+                type: Output
+            }], sixDialogAfterShow: [{
+                type: Output
+            }], sixDialogHide: [{
+                type: Output
+            }], sixDialogAfterHide: [{
+                type: Output
+            }], sixDialogInitialFocus: [{
+                type: Output
+            }], sixDialogRequestClose: [{
+                type: Output
+            }] } });
 let SixDrawer = class SixDrawer {
+    z;
+    el;
+    sixDrawerShow = new EventEmitter();
+    sixDrawerAfterShow = new EventEmitter();
+    sixDrawerHide = new EventEmitter();
+    sixDrawerAfterHide = new EventEmitter();
+    sixDrawerInitialFocus = new EventEmitter();
+    sixDrawerRequestClose = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-drawer-show', 'six-drawer-after-show', 'six-drawer-hide', 'six-drawer-after-hide', 'six-drawer-initial-focus', 'six-drawer-overlay-dismiss']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDrawer, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixDrawer, selector: "six-drawer", inputs: { contained: "contained", label: "label", noHeader: "noHeader", open: "open", placement: "placement" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDrawer, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixDrawer, isStandalone: false, selector: "six-drawer", inputs: { contained: "contained", label: "label", noHeader: "noHeader", open: "open", placement: "placement" }, outputs: { sixDrawerShow: "sixDrawerShow", sixDrawerAfterShow: "sixDrawerAfterShow", sixDrawerHide: "sixDrawerHide", sixDrawerAfterHide: "sixDrawerAfterHide", sixDrawerInitialFocus: "sixDrawerInitialFocus", sixDrawerRequestClose: "sixDrawerRequestClose" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixDrawer = __decorate([
     ProxyCmp({
@@ -309,7 +499,7 @@ SixDrawer = __decorate([
         methods: ['show', 'hide']
     })
 ], SixDrawer);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDrawer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDrawer, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-drawer',
@@ -317,47 +507,87 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['contained', 'label', 'noHeader', 'open', 'placement'],
+                    outputs: ['sixDrawerShow:six-drawer-show', 'sixDrawerAfterShow:six-drawer-after-show', 'sixDrawerHide:six-drawer-hide', 'sixDrawerAfterHide:six-drawer-after-hide', 'sixDrawerInitialFocus:six-drawer-initial-focus', 'sixDrawerRequestClose:six-drawer-request-close'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixDrawerShow: [{
+                type: Output
+            }], sixDrawerAfterShow: [{
+                type: Output
+            }], sixDrawerHide: [{
+                type: Output
+            }], sixDrawerAfterHide: [{
+                type: Output
+            }], sixDrawerInitialFocus: [{
+                type: Output
+            }], sixDrawerRequestClose: [{
+                type: Output
+            }] } });
 let SixDropdown = class SixDropdown {
+    z;
+    el;
+    sixDropdownShow = new EventEmitter();
+    sixDropdownAfterShow = new EventEmitter();
+    sixDropdownHide = new EventEmitter();
+    sixDropdownAfterHide = new EventEmitter();
+    sixDropdownAutoFilterFired = new EventEmitter();
+    sixAsyncFilterFired = new EventEmitter();
+    sixDropdownScroll = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-dropdown-show', 'six-dropdown-after-show', 'six-dropdown-hide', 'six-dropdown-after-hide', 'six-dropdown-auto-filter-fired', 'six-async-filter-fired', 'six-dropdown-scroll']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDropdown, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixDropdown, selector: "six-dropdown", inputs: { asyncFilter: "asyncFilter", autofocusFilter: "autofocusFilter", closeOnSelect: "closeOnSelect", containingElement: "containingElement", disableHideOnEnterAndSpace: "disableHideOnEnterAndSpace", distance: "distance", filter: "filter", filterDebounce: "filterDebounce", filterPlaceholder: "filterPlaceholder", hoist: "hoist", matchTriggerWidth: "matchTriggerWidth", open: "open", options: "options", placement: "placement", skidding: "skidding", virtualScroll: "virtualScroll" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDropdown, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixDropdown, isStandalone: false, selector: "six-dropdown", inputs: { asyncFilter: "asyncFilter", autofocusFilter: "autofocusFilter", closeOnSelect: "closeOnSelect", containingElement: "containingElement", disableHideOnEnterAndSpace: "disableHideOnEnterAndSpace", disableTypeToSelect: "disableTypeToSelect", distance: "distance", filter: "filter", filterDebounce: "filterDebounce", filterPlaceholder: "filterPlaceholder", hoist: "hoist", matchTriggerWidth: "matchTriggerWidth", noScroll: "noScroll", open: "open", options: "options", placement: "placement", skidding: "skidding", virtualScroll: "virtualScroll" }, outputs: { sixDropdownShow: "sixDropdownShow", sixDropdownAfterShow: "sixDropdownAfterShow", sixDropdownHide: "sixDropdownHide", sixDropdownAfterHide: "sixDropdownAfterHide", sixDropdownAutoFilterFired: "sixDropdownAutoFilterFired", sixAsyncFilterFired: "sixAsyncFilterFired", sixDropdownScroll: "sixDropdownScroll" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixDropdown = __decorate([
     ProxyCmp({
-        inputs: ['asyncFilter', 'autofocusFilter', 'closeOnSelect', 'containingElement', 'disableHideOnEnterAndSpace', 'distance', 'filter', 'filterDebounce', 'filterPlaceholder', 'hoist', 'matchTriggerWidth', 'open', 'options', 'placement', 'skidding', 'virtualScroll'],
-        methods: ['show', 'hide', 'reposition']
+        inputs: ['asyncFilter', 'autofocusFilter', 'closeOnSelect', 'containingElement', 'disableHideOnEnterAndSpace', 'disableTypeToSelect', 'distance', 'filter', 'filterDebounce', 'filterPlaceholder', 'hoist', 'matchTriggerWidth', 'noScroll', 'open', 'options', 'placement', 'skidding', 'virtualScroll'],
+        methods: ['show', 'hide']
     })
 ], SixDropdown);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixDropdown, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixDropdown, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-dropdown',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['asyncFilter', 'autofocusFilter', 'closeOnSelect', 'containingElement', 'disableHideOnEnterAndSpace', 'distance', 'filter', 'filterDebounce', 'filterPlaceholder', 'hoist', 'matchTriggerWidth', 'open', 'options', 'placement', 'skidding', 'virtualScroll'],
+                    inputs: ['asyncFilter', 'autofocusFilter', 'closeOnSelect', 'containingElement', 'disableHideOnEnterAndSpace', 'disableTypeToSelect', 'distance', 'filter', 'filterDebounce', 'filterPlaceholder', 'hoist', 'matchTriggerWidth', 'noScroll', 'open', 'options', 'placement', 'skidding', 'virtualScroll'],
+                    outputs: ['sixDropdownShow:six-dropdown-show', 'sixDropdownAfterShow:six-dropdown-after-show', 'sixDropdownHide:six-dropdown-hide', 'sixDropdownAfterHide:six-dropdown-after-hide', 'sixDropdownAutoFilterFired:six-dropdown-auto-filter-fired', 'sixAsyncFilterFired:six-async-filter-fired', 'sixDropdownScroll:six-dropdown-scroll'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixDropdownShow: [{
+                type: Output
+            }], sixDropdownAfterShow: [{
+                type: Output
+            }], sixDropdownHide: [{
+                type: Output
+            }], sixDropdownAfterHide: [{
+                type: Output
+            }], sixDropdownAutoFilterFired: [{
+                type: Output
+            }], sixAsyncFilterFired: [{
+                type: Output
+            }], sixDropdownScroll: [{
+                type: Output
+            }] } });
 let SixError = class SixError {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixError, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixError, selector: "six-error", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixError, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixError, isStandalone: false, selector: "six-error", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixError = __decorate([
     ProxyCmp({})
 ], SixError);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixError, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixError, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-error',
@@ -365,23 +595,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: [],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixErrorPage = class SixErrorPage {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixErrorPage, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixErrorPage, selector: "six-error-page", inputs: { customDescription: "customDescription", customIcon: "customIcon", customTitle: "customTitle", errorCode: "errorCode", language: "language" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixErrorPage, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixErrorPage, isStandalone: false, selector: "six-error-page", inputs: { customDescription: "customDescription", customIcon: "customIcon", customTitle: "customTitle", errorCode: "errorCode", language: "language" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixErrorPage = __decorate([
     ProxyCmp({
         inputs: ['customDescription', 'customIcon', 'customTitle', 'errorCode', 'language']
     })
 ], SixErrorPage);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixErrorPage, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixErrorPage, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-error-page',
@@ -389,21 +622,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['customDescription', 'customIcon', 'customTitle', 'errorCode', 'language'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixFileList = class SixFileList {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFileList, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixFileList, selector: "six-file-list", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFileList, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixFileList, isStandalone: false, selector: "six-file-list", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixFileList = __decorate([
     ProxyCmp({})
 ], SixFileList);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFileList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFileList, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-file-list',
@@ -411,24 +647,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: [],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixFileListItem = class SixFileListItem {
+    z;
+    el;
+    sixFileListItemDownload = new EventEmitter();
+    sixFileListItemRemove = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-file-list-item-download', 'six-file-list-item-remove']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFileListItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixFileListItem, selector: "six-file-list-item", inputs: { date: "date", identifier: "identifier", name: "name", nodelete: "nodelete", nodownload: "nodownload", size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFileListItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixFileListItem, isStandalone: false, selector: "six-file-list-item", inputs: { date: "date", identifier: "identifier", name: "name", nodelete: "nodelete", nodownload: "nodownload", size: "size" }, outputs: { sixFileListItemDownload: "sixFileListItemDownload", sixFileListItemRemove: "sixFileListItemRemove" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixFileListItem = __decorate([
     ProxyCmp({
         inputs: ['date', 'identifier', 'name', 'nodelete', 'nodownload', 'size']
     })
 ], SixFileListItem);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFileListItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFileListItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-file-list-item',
@@ -436,24 +676,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['date', 'identifier', 'name', 'nodelete', 'nodownload', 'size'],
+                    outputs: ['sixFileListItemDownload:six-file-list-item-download', 'sixFileListItemRemove:six-file-list-item-remove'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixFileListItemDownload: [{
+                type: Output
+            }], sixFileListItemRemove: [{
+                type: Output
+            }] } });
 let SixFileUpload = class SixFileUpload {
+    z;
+    el;
+    sixFileUploadSuccess = new EventEmitter();
+    sixFileUploadFailure = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-file-upload-success', 'six-file-upload-failure']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFileUpload, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixFileUpload, selector: "six-file-upload", inputs: { accept: "accept", compact: "compact", disabled: "disabled", errorText: "errorText", invalid: "invalid", label: "label", maxFileSize: "maxFileSize", multiple: "multiple", uploading: "uploading" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFileUpload, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixFileUpload, isStandalone: false, selector: "six-file-upload", inputs: { accept: "accept", compact: "compact", disabled: "disabled", errorText: "errorText", invalid: "invalid", label: "label", maxFileSize: "maxFileSize", multiple: "multiple", uploading: "uploading" }, outputs: { sixFileUploadSuccess: "sixFileUploadSuccess", sixFileUploadFailure: "sixFileUploadFailure" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixFileUpload = __decorate([
     ProxyCmp({
         inputs: ['accept', 'compact', 'disabled', 'errorText', 'invalid', 'label', 'maxFileSize', 'multiple', 'uploading']
     })
 ], SixFileUpload);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFileUpload, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFileUpload, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-file-upload',
@@ -461,21 +710,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['accept', 'compact', 'disabled', 'errorText', 'invalid', 'label', 'maxFileSize', 'multiple', 'uploading'],
+                    outputs: ['sixFileUploadSuccess:six-file-upload-success', 'sixFileUploadFailure:six-file-upload-failure'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixFileUploadSuccess: [{
+                type: Output
+            }], sixFileUploadFailure: [{
+                type: Output
+            }] } });
 let SixFooter = class SixFooter {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFooter, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixFooter, selector: "six-footer", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFooter, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixFooter, isStandalone: false, selector: "six-footer", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixFooter = __decorate([
     ProxyCmp({})
 ], SixFooter);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFooter, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-footer',
@@ -483,23 +740,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: [],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixGroupLabel = class SixGroupLabel {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixGroupLabel, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixGroupLabel, selector: "six-group-label", inputs: { disabled: "disabled", helpText: "helpText", label: "label", required: "required", size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixGroupLabel, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixGroupLabel, isStandalone: false, selector: "six-group-label", inputs: { disabled: "disabled", helpText: "helpText", label: "label", required: "required", size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixGroupLabel = __decorate([
     ProxyCmp({
         inputs: ['disabled', 'helpText', 'label', 'required', 'size']
     })
 ], SixGroupLabel);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixGroupLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixGroupLabel, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-group-label',
@@ -507,71 +767,80 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['disabled', 'helpText', 'label', 'required', 'size'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixHeader = class SixHeader {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-header-app-name-clicked', 'six-header-app-switcher-select', 'six-header-profile-select', 'six-header-hamburger-menu-clicked', 'six-header-logo-clicked', 'six-header-search-field-toggle']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeader, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixHeader, selector: "six-header", inputs: { clickableLogo: "clickableLogo", custom: "custom", hideHamburgerMenu: "hideHamburgerMenu", logo: "logo", openHamburgerMenu: "openHamburgerMenu", openSearch: "openSearch", shiftContent: "shiftContent" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeader, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixHeader, isStandalone: false, selector: "six-header", inputs: { openSearch: "openSearch", shiftContent: "shiftContent" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixHeader = __decorate([
     ProxyCmp({
-        inputs: ['clickableLogo', 'custom', 'hideHamburgerMenu', 'logo', 'openHamburgerMenu', 'openSearch', 'shiftContent'],
-        methods: ['setSearchOpenState', 'getIsSearchOpen']
+        inputs: ['openSearch', 'shiftContent']
     })
 ], SixHeader);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeader, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-header',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['clickableLogo', 'custom', 'hideHamburgerMenu', 'logo', 'openHamburgerMenu', 'openSearch', 'shiftContent'],
+                    inputs: ['openSearch', 'shiftContent'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixHeaderDropdownItem = class SixHeaderDropdownItem {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeaderDropdownItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixHeaderDropdownItem, selector: "six-header-dropdown-item", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeaderDropdownItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixHeaderDropdownItem, isStandalone: false, selector: "six-header-dropdown-item", inputs: { filter: "filter", filterPlaceholder: "filterPlaceholder" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixHeaderDropdownItem = __decorate([
-    ProxyCmp({})
+    ProxyCmp({
+        inputs: ['filter', 'filterPlaceholder']
+    })
 ], SixHeaderDropdownItem);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeaderDropdownItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeaderDropdownItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-header-dropdown-item',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: [],
+                    inputs: ['filter', 'filterPlaceholder'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixHeaderItem = class SixHeaderItem {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeaderItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixHeaderItem, selector: "six-header-item", inputs: { active: "active" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeaderItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixHeaderItem, isStandalone: false, selector: "six-header-item", inputs: { active: "active" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixHeaderItem = __decorate([
     ProxyCmp({
         inputs: ['active']
     })
 ], SixHeaderItem);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeaderItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeaderItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-header-item',
@@ -579,89 +848,105 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['active'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixHeaderMenuButton = class SixHeaderMenuButton {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeaderMenuButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixHeaderMenuButton, selector: "six-header-menu-button", inputs: { icon: "icon" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeaderMenuButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixHeaderMenuButton, isStandalone: false, selector: "six-header-menu-button", inputs: { caret: "caret", disabled: "disabled", loading: "loading", reset: "reset", submit: "submit" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixHeaderMenuButton = __decorate([
     ProxyCmp({
-        inputs: ['icon']
+        inputs: ['caret', 'disabled', 'loading', 'reset', 'submit']
     })
 ], SixHeaderMenuButton);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixHeaderMenuButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixHeaderMenuButton, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-header-menu-button',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['icon'],
+                    inputs: ['caret', 'disabled', 'loading', 'reset', 'submit'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixIcon = class SixIcon {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixIcon, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixIcon, selector: "six-icon", inputs: { filled: "filled", size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixIcon, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixIcon, isStandalone: false, selector: "six-icon", inputs: { filled: "filled", library: "library", size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixIcon = __decorate([
     ProxyCmp({
-        inputs: ['filled', 'size']
+        inputs: ['filled', 'library', 'size']
     })
 ], SixIcon);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixIcon, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-icon',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['filled', 'size'],
+                    inputs: ['filled', 'library', 'size'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixIconButton = class SixIconButton {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixIconButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixIconButton, selector: "six-icon-button", inputs: { disabled: "disabled", download: "download", href: "href", html: "html", label: "label", name: "name", size: "size", target: "target" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixIconButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixIconButton, isStandalone: false, selector: "six-icon-button", inputs: { disabled: "disabled", download: "download", href: "href", html: "html", label: "label", library: "library", name: "name", size: "size", target: "target" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixIconButton = __decorate([
     ProxyCmp({
-        inputs: ['disabled', 'download', 'href', 'html', 'label', 'name', 'size', 'target']
+        inputs: ['disabled', 'download', 'href', 'html', 'label', 'library', 'name', 'size', 'target']
     })
 ], SixIconButton);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixIconButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixIconButton, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-icon-button',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['disabled', 'download', 'href', 'html', 'label', 'name', 'size', 'target'],
+                    inputs: ['disabled', 'download', 'href', 'html', 'label', 'library', 'name', 'size', 'target'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixInput = class SixInput {
+    z;
+    el;
+    sixInputChange = new EventEmitter();
+    sixInputClear = new EventEmitter();
+    sixInputInput = new EventEmitter();
+    sixInputFocus = new EventEmitter();
+    sixInputBlur = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-input-change', 'six-input-clear', 'six-input-input', 'six-input-focus', 'six-input-blur']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixInput, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixInput, selector: "six-input", inputs: { autocapitalize: "autocapitalize", autocomplete: "autocomplete", autocorrect: "autocorrect", autofocus: "autofocus", clearable: "clearable", disabled: "disabled", dropdownSearch: "dropdownSearch", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", inputmode: "inputmode", invalid: "invalid", label: "label", line: "line", max: "max", maxlength: "maxlength", min: "min", minlength: "minlength", name: "name", pattern: "pattern", pill: "pill", placeholder: "placeholder", readonly: "readonly", required: "required", size: "size", spellcheck: "spellcheck", step: "step", togglePassword: "togglePassword", type: "type", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixInput, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixInput, isStandalone: false, selector: "six-input", inputs: { autocapitalize: "autocapitalize", autocomplete: "autocomplete", autocorrect: "autocorrect", autofocus: "autofocus", clearable: "clearable", disabled: "disabled", dropdownSearch: "dropdownSearch", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", inputmode: "inputmode", invalid: "invalid", label: "label", line: "line", max: "max", maxlength: "maxlength", min: "min", minlength: "minlength", name: "name", pattern: "pattern", pill: "pill", placeholder: "placeholder", readonly: "readonly", required: "required", size: "size", spellcheck: "spellcheck", step: "step", togglePassword: "togglePassword", type: "type", value: "value" }, outputs: { sixInputChange: "sixInputChange", sixInputClear: "sixInputClear", sixInputInput: "sixInputInput", sixInputFocus: "sixInputFocus", sixInputBlur: "sixInputBlur" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixInput = __decorate([
     ProxyCmp({
@@ -669,7 +954,7 @@ SixInput = __decorate([
         methods: ['setFocus', 'removeFocus', 'select', 'setSelectionRange', 'getSelectionRange', 'setRangeText']
     })
 ], SixInput);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-input',
@@ -677,24 +962,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearable', 'disabled', 'dropdownSearch', 'errorText', 'errorTextCount', 'helpText', 'inputmode', 'invalid', 'label', 'line', 'max', 'maxlength', 'min', 'minlength', 'name', 'pattern', 'pill', 'placeholder', 'readonly', 'required', 'size', 'spellcheck', 'step', 'togglePassword', 'type', 'value'],
+                    outputs: ['sixInputChange:six-input-change', 'sixInputClear:six-input-clear', 'sixInputInput:six-input-input', 'sixInputFocus:six-input-focus', 'sixInputBlur:six-input-blur'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixInputChange: [{
+                type: Output
+            }], sixInputClear: [{
+                type: Output
+            }], sixInputInput: [{
+                type: Output
+            }], sixInputFocus: [{
+                type: Output
+            }], sixInputBlur: [{
+                type: Output
+            }] } });
 let SixItemPicker = class SixItemPicker {
+    z;
+    el;
+    sixItemPickerChange = new EventEmitter();
+    sixItemPickerChangeDebounced = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-item-picker-change', 'six-item-picker-change-debounced']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixItemPicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixItemPicker, selector: "six-item-picker", inputs: { debounce: "debounce", interval: "interval", items: "items", max: "max", min: "min", padded: "padded", paddingChar: "paddingChar", paddingDirection: "paddingDirection", paddingLength: "paddingLength", roundtrip: "roundtrip", step: "step", timeout: "timeout", type: "type", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixItemPicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixItemPicker, isStandalone: false, selector: "six-item-picker", inputs: { debounce: "debounce", interval: "interval", items: "items", max: "max", min: "min", padded: "padded", paddingChar: "paddingChar", paddingDirection: "paddingDirection", paddingLength: "paddingLength", roundtrip: "roundtrip", step: "step", timeout: "timeout", type: "type", value: "value" }, outputs: { sixItemPickerChange: "sixItemPickerChange", sixItemPickerChangeDebounced: "sixItemPickerChangeDebounced" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixItemPicker = __decorate([
     ProxyCmp({
         inputs: ['debounce', 'interval', 'items', 'max', 'min', 'padded', 'paddingChar', 'paddingDirection', 'paddingLength', 'roundtrip', 'step', 'timeout', 'type', 'value']
     })
 ], SixItemPicker);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixItemPicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixItemPicker, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-item-picker',
@@ -702,24 +1002,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['debounce', 'interval', 'items', 'max', 'min', 'padded', 'paddingChar', 'paddingDirection', 'paddingLength', 'roundtrip', 'step', 'timeout', 'type', 'value'],
+                    outputs: ['sixItemPickerChange:six-item-picker-change', 'sixItemPickerChangeDebounced:six-item-picker-change-debounced'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixItemPickerChange: [{
+                type: Output
+            }], sixItemPickerChangeDebounced: [{
+                type: Output
+            }] } });
 let SixLanguageSwitcher = class SixLanguageSwitcher {
+    z;
+    el;
+    sixLanguageSwitcherChange = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-language-switcher-change']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixLanguageSwitcher, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixLanguageSwitcher, selector: "six-language-switcher", inputs: { languages: "languages", selected: "selected" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixLanguageSwitcher, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixLanguageSwitcher, isStandalone: false, selector: "six-language-switcher", inputs: { languages: "languages", selected: "selected" }, outputs: { sixLanguageSwitcherChange: "sixLanguageSwitcherChange" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixLanguageSwitcher = __decorate([
     ProxyCmp({
         inputs: ['languages', 'selected']
     })
 ], SixLanguageSwitcher);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixLanguageSwitcher, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixLanguageSwitcher, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-language-switcher',
@@ -727,23 +1035,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['languages', 'selected'],
+                    outputs: ['sixLanguageSwitcherChange:six-language-switcher-change'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixLanguageSwitcherChange: [{
+                type: Output
+            }] } });
 let SixLayoutGrid = class SixLayoutGrid {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixLayoutGrid, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixLayoutGrid, selector: "six-layout-grid", inputs: { columns: "columns" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixLayoutGrid, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixLayoutGrid, isStandalone: false, selector: "six-layout-grid", inputs: { columns: "columns" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixLayoutGrid = __decorate([
     ProxyCmp({
         inputs: ['columns']
     })
 ], SixLayoutGrid);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixLayoutGrid, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixLayoutGrid, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-layout-grid',
@@ -751,23 +1065,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['columns'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixLogo = class SixLogo {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixLogo, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixLogo, selector: "six-logo", inputs: { brand: "brand" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixLogo, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixLogo, isStandalone: false, selector: "six-logo", inputs: { brand: "brand" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixLogo = __decorate([
     ProxyCmp({
         inputs: ['brand']
     })
 ], SixLogo);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixLogo, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixLogo, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-logo',
@@ -775,23 +1092,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['brand'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixMainContainer = class SixMainContainer {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMainContainer, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixMainContainer, selector: "six-main-container", inputs: { padded: "padded" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMainContainer, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixMainContainer, isStandalone: false, selector: "six-main-container", inputs: { padded: "padded" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixMainContainer = __decorate([
     ProxyCmp({
         inputs: ['padded']
     })
 ], SixMainContainer);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMainContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMainContainer, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-main-container',
@@ -799,17 +1119,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['padded'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixMenu = class SixMenu {
+    z;
+    el;
+    sixMenuItemSelected = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-menu-item-selected']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenu, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixMenu, selector: "six-menu", inputs: { disableKeyboardHandling: "disableKeyboardHandling", itemSize: "itemSize", items: "items", itemsShown: "itemsShown", removeBoxShadow: "removeBoxShadow", scrollingDebounce: "scrollingDebounce", virtualScroll: "virtualScroll" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenu, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixMenu, isStandalone: false, selector: "six-menu", inputs: { disableKeyboardHandling: "disableKeyboardHandling", itemSize: "itemSize", items: "items", itemsShown: "itemsShown", removeBoxShadow: "removeBoxShadow", scrollingDebounce: "scrollingDebounce", virtualScroll: "virtualScroll" }, outputs: { sixMenuItemSelected: "sixMenuItemSelected" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixMenu = __decorate([
     ProxyCmp({
@@ -817,7 +1140,7 @@ SixMenu = __decorate([
         methods: ['typeToSelect']
     })
 ], SixMenu);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenu, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-menu',
@@ -825,21 +1148,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['disableKeyboardHandling', 'itemSize', 'items', 'itemsShown', 'removeBoxShadow', 'scrollingDebounce', 'virtualScroll'],
+                    outputs: ['sixMenuItemSelected:six-menu-item-selected'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixMenuItemSelected: [{
+                type: Output
+            }] } });
 let SixMenuDivider = class SixMenuDivider {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenuDivider, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixMenuDivider, selector: "six-menu-divider", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenuDivider, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixMenuDivider, isStandalone: false, selector: "six-menu-divider", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixMenuDivider = __decorate([
     ProxyCmp({})
 ], SixMenuDivider);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenuDivider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenuDivider, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-menu-divider',
@@ -847,16 +1176,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: [],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixMenuItem = class SixMenuItem {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenuItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixMenuItem, selector: "six-menu-item", inputs: { checkType: "checkType", checked: "checked", disabled: "disabled", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenuItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixMenuItem, isStandalone: false, selector: "six-menu-item", inputs: { checkType: "checkType", checked: "checked", disabled: "disabled", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixMenuItem = __decorate([
     ProxyCmp({
@@ -864,7 +1196,7 @@ SixMenuItem = __decorate([
         methods: ['setFocus', 'removeFocus', 'getTextLabel']
     })
 ], SixMenuItem);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenuItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-menu-item',
@@ -872,21 +1204,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['checkType', 'checked', 'disabled', 'value'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixMenuLabel = class SixMenuLabel {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenuLabel, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixMenuLabel, selector: "six-menu-label", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenuLabel, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixMenuLabel, isStandalone: false, selector: "six-menu-label", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixMenuLabel = __decorate([
     ProxyCmp({})
 ], SixMenuLabel);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixMenuLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixMenuLabel, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-menu-label',
@@ -894,23 +1229,60 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: [],
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
+let SixPaginator = class SixPaginator {
+    z;
+    el;
+    sixPaginatorResultsPerPageChanged = new EventEmitter();
+    sixPaginatorPageChanged = new EventEmitter();
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixPaginator, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixPaginator, isStandalone: false, selector: "six-paginator", inputs: { clamp: "clamp", currentPage: "currentPage", disabled: "disabled", length: "length", resultsPerPage: "resultsPerPage", resultsPerPageOptions: "resultsPerPageOptions", totalPages: "totalPages", totalResults: "totalResults" }, outputs: { sixPaginatorResultsPerPageChanged: "sixPaginatorResultsPerPageChanged", sixPaginatorPageChanged: "sixPaginatorPageChanged" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+};
+SixPaginator = __decorate([
+    ProxyCmp({
+        inputs: ['clamp', 'currentPage', 'disabled', 'length', 'resultsPerPage', 'resultsPerPageOptions', 'totalPages', 'totalResults']
+    })
+], SixPaginator);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixPaginator, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'six-paginator',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+                    inputs: ['clamp', 'currentPage', 'disabled', 'length', 'resultsPerPage', 'resultsPerPageOptions', { name: 'totalPages', required: true }, { name: 'totalResults', required: true }],
+                    outputs: ['sixPaginatorResultsPerPageChanged:six-paginator-results-per-page-changed', 'sixPaginatorPageChanged:six-paginator-page-changed'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixPaginatorResultsPerPageChanged: [{
+                type: Output
+            }], sixPaginatorPageChanged: [{
+                type: Output
+            }] } });
 let SixPicto = class SixPicto {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixPicto, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixPicto, selector: "six-picto", inputs: { size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixPicto, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixPicto, isStandalone: false, selector: "six-picto", inputs: { size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixPicto = __decorate([
     ProxyCmp({
         inputs: ['size']
     })
 ], SixPicto);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixPicto, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixPicto, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-picto',
@@ -918,23 +1290,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['size'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixProgressBar = class SixProgressBar {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixProgressBar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixProgressBar, selector: "six-progress-bar", inputs: { indeterminate: "indeterminate", percentage: "percentage" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixProgressBar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixProgressBar, isStandalone: false, selector: "six-progress-bar", inputs: { indeterminate: "indeterminate", percentage: "percentage" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixProgressBar = __decorate([
     ProxyCmp({
         inputs: ['indeterminate', 'percentage']
     })
 ], SixProgressBar);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixProgressBar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixProgressBar, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-progress-bar',
@@ -942,23 +1317,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['indeterminate', 'percentage'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixProgressRing = class SixProgressRing {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixProgressRing, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixProgressRing, selector: "six-progress-ring", inputs: { percentage: "percentage", size: "size", strokeWidth: "strokeWidth" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixProgressRing, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixProgressRing, isStandalone: false, selector: "six-progress-ring", inputs: { percentage: "percentage", size: "size", strokeWidth: "strokeWidth" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixProgressRing = __decorate([
     ProxyCmp({
         inputs: ['percentage', 'size', 'strokeWidth']
     })
 ], SixProgressRing);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixProgressRing, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixProgressRing, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-progress-ring',
@@ -966,17 +1344,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['percentage', 'size', 'strokeWidth'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixRadio = class SixRadio {
+    z;
+    el;
+    sixRadioBlur = new EventEmitter();
+    sixRadioChange = new EventEmitter();
+    sixRadioFocus = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-radio-blur', 'six-radio-change', 'six-radio-focus']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRadio, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixRadio, selector: "six-radio", inputs: { checked: "checked", disabled: "disabled", invalid: "invalid", name: "name", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRadio, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixRadio, isStandalone: false, selector: "six-radio", inputs: { checked: "checked", disabled: "disabled", invalid: "invalid", name: "name", value: "value" }, outputs: { sixRadioBlur: "sixRadioBlur", sixRadioChange: "sixRadioChange", sixRadioFocus: "sixRadioFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixRadio = __decorate([
     ProxyCmp({
@@ -984,7 +1367,7 @@ SixRadio = __decorate([
         methods: ['setFocus', 'removeFocus']
     })
 ], SixRadio);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRadio, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-radio',
@@ -992,17 +1375,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['checked', 'disabled', 'invalid', 'name', 'value'],
+                    outputs: ['sixRadioBlur:six-radio-blur', 'sixRadioChange:six-radio-change', 'sixRadioFocus:six-radio-focus'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixRadioBlur: [{
+                type: Output
+            }], sixRadioChange: [{
+                type: Output
+            }], sixRadioFocus: [{
+                type: Output
+            }] } });
 let SixRange = class SixRange {
+    z;
+    el;
+    sixRangeChange = new EventEmitter();
+    sixRangeBlur = new EventEmitter();
+    sixRangeFocus = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-range-change', 'six-range-blur', 'six-range-focus']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRange, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixRange, selector: "six-range", inputs: { disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", invalid: "invalid", label: "label", max: "max", min: "min", name: "name", required: "required", step: "step", tooltip: "tooltip", tooltipFormatter: "tooltipFormatter", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRange, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixRange, isStandalone: false, selector: "six-range", inputs: { disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", invalid: "invalid", label: "label", max: "max", min: "min", name: "name", required: "required", step: "step", tooltip: "tooltip", tooltipFormatter: "tooltipFormatter", value: "value" }, outputs: { sixRangeChange: "sixRangeChange", sixRangeBlur: "sixRangeBlur", sixRangeFocus: "sixRangeFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixRange = __decorate([
     ProxyCmp({
@@ -1010,7 +1405,7 @@ SixRange = __decorate([
         methods: ['setFocus', 'removeFocus']
     })
 ], SixRange);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRange, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRange, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-range',
@@ -1018,23 +1413,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['disabled', 'errorText', 'errorTextCount', 'helpText', 'invalid', 'label', 'max', 'min', 'name', 'required', 'step', 'tooltip', 'tooltipFormatter', 'value'],
+                    outputs: ['sixRangeChange:six-range-change', 'sixRangeBlur:six-range-blur', 'sixRangeFocus:six-range-focus'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixRangeChange: [{
+                type: Output
+            }], sixRangeBlur: [{
+                type: Output
+            }], sixRangeFocus: [{
+                type: Output
+            }] } });
+let SixRating = class SixRating {
+    z;
+    el;
+    sixRatingBlur = new EventEmitter();
+    sixRatingChange = new EventEmitter();
+    sixRatingFocus = new EventEmitter();
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRating, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixRating, isStandalone: false, selector: "six-rating", inputs: { disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", invalid: "invalid", label: "label", max: "max", name: "name", readonly: "readonly", required: "required", size: "size", value: "value" }, outputs: { sixRatingBlur: "sixRatingBlur", sixRatingChange: "sixRatingChange", sixRatingFocus: "sixRatingFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+};
+SixRating = __decorate([
+    ProxyCmp({
+        inputs: ['disabled', 'errorText', 'errorTextCount', 'helpText', 'invalid', 'label', 'max', 'name', 'readonly', 'required', 'size', 'value']
+    })
+], SixRating);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRating, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'six-rating',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+                    inputs: ['disabled', 'errorText', 'errorTextCount', 'helpText', 'invalid', 'label', 'max', 'name', 'readonly', 'required', 'size', 'value'],
+                    outputs: ['sixRatingBlur:six-rating-blur', 'sixRatingChange:six-rating-change', 'sixRatingFocus:six-rating-focus'],
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixRatingBlur: [{
+                type: Output
+            }], sixRatingChange: [{
+                type: Output
+            }], sixRatingFocus: [{
+                type: Output
+            }] } });
 let SixRoot = class SixRoot {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRoot, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixRoot, selector: "six-root", inputs: { padded: "padded", stage: "stage", version: "version" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRoot, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixRoot, isStandalone: false, selector: "six-root", inputs: { padded: "padded", stage: "stage", version: "version" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixRoot = __decorate([
     ProxyCmp({
         inputs: ['padded', 'stage', 'version']
     })
 ], SixRoot);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRoot, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRoot, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-root',
@@ -1042,24 +1484,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['padded', 'stage', 'version'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixSearchField = class SixSearchField {
+    z;
+    el;
+    sixSearchFieldChange = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-search-field-change']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSearchField, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSearchField, selector: "six-search-field", inputs: { clearable: "clearable", debounce: "debounce", disabled: "disabled", placeholder: "placeholder", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSearchField, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSearchField, isStandalone: false, selector: "six-search-field", inputs: { clearable: "clearable", debounce: "debounce", disabled: "disabled", placeholder: "placeholder", value: "value" }, outputs: { sixSearchFieldChange: "sixSearchFieldChange" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSearchField = __decorate([
     ProxyCmp({
         inputs: ['clearable', 'debounce', 'disabled', 'placeholder', 'value']
     })
 ], SixSearchField);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSearchField, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSearchField, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-search-field',
@@ -1067,43 +1512,65 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['clearable', 'debounce', 'disabled', 'placeholder', 'value'],
+                    outputs: ['sixSearchFieldChange:six-search-field-change'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixSearchFieldChange: [{
+                type: Output
+            }] } });
 let SixSelect = class SixSelect {
+    z;
+    el;
+    sixSelectChange = new EventEmitter();
+    sixSelectFocus = new EventEmitter();
+    sixSelectBlur = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-select-change', 'six-select-focus', 'six-select-blur']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSelect, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSelect, selector: "six-select", inputs: { asyncFilter: "asyncFilter", autocomplete: "autocomplete", clearable: "clearable", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", filter: "filter", filterDebounce: "filterDebounce", filterPlaceholder: "filterPlaceholder", helpText: "helpText", hoist: "hoist", inputDebounce: "inputDebounce", invalid: "invalid", label: "label", line: "line", maxTagsVisible: "maxTagsVisible", multiple: "multiple", name: "name", options: "options", pill: "pill", placeholder: "placeholder", required: "required", selectAllButton: "selectAllButton", selectAllText: "selectAllText", size: "size", value: "value", virtualScroll: "virtualScroll" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSelect, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSelect, isStandalone: false, selector: "six-select", inputs: { asyncFilter: "asyncFilter", autocomplete: "autocomplete", clearable: "clearable", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", filter: "filter", filterDebounce: "filterDebounce", filterPlaceholder: "filterPlaceholder", helpText: "helpText", hoist: "hoist", inputDebounce: "inputDebounce", invalid: "invalid", label: "label", line: "line", multiple: "multiple", name: "name", options: "options", pill: "pill", placeholder: "placeholder", required: "required", selectAllButton: "selectAllButton", selectAllText: "selectAllText", size: "size", value: "value", virtualScroll: "virtualScroll" }, outputs: { sixSelectChange: "sixSelectChange", sixSelectFocus: "sixSelectFocus", sixSelectBlur: "sixSelectBlur" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSelect = __decorate([
     ProxyCmp({
-        inputs: ['asyncFilter', 'autocomplete', 'clearable', 'disabled', 'errorText', 'errorTextCount', 'filter', 'filterDebounce', 'filterPlaceholder', 'helpText', 'hoist', 'inputDebounce', 'invalid', 'label', 'line', 'maxTagsVisible', 'multiple', 'name', 'options', 'pill', 'placeholder', 'required', 'selectAllButton', 'selectAllText', 'size', 'value', 'virtualScroll'],
+        inputs: ['asyncFilter', 'autocomplete', 'clearable', 'disabled', 'errorText', 'errorTextCount', 'filter', 'filterDebounce', 'filterPlaceholder', 'helpText', 'hoist', 'inputDebounce', 'invalid', 'label', 'line', 'multiple', 'name', 'options', 'pill', 'placeholder', 'required', 'selectAllButton', 'selectAllText', 'size', 'value', 'virtualScroll'],
         methods: ['setFocus']
     })
 ], SixSelect);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSelect, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSelect, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-select',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['asyncFilter', 'autocomplete', 'clearable', 'disabled', 'errorText', 'errorTextCount', 'filter', 'filterDebounce', 'filterPlaceholder', 'helpText', 'hoist', 'inputDebounce', 'invalid', 'label', 'line', 'maxTagsVisible', 'multiple', 'name', 'options', 'pill', 'placeholder', 'required', 'selectAllButton', 'selectAllText', 'size', 'value', 'virtualScroll'],
+                    inputs: ['asyncFilter', 'autocomplete', 'clearable', 'disabled', 'errorText', 'errorTextCount', 'filter', 'filterDebounce', 'filterPlaceholder', 'helpText', 'hoist', 'inputDebounce', 'invalid', 'label', 'line', 'multiple', 'name', 'options', 'pill', 'placeholder', 'required', 'selectAllButton', 'selectAllText', 'size', 'value', 'virtualScroll'],
+                    outputs: ['sixSelectChange:six-select-change', 'sixSelectFocus:six-select-focus', 'sixSelectBlur:six-select-blur'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixSelectChange: [{
+                type: Output
+            }], sixSelectFocus: [{
+                type: Output
+            }], sixSelectBlur: [{
+                type: Output
+            }] } });
 let SixSidebar = class SixSidebar {
+    z;
+    el;
+    sixSidebarShow = new EventEmitter();
+    sixSidebarAfterShow = new EventEmitter();
+    sixSidebarHide = new EventEmitter();
+    sixSidebarAfterHide = new EventEmitter();
+    sixSidebarInitialFocus = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-sidebar-show', 'six-sidebar-after-show', 'six-sidebar-hide', 'six-sidebar-after-hide', 'six-sidebar-initial-focus']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSidebar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSidebar, selector: "six-sidebar", inputs: { open: "open", position: "position", toggled: "toggled", width: "width" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSidebar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSidebar, isStandalone: false, selector: "six-sidebar", inputs: { open: "open", position: "position", toggled: "toggled", width: "width" }, outputs: { sixSidebarShow: "sixSidebarShow", sixSidebarAfterShow: "sixSidebarAfterShow", sixSidebarHide: "sixSidebarHide", sixSidebarAfterHide: "sixSidebarAfterHide", sixSidebarInitialFocus: "sixSidebarInitialFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSidebar = __decorate([
     ProxyCmp({
@@ -1111,7 +1578,7 @@ SixSidebar = __decorate([
         methods: ['toggle', 'show', 'hide', 'selectItemByIndex', 'selectItemByName']
     })
 ], SixSidebar);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSidebar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSidebar, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-sidebar',
@@ -1119,47 +1586,64 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['open', 'position', 'toggled', 'width'],
+                    outputs: ['sixSidebarShow:six-sidebar-show', 'sixSidebarAfterShow:six-sidebar-after-show', 'sixSidebarHide:six-sidebar-hide', 'sixSidebarAfterHide:six-sidebar-after-hide', 'sixSidebarInitialFocus:six-sidebar-initial-focus'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixSidebarShow: [{
+                type: Output
+            }], sixSidebarAfterShow: [{
+                type: Output
+            }], sixSidebarHide: [{
+                type: Output
+            }], sixSidebarAfterHide: [{
+                type: Output
+            }], sixSidebarInitialFocus: [{
+                type: Output
+            }] } });
 let SixSidebarItem = class SixSidebarItem {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSidebarItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSidebarItem, selector: "six-sidebar-item", inputs: { disabled: "disabled", href: "href", selected: "selected", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSidebarItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSidebarItem, isStandalone: false, selector: "six-sidebar-item", inputs: { disabled: "disabled", href: "href", icon: "icon", selected: "selected", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSidebarItem = __decorate([
     ProxyCmp({
-        inputs: ['disabled', 'href', 'selected', 'value']
+        inputs: ['disabled', 'href', 'icon', 'selected', 'value']
     })
 ], SixSidebarItem);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSidebarItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSidebarItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-sidebar-item',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['disabled', 'href', 'selected', 'value'],
+                    inputs: ['disabled', 'href', 'icon', 'selected', 'value'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixSidebarItemGroup = class SixSidebarItemGroup {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSidebarItemGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSidebarItemGroup, selector: "six-sidebar-item-group", inputs: { href: "href", icon: "icon", name: "name", open: "open", summaryIcon: "summaryIcon", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSidebarItemGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSidebarItemGroup, isStandalone: false, selector: "six-sidebar-item-group", inputs: { href: "href", icon: "icon", name: "name", open: "open", summaryIcon: "summaryIcon", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSidebarItemGroup = __decorate([
     ProxyCmp({
         inputs: ['href', 'icon', 'name', 'open', 'summaryIcon', 'value']
     })
 ], SixSidebarItemGroup);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSidebarItemGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSidebarItemGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-sidebar-item-group',
@@ -1167,23 +1651,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['href', 'icon', 'name', 'open', 'summaryIcon', 'value'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixSpinner = class SixSpinner {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSpinner, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSpinner, selector: "six-spinner", inputs: { logo: "logo", six: "six" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSpinner, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSpinner, isStandalone: false, selector: "six-spinner", inputs: { logo: "logo", six: "six" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSpinner = __decorate([
     ProxyCmp({
         inputs: ['logo', 'six']
     })
 ], SixSpinner);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSpinner, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSpinner, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-spinner',
@@ -1191,23 +1678,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['logo', 'six'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixStageIndicator = class SixStageIndicator {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixStageIndicator, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixStageIndicator, selector: "six-stage-indicator", inputs: { stage: "stage" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixStageIndicator, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixStageIndicator, isStandalone: false, selector: "six-stage-indicator", inputs: { stage: "stage" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixStageIndicator = __decorate([
     ProxyCmp({
         inputs: ['stage']
     })
 ], SixStageIndicator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixStageIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixStageIndicator, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-stage-indicator',
@@ -1215,17 +1705,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['stage'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixSwitch = class SixSwitch {
+    z;
+    el;
+    sixSwitchBlur = new EventEmitter();
+    sixSwitchChange = new EventEmitter();
+    sixSwitchFocus = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-switch-blur', 'six-switch-change', 'six-switch-focus']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSwitch, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixSwitch, selector: "six-switch", inputs: { checked: "checked", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", invalid: "invalid", label: "label", name: "name", required: "required", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSwitch, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixSwitch, isStandalone: false, selector: "six-switch", inputs: { checked: "checked", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", invalid: "invalid", label: "label", name: "name", required: "required", value: "value" }, outputs: { sixSwitchBlur: "sixSwitchBlur", sixSwitchChange: "sixSwitchChange", sixSwitchFocus: "sixSwitchFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixSwitch = __decorate([
     ProxyCmp({
@@ -1233,7 +1728,7 @@ SixSwitch = __decorate([
         methods: ['setFocus', 'removeFocus']
     })
 ], SixSwitch);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixSwitch, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixSwitch, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-switch',
@@ -1241,43 +1736,60 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['checked', 'disabled', 'errorText', 'errorTextCount', 'invalid', 'label', 'name', 'required', 'value'],
+                    outputs: ['sixSwitchBlur:six-switch-blur', 'sixSwitchChange:six-switch-change', 'sixSwitchFocus:six-switch-focus'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixSwitchBlur: [{
+                type: Output
+            }], sixSwitchChange: [{
+                type: Output
+            }], sixSwitchFocus: [{
+                type: Output
+            }] } });
 let SixTab = class SixTab {
+    z;
+    el;
+    sixTabClose = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-tab-close']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTab, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTab, selector: "six-tab", inputs: { active: "active", closable: "closable", disabled: "disabled", panel: "panel" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTab, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTab, isStandalone: false, selector: "six-tab", inputs: { active: "active", closable: "closable", disabled: "disabled", hoverContent: "hoverContent", panel: "panel" }, outputs: { sixTabClose: "sixTabClose" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTab = __decorate([
     ProxyCmp({
-        inputs: ['active', 'closable', 'disabled', 'panel'],
+        inputs: ['active', 'closable', 'disabled', 'hoverContent', 'panel'],
         methods: ['setFocus', 'removeFocus']
     })
 ], SixTab);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTab, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTab, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-tab',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['active', 'closable', 'disabled', 'panel'],
+                    inputs: ['active', 'closable', 'disabled', 'hoverContent', 'panel'],
+                    outputs: ['sixTabClose:six-tab-close'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTabClose: [{
+                type: Output
+            }] } });
 let SixTabGroup = class SixTabGroup {
+    z;
+    el;
+    sixTabShow = new EventEmitter();
+    sixTabHide = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-tab-show', 'six-tab-hide']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTabGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTabGroup, selector: "six-tab-group", inputs: { noScrollControls: "noScrollControls", placement: "placement" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTabGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTabGroup, isStandalone: false, selector: "six-tab-group", inputs: { noScrollControls: "noScrollControls", placement: "placement" }, outputs: { sixTabShow: "sixTabShow", sixTabHide: "sixTabHide" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTabGroup = __decorate([
     ProxyCmp({
@@ -1285,7 +1797,7 @@ SixTabGroup = __decorate([
         methods: ['show']
     })
 ], SixTabGroup);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTabGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTabGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-tab-group',
@@ -1293,23 +1805,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['noScrollControls', 'placement'],
+                    outputs: ['sixTabShow:six-tab-show', 'sixTabHide:six-tab-hide'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTabShow: [{
+                type: Output
+            }], sixTabHide: [{
+                type: Output
+            }] } });
 let SixTabPanel = class SixTabPanel {
+    z;
+    el;
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTabPanel, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTabPanel, selector: "six-tab-panel", inputs: { active: "active", name: "name" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTabPanel, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTabPanel, isStandalone: false, selector: "six-tab-panel", inputs: { active: "active", name: "name" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTabPanel = __decorate([
     ProxyCmp({
         inputs: ['active', 'name']
     })
 ], SixTabPanel);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTabPanel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTabPanel, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-tab-panel',
@@ -1317,24 +1837,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['active', 'name'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
 let SixTag = class SixTag {
+    z;
+    el;
+    sixTagClear = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-tag-clear']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTag, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTag, selector: "six-tag", inputs: { clearable: "clearable", pill: "pill", size: "size", type: "type" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTag, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTag, isStandalone: false, selector: "six-tag", inputs: { clearable: "clearable", pill: "pill", size: "size", type: "type" }, outputs: { sixTagClear: "sixTagClear" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTag = __decorate([
     ProxyCmp({
         inputs: ['clearable', 'pill', 'size', 'type']
     })
 ], SixTag);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTag, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTag, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-tag',
@@ -1342,17 +1865,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['clearable', 'pill', 'size', 'type'],
+                    outputs: ['sixTagClear:six-tag-clear'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTagClear: [{
+                type: Output
+            }] } });
 let SixTextarea = class SixTextarea {
+    z;
+    el;
+    sixTextareaChange = new EventEmitter();
+    sixTextareaInput = new EventEmitter();
+    sixTextareaFocus = new EventEmitter();
+    sixTextareaBlur = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-textarea-change', 'six-textarea-input', 'six-textarea-focus', 'six-textarea-blur']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTextarea, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTextarea, selector: "six-textarea", inputs: { autocapitalize: "autocapitalize", autocomplete: "autocomplete", autocorrect: "autocorrect", autofocus: "autofocus", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", inputmode: "inputmode", invalid: "invalid", label: "label", maxlength: "maxlength", minlength: "minlength", name: "name", placeholder: "placeholder", readonly: "readonly", required: "required", resize: "resize", rows: "rows", size: "size", spellcheck: "spellcheck", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTextarea, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTextarea, isStandalone: false, selector: "six-textarea", inputs: { autocapitalize: "autocapitalize", autocomplete: "autocomplete", autocorrect: "autocorrect", autofocus: "autofocus", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", helpText: "helpText", inputmode: "inputmode", invalid: "invalid", label: "label", maxlength: "maxlength", minlength: "minlength", name: "name", placeholder: "placeholder", readonly: "readonly", required: "required", resize: "resize", rows: "rows", size: "size", spellcheck: "spellcheck", value: "value" }, outputs: { sixTextareaChange: "sixTextareaChange", sixTextareaInput: "sixTextareaInput", sixTextareaFocus: "sixTextareaFocus", sixTextareaBlur: "sixTextareaBlur" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTextarea = __decorate([
     ProxyCmp({
@@ -1360,7 +1892,7 @@ SixTextarea = __decorate([
         methods: ['setFocus', 'removeFocus', 'select', 'setSelectionRange', 'setRangeText']
     })
 ], SixTextarea);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTextarea, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTextarea, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-textarea',
@@ -1368,43 +1900,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'disabled', 'errorText', 'errorTextCount', 'helpText', 'inputmode', 'invalid', 'label', 'maxlength', 'minlength', 'name', 'placeholder', 'readonly', 'required', 'resize', 'rows', 'size', 'spellcheck', 'value'],
+                    outputs: ['sixTextareaChange:six-textarea-change', 'sixTextareaInput:six-textarea-input', 'sixTextareaFocus:six-textarea-focus', 'sixTextareaBlur:six-textarea-blur'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTextareaChange: [{
+                type: Output
+            }], sixTextareaInput: [{
+                type: Output
+            }], sixTextareaFocus: [{
+                type: Output
+            }], sixTextareaBlur: [{
+                type: Output
+            }] } });
 let SixTile = class SixTile {
+    z;
+    el;
+    sixTileClosed = new EventEmitter();
+    sixTileSelected = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-tile-closed', 'six-tile-selected']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTile, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTile, selector: "six-tile", inputs: { closeable: "closeable", disableTooltip: "disableTooltip", disabled: "disabled", elevated: "elevated", iconName: "iconName", label: "label", size: "size" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTile, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTile, isStandalone: false, selector: "six-tile", inputs: { closeable: "closeable", disableTooltip: "disableTooltip", disabled: "disabled", elevated: "elevated", iconName: "iconName", label: "label", library: "library", size: "size" }, outputs: { sixTileClosed: "sixTileClosed", sixTileSelected: "sixTileSelected" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTile = __decorate([
     ProxyCmp({
-        inputs: ['closeable', 'disableTooltip', 'disabled', 'elevated', 'iconName', 'label', 'size'],
+        inputs: ['closeable', 'disableTooltip', 'disabled', 'elevated', 'iconName', 'label', 'library', 'size'],
         methods: ['hide', 'show']
     })
 ], SixTile);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTile, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTile, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-tile',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['closeable', 'disableTooltip', 'disabled', 'elevated', 'iconName', 'label', 'size'],
+                    inputs: ['closeable', 'disableTooltip', 'disabled', 'elevated', 'iconName', 'label', 'library', 'size'],
+                    outputs: ['sixTileClosed:six-tile-closed', 'sixTileSelected:six-tile-selected'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTileClosed: [{
+                type: Output
+            }], sixTileSelected: [{
+                type: Output
+            }] } });
 let SixTimepicker = class SixTimepicker {
+    z;
+    el;
+    sixTimepickerChange = new EventEmitter();
+    sixTimepickerChangeDebounced = new EventEmitter();
+    sixTimepickerClear = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-timepicker-change', 'six-timepicker-change-debounced', 'six-timepicker-clear']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTimepicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTimepicker, selector: "six-timepicker", inputs: { clearable: "clearable", debounce: "debounce", defaultTime: "defaultTime", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", format: "format", hoist: "hoist", iconPosition: "iconPosition", inline: "inline", interval: "interval", invalid: "invalid", label: "label", name: "name", open: "open", placeholder: "placeholder", placement: "placement", readonly: "readonly", required: "required", separator: "separator", size: "size", timeout: "timeout", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTimepicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTimepicker, isStandalone: false, selector: "six-timepicker", inputs: { clearable: "clearable", debounce: "debounce", defaultTime: "defaultTime", disabled: "disabled", errorText: "errorText", errorTextCount: "errorTextCount", format: "format", hoist: "hoist", iconPosition: "iconPosition", inline: "inline", interval: "interval", invalid: "invalid", label: "label", name: "name", open: "open", placeholder: "placeholder", placement: "placement", readonly: "readonly", required: "required", separator: "separator", size: "size", timeout: "timeout", value: "value" }, outputs: { sixTimepickerChange: "sixTimepickerChange", sixTimepickerChangeDebounced: "sixTimepickerChangeDebounced", sixTimepickerClear: "sixTimepickerClear" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTimepicker = __decorate([
     ProxyCmp({
@@ -1412,7 +1967,7 @@ SixTimepicker = __decorate([
         methods: ['setFocus']
     })
 ], SixTimepicker);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTimepicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTimepicker, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-timepicker',
@@ -1420,17 +1975,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['clearable', 'debounce', 'defaultTime', 'disabled', 'errorText', 'errorTextCount', 'format', 'hoist', 'iconPosition', 'inline', 'interval', 'invalid', 'label', 'name', 'open', 'placeholder', 'placement', 'readonly', 'required', 'separator', 'size', 'timeout', 'value'],
+                    outputs: ['sixTimepickerChange:six-timepicker-change', 'sixTimepickerChangeDebounced:six-timepicker-change-debounced', 'sixTimepickerClear:six-timepicker-clear'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTimepickerChange: [{
+                type: Output
+            }], sixTimepickerChangeDebounced: [{
+                type: Output
+            }], sixTimepickerClear: [{
+                type: Output
+            }] } });
 let SixTooltip = class SixTooltip {
+    z;
+    el;
+    sixTooltipShow = new EventEmitter();
+    sixTooltipAfterShow = new EventEmitter();
+    sixTooltipHide = new EventEmitter();
+    sixTooltipAfterHide = new EventEmitter();
     constructor(c, r, z) {
         this.z = z;
         c.detach();
         this.el = r.nativeElement;
-        proxyOutputs(this, this.el, ['six-tooltip-show', 'six-tooltip-after-show', 'six-tooltip-hide', 'six-tooltip-after-hide']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTooltip, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SixTooltip, selector: "six-tooltip", inputs: { content: "content", disabled: "disabled", distance: "distance", open: "open", placement: "placement", skidding: "skidding", trigger: "trigger" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTooltip, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: SixTooltip, isStandalone: false, selector: "six-tooltip", inputs: { content: "content", disabled: "disabled", distance: "distance", open: "open", placement: "placement", skidding: "skidding", trigger: "trigger" }, outputs: { sixTooltipShow: "sixTooltipShow", sixTooltipAfterShow: "sixTooltipAfterShow", sixTooltipHide: "sixTooltipHide", sixTooltipAfterHide: "sixTooltipAfterHide" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 SixTooltip = __decorate([
     ProxyCmp({
@@ -1438,7 +2006,7 @@ SixTooltip = __decorate([
         methods: ['show', 'hide']
     })
 ], SixTooltip);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixTooltip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixTooltip, decorators: [{
             type: Component,
             args: [{
                     selector: 'six-tooltip',
@@ -1446,16 +2014,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['content', 'disabled', 'distance', 'open', 'placement', 'skidding', 'trigger'],
+                    outputs: ['sixTooltipShow:six-tooltip-show', 'sixTooltipAfterShow:six-tooltip-after-show', 'sixTooltipHide:six-tooltip-hide', 'sixTooltipAfterHide:six-tooltip-after-hide'],
+                    standalone: false
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { sixTooltipShow: [{
+                type: Output
+            }], sixTooltipAfterShow: [{
+                type: Output
+            }], sixTooltipHide: [{
+                type: Output
+            }], sixTooltipAfterHide: [{
+                type: Output
+            }] } });
 
 const DIRECTIVES = [
     SixAlert,
     SixAvatar,
     SixBadge,
+    SixBreadcrumbs,
+    SixBreadcrumbsItem,
     SixButton,
     SixCard,
     SixCheckbox,
+    SixDate,
     SixDatepicker,
     SixDetails,
     SixDialog,
@@ -1484,11 +2065,13 @@ const DIRECTIVES = [
     SixMenuDivider,
     SixMenuItem,
     SixMenuLabel,
+    SixPaginator,
     SixPicto,
     SixProgressBar,
     SixProgressRing,
     SixRadio,
     SixRange,
+    SixRating,
     SixRoot,
     SixSearchField,
     SixSelect,
@@ -1512,22 +2095,34 @@ class ValidationMessagesService {
     getErrorMessage(language, error) {
         return getErrorMessage(language, error);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationMessagesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationMessagesService, providedIn: 'root' }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ValidationMessagesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ValidationMessagesService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationMessagesService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ValidationMessagesService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
 
+const DEFAULT_UI_LIBRARY_CONFIG = {
+    showAsteriskOnRequiredValidator: false,
+    disableValidationService: false,
+};
+const UI_LIBRARY_CONFIG = new InjectionToken('UiLibraryConfig');
+
 class ValueAccessor {
+    injector;
+    el;
+    statusChanges;
+    ngControl;
+    initialErrorText;
+    validationMessagesService = inject(ValidationMessagesService);
+    config = inject(UI_LIBRARY_CONFIG);
     constructor(injector, el) {
         this.injector = injector;
         this.el = el;
-        this.validationMessagesService = inject(ValidationMessagesService);
-        this.onChange = () => { };
-        this.onTouched = () => { };
     }
+    onChange = () => { };
+    onTouched = () => { };
     registerOnChange(fn) {
         this.onChange = fn;
     }
@@ -1570,12 +2165,16 @@ class ValueAccessor {
             const element = this.el.nativeElement;
             const control = this.ngControl?.control;
             const invalid = control.status === 'INVALID' && control.dirty && control.touched;
-            let errorTexts;
-            if (invalid) {
-                errorTexts = this.initialErrorText || this.getErrorTexts(control);
-            }
             element.invalid = invalid;
-            element.errorText = errorTexts ?? '';
+            // If the module is configured to do so, display error messages for invalid controls
+            if (!this.config.disableValidationService) {
+                const errorTexts = invalid ? this.initialErrorText || this.getErrorTexts(control) : undefined;
+                element.errorText = errorTexts ?? '';
+            }
+            // When the module is configured to do so, display an asterisk next to any form control that has a required validator
+            if (this.config.showAsteriskOnRequiredValidator && this.ngControl.control.hasValidator(Validators.required)) {
+                element.required = true;
+            }
         });
     }
     setDisabledState(isDisabled) {
@@ -1634,12 +2233,12 @@ class ValueAccessor {
             return (this.validationMessagesService.getErrorMessage(getLanguage(), { key: key, ...value }) ?? key);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ValueAccessor, host: { listeners: { "blur": "_handleBlurEvent($event.target)" } }, ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: ValueAccessor, isStandalone: true, host: { listeners: { "blur": "_handleBlurEvent($event.target)" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ValueAccessor, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { _handleBlurEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { _handleBlurEvent: [{
                 type: HostListener,
                 args: ['blur', ['$event.target']]
             }] } });
@@ -1658,18 +2257,20 @@ class TextValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleInputEvent(el) {
-        this.handleValueChange(el, el.value);
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TextValueAccessor, selector: "six-input:not([type=number]),six-textarea", host: { listeners: { "input": "handleInputEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: TextValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: TextValueAccessor, isStandalone: false, selector: "six-input:not([type=number]),six-textarea", host: { listeners: { "input": "handleInputEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: TextValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: TextValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-input:not([type=number]),six-textarea',
@@ -1680,8 +2281,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleInputEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleInputEvent: [{
                 type: HostListener,
                 args: ['input', ['$event.target']]
             }] } });
@@ -1691,23 +2293,25 @@ class NumericValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleInputEvent(el) {
-        this.handleValueChange(el, el.value);
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
     }
     registerOnChange(fn) {
         super.registerOnChange((value) => {
             fn(value === '' ? null : parseFloat(value));
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NumericValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: NumericValueAccessor, selector: "six-input[type=number]", host: { listeners: { "input": "handleInputEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: NumericValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: NumericValueAccessor, isStandalone: false, selector: "six-input[type=number]", host: { listeners: { "input": "handleInputEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: NumericValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NumericValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: NumericValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-input[type=number]',
@@ -1718,8 +2322,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleInputEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleInputEvent: [{
                 type: HostListener,
                 args: ['input', ['$event.target']]
             }] } });
@@ -1728,8 +2333,13 @@ class RadioValueAccessor extends ValueAccessor {
     constructor(injector, el) {
         super(injector, el);
     }
+    value;
+    formControlName;
+    name;
     handleChangeEvent(el) {
-        this.handleValueChange(el, this.value);
+        if (el) {
+            this.handleValueChange(el, this.value);
+        }
     }
     ngOnInit() {
         this.checkName();
@@ -1750,16 +2360,16 @@ class RadioValueAccessor extends ValueAccessor {
             this.el.nativeElement.name = this.formControlName;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: RadioValueAccessor, selector: "six-radio", inputs: { value: "value", formControlName: "formControlName", name: "name" }, host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: RadioValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: RadioValueAccessor, isStandalone: false, selector: "six-radio", inputs: { value: "value", formControlName: "formControlName", name: "name" }, host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: RadioValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: RadioValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-radio',
@@ -1770,8 +2380,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { value: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { value: [{
                 type: Input
             }], formControlName: [{
                 type: Input
@@ -1787,18 +2398,20 @@ class DatepickerValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleChangeEvent(el) {
-        this.handleValueChange(el, el.value);
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatepickerValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DatepickerValueAccessor, selector: "six-datepicker", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: DatepickerValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: DatepickerValueAccessor, isStandalone: false, selector: "six-datepicker", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: DatepickerValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatepickerValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: DatepickerValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-datepicker',
@@ -1809,8 +2422,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleChangeEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleChangeEvent: [{
                 type: HostListener,
                 args: ['change', ['$event.target']]
             }] } });
@@ -1835,6 +2449,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * an alternative is to use the SixFormUtilDirective.
  */
 class SixFormDirective {
+    elementRef;
+    formGroupDirective;
+    /**
+     * Emits an event when the form is valid and the form submission has been triggered.
+     */
+    sixSubmit = new EventEmitter();
     onNgSubmit(event) {
         if (this.formGroupDirective.invalid) {
             focusInvalidField(this.formGroupDirective, this.elementRef);
@@ -1846,20 +2466,17 @@ class SixFormDirective {
     constructor(elementRef, formGroupDirective) {
         this.elementRef = elementRef;
         this.formGroupDirective = formGroupDirective;
-        /**
-         * Emits an event when the form is valid and the form submission has been triggered.
-         */
-        this.sixSubmit = new EventEmitter();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFormDirective, deps: [{ token: i0.ElementRef }, { token: i1.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SixFormDirective, selector: "form[sixForm]", outputs: { sixSubmit: "sixSubmit" }, host: { listeners: { "ngSubmit": "onNgSubmit($event)" } }, ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFormDirective, deps: [{ token: i0.ElementRef }, { token: i1.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: SixFormDirective, isStandalone: false, selector: "form[sixForm]", outputs: { sixSubmit: "sixSubmit" }, host: { listeners: { "ngSubmit": "onNgSubmit($event)" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFormDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFormDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'form[sixForm]',
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.FormGroupDirective }]; }, propDecorators: { sixSubmit: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.FormGroupDirective }], propDecorators: { sixSubmit: [{
                 type: Output
             }], onNgSubmit: [{
                 type: HostListener,
@@ -1891,6 +2508,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * ```
  */
 class SixFormUtilDirective {
+    elementRef;
+    formGroupDirective;
     constructor(elementRef, formGroupDirective) {
         this.elementRef = elementRef;
         this.formGroupDirective = formGroupDirective;
@@ -1902,15 +2521,16 @@ class SixFormUtilDirective {
     focusInvalidField() {
         focusInvalidField(this.formGroupDirective, this.elementRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFormUtilDirective, deps: [{ token: i0.ElementRef }, { token: i1.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SixFormUtilDirective, selector: "[sixFormUtil]", ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFormUtilDirective, deps: [{ token: i0.ElementRef }, { token: i1.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: SixFormUtilDirective, isStandalone: false, selector: "[sixFormUtil]", ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixFormUtilDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixFormUtilDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[sixFormUtil]',
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.FormGroupDirective }]; } });
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.FormGroupDirective }] });
 function focusInvalidField(formGroupDirective, formElement) {
     formGroupDirective.form.markAllAsTouched();
     markAllAsDirty([formGroupDirective.form]);
@@ -1970,92 +2590,183 @@ class SixUiLibraryValidators {
             return allowed ? null : { invaliddate: { actual: control.value } };
         };
     }
+    static minDateIso(mindate) {
+        return (control) => {
+            if (control.value == null || control.value === '')
+                return null;
+            const actualDate = control.value;
+            return actualDate >= mindate ? null : { mindate: { mindate, actual: actualDate } };
+        };
+    }
+    static maxDateIso(maxdate) {
+        return (control) => {
+            if (control.value == null || control.value === '')
+                return null;
+            const actualDate = control.value;
+            return actualDate <= maxdate ? null : { maxdate: { maxdate, actual: actualDate } };
+        };
+    }
+    static allowedDatesIso(allowedDates = () => true) {
+        return (control) => {
+            if (control.value == null || control.value === '')
+                return null;
+            const allowed = allowedDates(control.value);
+            return allowed ? null : { invaliddate: { actual: control.value } };
+        };
+    }
 }
 class MinDateValidator {
+    min;
     validate(control) {
         if (this.min != null) {
             return SixUiLibraryValidators.minDate(this.min)(control);
         }
         return null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MinDateValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: MinDateValidator, selector: "six-datepicker[min]", inputs: { min: "min" }, providers: [{ provide: NG_VALIDATORS, useExisting: MinDateValidator, multi: true }], ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MinDateValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MinDateValidator, isStandalone: false, selector: "six-datepicker[min]", inputs: { min: "min" }, providers: [{ provide: NG_VALIDATORS, useExisting: MinDateValidator, multi: true }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MinDateValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MinDateValidator, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-datepicker[min]',
                     providers: [{ provide: NG_VALIDATORS, useExisting: MinDateValidator, multi: true }],
+                    standalone: false,
                 }]
         }], propDecorators: { min: [{
                 type: Input
             }] } });
 class MaxDateValidator {
+    max;
     validate(control) {
         if (this.max != null) {
             return SixUiLibraryValidators.maxDate(this.max)(control);
         }
         return null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MaxDateValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: MaxDateValidator, selector: "six-datepicker[max]", inputs: { max: "max" }, providers: [{ provide: NG_VALIDATORS, useExisting: MaxDateValidator, multi: true }], ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MaxDateValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MaxDateValidator, isStandalone: false, selector: "six-datepicker[max]", inputs: { max: "max" }, providers: [{ provide: NG_VALIDATORS, useExisting: MaxDateValidator, multi: true }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MaxDateValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MaxDateValidator, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-datepicker[max]',
                     providers: [{ provide: NG_VALIDATORS, useExisting: MaxDateValidator, multi: true }],
+                    standalone: false,
                 }]
         }], propDecorators: { max: [{
                 type: Input
             }] } });
 class AllowedDatesValidator {
-    constructor() {
-        this.allowedDates = () => true;
-    }
+    allowedDates = () => true;
     validate(control) {
         return SixUiLibraryValidators.allowedDates(this.allowedDates)(control);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AllowedDatesValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AllowedDatesValidator, selector: "six-datepicker[allowedDates]", inputs: { allowedDates: "allowedDates" }, providers: [{ provide: NG_VALIDATORS, useExisting: AllowedDatesValidator, multi: true }], ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AllowedDatesValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: AllowedDatesValidator, isStandalone: false, selector: "six-datepicker[allowedDates]", inputs: { allowedDates: "allowedDates" }, providers: [{ provide: NG_VALIDATORS, useExisting: AllowedDatesValidator, multi: true }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AllowedDatesValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AllowedDatesValidator, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-datepicker[allowedDates]',
                     providers: [{ provide: NG_VALIDATORS, useExisting: AllowedDatesValidator, multi: true }],
+                    standalone: false,
+                }]
+        }], propDecorators: { allowedDates: [{
+                type: Input
+            }] } });
+class MinDateValidatorIso {
+    min;
+    validate(control) {
+        if (this.min != null) {
+            return SixUiLibraryValidators.minDateIso(this.min)(control);
+        }
+        return null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MinDateValidatorIso, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MinDateValidatorIso, isStandalone: false, selector: "six-date[min]", inputs: { min: "min" }, providers: [{ provide: NG_VALIDATORS, useExisting: MinDateValidatorIso, multi: true }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MinDateValidatorIso, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-date[min]',
+                    providers: [{ provide: NG_VALIDATORS, useExisting: MinDateValidatorIso, multi: true }],
+                    standalone: false,
+                }]
+        }], propDecorators: { min: [{
+                type: Input
+            }] } });
+class MaxDateValidatorIso {
+    max;
+    validate(control) {
+        if (this.max != null) {
+            return SixUiLibraryValidators.maxDateIso(this.max)(control);
+        }
+        return null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MaxDateValidatorIso, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MaxDateValidatorIso, isStandalone: false, selector: "six-date[max]", inputs: { max: "max" }, providers: [{ provide: NG_VALIDATORS, useExisting: MaxDateValidatorIso, multi: true }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MaxDateValidatorIso, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-date[max]',
+                    providers: [{ provide: NG_VALIDATORS, useExisting: MaxDateValidatorIso, multi: true }],
+                    standalone: false,
+                }]
+        }], propDecorators: { max: [{
+                type: Input
+            }] } });
+class AllowedDatesValidatorIso {
+    allowedDates = () => true;
+    validate(control) {
+        return SixUiLibraryValidators.allowedDatesIso(this.allowedDates)(control);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AllowedDatesValidatorIso, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: AllowedDatesValidatorIso, isStandalone: false, selector: "six-date[allowedDates]", inputs: { allowedDates: "allowedDates" }, providers: [{ provide: NG_VALIDATORS, useExisting: AllowedDatesValidatorIso, multi: true }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AllowedDatesValidatorIso, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-date[allowedDates]',
+                    providers: [{ provide: NG_VALIDATORS, useExisting: AllowedDatesValidatorIso, multi: true }],
+                    standalone: false,
                 }]
         }], propDecorators: { allowedDates: [{
                 type: Input
             }] } });
 class MinValidator {
+    min;
     validate(control) {
         return Validators.min(toFloat(this.min))(control);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MinValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: MinValidator, selector: "six-input[type=number][min]", inputs: { min: "min" }, providers: [{ provide: NG_VALIDATORS, useExisting: MinValidator, multi: true }], ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MinValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MinValidator, isStandalone: false, selector: "six-input[type=number][min]", inputs: { min: "min" }, providers: [{ provide: NG_VALIDATORS, useExisting: MinValidator, multi: true }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MinValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MinValidator, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-input[type=number][min]',
                     providers: [{ provide: NG_VALIDATORS, useExisting: MinValidator, multi: true }],
+                    standalone: false,
                 }]
         }], propDecorators: { min: [{
                 type: Input
             }] } });
 class MaxValidator {
+    max;
     validate(control) {
         return Validators.max(toFloat(this.max))(control);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MaxValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: MaxValidator, selector: "six-input[type=number][max]", inputs: { max: "max" }, providers: [{ provide: NG_VALIDATORS, useExisting: MaxValidator, multi: true }], ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MaxValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MaxValidator, isStandalone: false, selector: "six-input[type=number][max]", inputs: { max: "max" }, providers: [{ provide: NG_VALIDATORS, useExisting: MaxValidator, multi: true }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MaxValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MaxValidator, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-input[type=number][max]',
                     providers: [{ provide: NG_VALIDATORS, useExisting: MaxValidator, multi: true }],
+                    standalone: false,
                 }]
         }], propDecorators: { max: [{
                 type: Input
@@ -2069,18 +2780,20 @@ class SelectValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleChangeEvent(el) {
-        this.handleValueChange(el, el.value);
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SelectValueAccessor, selector: "six-select", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SelectValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: SelectValueAccessor, isStandalone: false, selector: "six-select", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: SelectValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SelectValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-select',
@@ -2091,8 +2804,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleChangeEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleChangeEvent: [{
                 type: HostListener,
                 args: ['change', ['$event.target']]
             }] } });
@@ -2102,25 +2816,27 @@ class CheckboxValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleChangeEvent(el) {
-        this.handleValueChange(el, el.checked);
+        if (el) {
+            this.handleValueChange(el, el.checked);
+        }
     }
     writeValue(value) {
         this.el.nativeElement.checked = value === true;
         this.updateValidation();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxValueAccessor, selector: "six-checkbox", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CheckboxValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: CheckboxValueAccessor, isStandalone: false, selector: "six-checkbox:not([six-checkbox-group])", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: CheckboxValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CheckboxValueAccessor, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'six-checkbox',
+                    selector: 'six-checkbox:not([six-checkbox-group])',
                     providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
@@ -2128,8 +2844,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleChangeEvent: [{
+                type: HostListener,
+                args: ['change', ['$event.target']]
+            }] } });
+
+class SixCheckboxGroupDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixCheckboxGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: SixCheckboxGroupDirective, isStandalone: false, selector: "[six-checkbox-group]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixCheckboxGroupDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[six-checkbox-group]',
+                    standalone: false,
+                }]
+        }] });
+// Accessor applies only when the SixCheckboxGroupDirective attribute is present
+class CheckboxMultiSelectValueAccessor extends ValueAccessor {
+    value;
+    constructor(injector, el) {
+        super(injector, el);
+    }
+    onHostChange(el) {
+        if (!el)
+            return;
+        const checkbox = el;
+        const checked = checkbox.checked;
+        const current = this.ngControl?.value;
+        if (!current)
+            return;
+        const set = new Set(current);
+        checked ? set.add(this.value) : set.delete(this.value);
+        this.handleValueChange(el, Array.from(set));
+    }
+    writeValue(values) {
+        const arr = Array.isArray(values) ? values : [];
+        const checkbox = this.el.nativeElement;
+        checkbox.checked = arr.includes(this.value);
+        this.updateValidation();
+    }
+    setDisabledState(isDisabled) {
+        this.el.nativeElement.disabled = isDisabled;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CheckboxMultiSelectValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: CheckboxMultiSelectValueAccessor, isStandalone: false, selector: "six-checkbox[six-checkbox-group]", inputs: { value: "value" }, host: { listeners: { "change": "onHostChange($event.target)" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: CheckboxMultiSelectValueAccessor,
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CheckboxMultiSelectValueAccessor, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-checkbox[six-checkbox-group]',
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: CheckboxMultiSelectValueAccessor,
+                            multi: true,
+                        },
+                    ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleChangeEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { value: [{
+                type: Input,
+                args: [{ required: true }]
+            }], onHostChange: [{
                 type: HostListener,
                 args: ['change', ['$event.target']]
             }] } });
@@ -2139,23 +2924,25 @@ class RangeValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleInputEvent(el) {
-        this.handleValueChange(el, el.value);
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
     }
     registerOnChange(fn) {
         super.registerOnChange((value) => {
             fn(value === '' ? null : parseFloat(value));
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: RangeValueAccessor, selector: "six-range", host: { listeners: { "input": "handleInputEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: RangeValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: RangeValueAccessor, isStandalone: false, selector: "six-range", host: { listeners: { "input": "handleInputEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: RangeValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: RangeValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-range',
@@ -2166,8 +2953,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleInputEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleInputEvent: [{
                 type: HostListener,
                 args: ['input', ['$event.target']]
             }] } });
@@ -2177,22 +2965,24 @@ class SwitchValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleChangeEvent(el) {
-        this.handleValueChange(el, el.checked);
+        if (el) {
+            this.handleValueChange(el, el.checked);
+        }
     }
     writeValue(value) {
         this.el.nativeElement.checked = value === true;
         this.updateValidation();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SwitchValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SwitchValueAccessor, selector: "six-switch", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SwitchValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: SwitchValueAccessor, isStandalone: false, selector: "six-switch", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: SwitchValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SwitchValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SwitchValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-switch',
@@ -2203,8 +2993,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleChangeEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleChangeEvent: [{
                 type: HostListener,
                 args: ['change', ['$event.target']]
             }] } });
@@ -2214,18 +3005,20 @@ class TimepickerValueAccessor extends ValueAccessor {
         super(injector, el);
     }
     handleChangeEvent(el) {
-        this.handleValueChange(el, el.value);
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimepickerValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TimepickerValueAccessor, selector: "six-timepicker", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: TimepickerValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: TimepickerValueAccessor, isStandalone: false, selector: "six-timepicker", host: { listeners: { "change": "handleChangeEvent($event.target)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: TimepickerValueAccessor,
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0 }); }
+        ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimepickerValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: TimepickerValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-timepicker',
@@ -2236,8 +3029,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             multi: true,
                         },
                     ],
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { handleChangeEvent: [{
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleChangeEvent: [{
                 type: HostListener,
                 args: ['change', ['$event.target']]
             }] } });
@@ -2246,6 +3040,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Forked from  https://github.com/ionic-team/ionic-framework/blob/main/packages/angular/common/src/directives/navigation/router-link-delegate.ts.
  */
 class SixRouterLinkDirective {
+    locationStrategy;
+    elementRef;
+    router;
+    renderer;
+    routerLinkDirective;
     constructor(locationStrategy, elementRef, router, renderer, routerLinkDirective) {
         this.locationStrategy = locationStrategy;
         this.elementRef = elementRef;
@@ -2257,6 +3056,11 @@ class SixRouterLinkDirective {
         // Prevents the browser from performing a page reload when pressing a SIX-component with routerLink.
         event.preventDefault();
     }
+    routerLink;
+    queryParams;
+    fragment;
+    queryParamsHandling;
+    relativeTo;
     ngOnInit() {
         this.updateTargetUrlAndHref();
     }
@@ -2274,17 +3078,18 @@ class SixRouterLinkDirective {
             this.renderer.removeAttribute(this.elementRef.nativeElement, 'tabindex');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRouterLinkDirective, deps: [{ token: i1$1.LocationStrategy }, { token: i0.ElementRef }, { token: i2.Router }, { token: i0.Renderer2 }, { token: i2.RouterLink, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SixRouterLinkDirective, selector: "six-sidebar-item[routerLink],six-sidebar-item-group[routerLink],six-button[routerLink],six-icon-button[routerLink]", inputs: { routerLink: "routerLink", queryParams: "queryParams", fragment: "fragment", queryParamsHandling: "queryParamsHandling", relativeTo: "relativeTo" }, host: { listeners: { "click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRouterLinkDirective, deps: [{ token: i1$1.LocationStrategy }, { token: i0.ElementRef }, { token: i2.Router }, { token: i0.Renderer2 }, { token: i2.RouterLink, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: SixRouterLinkDirective, isStandalone: false, selector: "six-sidebar-item[routerLink],six-sidebar-item-group[routerLink],six-button[routerLink],six-icon-button[routerLink]", inputs: { routerLink: "routerLink", queryParams: "queryParams", fragment: "fragment", queryParamsHandling: "queryParamsHandling", relativeTo: "relativeTo" }, host: { listeners: { "click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SixRouterLinkDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SixRouterLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'six-sidebar-item[routerLink],six-sidebar-item-group[routerLink],six-button[routerLink],six-icon-button[routerLink]',
+                    standalone: false,
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocationStrategy }, { type: i0.ElementRef }, { type: i2.Router }, { type: i0.Renderer2 }, { type: i2.RouterLink, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.LocationStrategy }, { type: i0.ElementRef }, { type: i2.Router }, { type: i0.Renderer2 }, { type: i2.RouterLink, decorators: [{
                     type: Optional
-                }] }]; }, propDecorators: { onClick: [{
+                }] }], propDecorators: { onClick: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }], routerLink: [{
@@ -2299,8 +3104,157 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }] } });
 
+/**
+ * Enables Angular router integration for the six-sidebar component.
+ *
+ * When this directive is added to a six-sidebar component using the 'sixRouterLinkActive' attribute,
+ * it activates automatic route-based selection for sidebar items and groups.
+ *
+ * @recommended Add this directive to enable automatic route-based navigation in sidebars.
+ *
+ * @example
+ * ```html
+ * <six-sidebar sixRouterLinkActive>
+ *   <six-sidebar-item routerLink="/home">Home</six-sidebar-item>
+ *   <six-sidebar-item-group>
+ *     <six-sidebar-item routerLink="/settings/profile">Profile</six-sidebar-item>
+ *   </six-sidebar-item-group>
+ * </six-sidebar>
+ * ```
+ */
+class ActiveSidebarDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ActiveSidebarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: ActiveSidebarDirective, isStandalone: false, selector: "six-sidebar[sixRouterLinkActive]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ActiveSidebarDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-sidebar[sixRouterLinkActive]',
+                    standalone: false,
+                }]
+        }] });
+/**
+ * Enhances six-sidebar-item with Angular router integration.
+ *
+ * This directive automatically manages the 'selected' state of sidebar items based on the current route.
+ * When used with ActiveSidebarDirective, it switches from manual selection to route-based selection.
+ *
+ * @requires RouterLinkActive
+ * @optional ActiveSidebarDirective - If present, enables route-based selection
+ */
+class ActiveSidebarItemDirective {
+    routerLinkActive = inject(RouterLinkActive);
+    sidebarItem = inject(SixSidebarItem);
+    activeSidebarDirective = inject(ActiveSidebarDirective, { optional: true });
+    get selected() {
+        if (this.activeSidebarDirective == null) {
+            return this.sidebarItem.selected;
+        }
+        else {
+            return this.routerLinkActive.isActive;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ActiveSidebarItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: ActiveSidebarItemDirective, isStandalone: false, selector: "six-sidebar-item", host: { properties: { "selected": "this.selected" } }, hostDirectives: [{ directive: i2.RouterLinkActive }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ActiveSidebarItemDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-sidebar-item',
+                    hostDirectives: [RouterLinkActive],
+                    standalone: false,
+                }]
+        }], propDecorators: { selected: [{
+                type: HostBinding,
+                args: ['selected']
+            }] } });
+/**
+ * Enhances six-sidebar-item-group with Angular router integration.
+ *
+ * This directive automatically manages the 'open' state of sidebar groups based on the active route.
+ * When a child route is active, the group automatically expands to show the active item.
+ *
+ * @requires RouterLinkActive
+ * @optional ActiveSidebarDirective - If present, enables route-based expansion
+ */
+class ActiveSidebarItemGroupDirective {
+    routerLinkActive = inject(RouterLinkActive);
+    sidebarItemGroup = inject(SixSidebarItemGroup);
+    activeSidebarDirective = inject(ActiveSidebarDirective, { optional: true });
+    sidebarItems;
+    get open() {
+        if (this.activeSidebarDirective == null) {
+            return this.sidebarItemGroup.open;
+        }
+        if (this.sidebarItems?.length > 0) {
+            return this.routerLinkActive.isActive ? true : this.sidebarItemGroup.open;
+        }
+        return this.routerLinkActive.isActive;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ActiveSidebarItemGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: ActiveSidebarItemGroupDirective, isStandalone: false, selector: "six-sidebar-item-group", host: { properties: { "open": "this.open" } }, queries: [{ propertyName: "sidebarItems", predicate: SixSidebarItem }], hostDirectives: [{ directive: i2.RouterLinkActive }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ActiveSidebarItemGroupDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-sidebar-item-group',
+                    hostDirectives: [RouterLinkActive],
+                    standalone: false,
+                }]
+        }], propDecorators: { sidebarItems: [{
+                type: ContentChildren,
+                args: [SixSidebarItem]
+            }], open: [{
+                type: HostBinding,
+                args: ['open']
+            }] } });
+
+class DateValueAccessor extends ValueAccessor {
+    constructor(injector, el) {
+        super(injector, el);
+    }
+    handleInputEvent(el) {
+        if (el) {
+            this.handleValueChange(el, el.value);
+        }
+    }
+    writeValue(value) {
+        this.el.nativeElement.value = value == null ? '' : value;
+        this.updateValidation();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: DateValueAccessor, deps: [{ token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: DateValueAccessor, isStandalone: false, selector: "six-date", host: { listeners: { "change": "handleInputEvent($event.target)" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: DateValueAccessor,
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: DateValueAccessor, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'six-date',
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: DateValueAccessor,
+                            multi: true,
+                        },
+                    ],
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { handleInputEvent: [{
+                type: HostListener,
+                args: ['change', ['$event.target']]
+            }] } });
+
 class UiLibraryAngularModule {
-    static forRoot(customValidationMessagesService) {
+    static forRoot(customValidationMessagesService, config) {
+        const mergedConfig = {
+            ...DEFAULT_UI_LIBRARY_CONFIG,
+            ...config,
+        };
         return {
             ngModule: UiLibraryAngularModule,
             providers: [
@@ -2310,19 +3264,23 @@ class UiLibraryAngularModule {
                     multi: true,
                 },
                 { provide: ValidationMessagesService, useClass: customValidationMessagesService ?? ValidationMessagesService },
+                { provide: UI_LIBRARY_CONFIG, useValue: mergedConfig },
             ],
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UiLibraryAngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: UiLibraryAngularModule, declarations: [SixAlert, SixAvatar, SixBadge, SixButton, SixCard, SixCheckbox, SixDatepicker, SixDetails, SixDialog, SixDrawer, SixDropdown, SixError, SixErrorPage, SixFileList, SixFileListItem, SixFileUpload, SixFooter, SixGroupLabel, SixHeader, SixHeaderDropdownItem, SixHeaderItem, SixHeaderMenuButton, SixIcon, SixIconButton, SixInput, SixItemPicker, SixLanguageSwitcher, SixLayoutGrid, SixLogo, SixMainContainer, SixMenu, SixMenuDivider, SixMenuItem, SixMenuLabel, SixPicto, SixProgressBar, SixProgressRing, SixRadio, SixRange, SixRoot, SixSearchField, SixSelect, SixSidebar, SixSidebarItem, SixSidebarItemGroup, SixSpinner, SixStageIndicator, SixSwitch, SixTab, SixTabGroup, SixTabPanel, SixTag, SixTextarea, SixTile, SixTimepicker, SixTooltip, 
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: UiLibraryAngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.1", ngImport: i0, type: UiLibraryAngularModule, declarations: [SixAlert, SixAvatar, SixBadge, SixBreadcrumbs, SixBreadcrumbsItem, SixButton, SixCard, SixCheckbox, SixDate, SixDatepicker, SixDetails, SixDialog, SixDrawer, SixDropdown, SixError, SixErrorPage, SixFileList, SixFileListItem, SixFileUpload, SixFooter, SixGroupLabel, SixHeader, SixHeaderDropdownItem, SixHeaderItem, SixHeaderMenuButton, SixIcon, SixIconButton, SixInput, SixItemPicker, SixLanguageSwitcher, SixLayoutGrid, SixLogo, SixMainContainer, SixMenu, SixMenuDivider, SixMenuItem, SixMenuLabel, SixPaginator, SixPicto, SixProgressBar, SixProgressRing, SixRadio, SixRange, SixRating, SixRoot, SixSearchField, SixSelect, SixSidebar, SixSidebarItem, SixSidebarItemGroup, SixSpinner, SixStageIndicator, SixSwitch, SixTab, SixTabGroup, SixTabPanel, SixTag, SixTextarea, SixTile, SixTimepicker, SixTooltip, 
             // value accessors
             TextValueAccessor,
             NumericValueAccessor,
             RadioValueAccessor,
             DatepickerValueAccessor,
+            DateValueAccessor,
             TimepickerValueAccessor,
             SelectValueAccessor,
             CheckboxValueAccessor,
+            CheckboxMultiSelectValueAccessor,
+            SixCheckboxGroupDirective,
             SwitchValueAccessor,
             RangeValueAccessor,
             // validators
@@ -2331,19 +3289,29 @@ class UiLibraryAngularModule {
             MinDateValidator,
             MaxDateValidator,
             AllowedDatesValidator,
+            MinDateValidatorIso,
+            MaxDateValidatorIso,
+            AllowedDatesValidatorIso,
             // form helpers
             SixFormDirective,
             SixFormUtilDirective,
             // router link directive
-            SixRouterLinkDirective], exports: [SixAlert, SixAvatar, SixBadge, SixButton, SixCard, SixCheckbox, SixDatepicker, SixDetails, SixDialog, SixDrawer, SixDropdown, SixError, SixErrorPage, SixFileList, SixFileListItem, SixFileUpload, SixFooter, SixGroupLabel, SixHeader, SixHeaderDropdownItem, SixHeaderItem, SixHeaderMenuButton, SixIcon, SixIconButton, SixInput, SixItemPicker, SixLanguageSwitcher, SixLayoutGrid, SixLogo, SixMainContainer, SixMenu, SixMenuDivider, SixMenuItem, SixMenuLabel, SixPicto, SixProgressBar, SixProgressRing, SixRadio, SixRange, SixRoot, SixSearchField, SixSelect, SixSidebar, SixSidebarItem, SixSidebarItemGroup, SixSpinner, SixStageIndicator, SixSwitch, SixTab, SixTabGroup, SixTabPanel, SixTag, SixTextarea, SixTile, SixTimepicker, SixTooltip, 
+            SixRouterLinkDirective,
+            // sidebar helpers
+            ActiveSidebarItemDirective,
+            ActiveSidebarItemGroupDirective,
+            ActiveSidebarDirective], exports: [SixAlert, SixAvatar, SixBadge, SixBreadcrumbs, SixBreadcrumbsItem, SixButton, SixCard, SixCheckbox, SixDate, SixDatepicker, SixDetails, SixDialog, SixDrawer, SixDropdown, SixError, SixErrorPage, SixFileList, SixFileListItem, SixFileUpload, SixFooter, SixGroupLabel, SixHeader, SixHeaderDropdownItem, SixHeaderItem, SixHeaderMenuButton, SixIcon, SixIconButton, SixInput, SixItemPicker, SixLanguageSwitcher, SixLayoutGrid, SixLogo, SixMainContainer, SixMenu, SixMenuDivider, SixMenuItem, SixMenuLabel, SixPaginator, SixPicto, SixProgressBar, SixProgressRing, SixRadio, SixRange, SixRating, SixRoot, SixSearchField, SixSelect, SixSidebar, SixSidebarItem, SixSidebarItemGroup, SixSpinner, SixStageIndicator, SixSwitch, SixTab, SixTabGroup, SixTabPanel, SixTag, SixTextarea, SixTile, SixTimepicker, SixTooltip, 
             // value accessors
             TextValueAccessor,
             NumericValueAccessor,
             RadioValueAccessor,
             DatepickerValueAccessor,
+            DateValueAccessor,
             TimepickerValueAccessor,
             SelectValueAccessor,
             CheckboxValueAccessor,
+            CheckboxMultiSelectValueAccessor,
+            SixCheckboxGroupDirective,
             SwitchValueAccessor,
             RangeValueAccessor,
             // validators
@@ -2352,14 +3320,21 @@ class UiLibraryAngularModule {
             MinDateValidator,
             MaxDateValidator,
             AllowedDatesValidator,
+            MinDateValidatorIso,
+            MaxDateValidatorIso,
+            AllowedDatesValidatorIso,
             // form helpers
             SixFormDirective,
             SixFormUtilDirective,
             // router link directive
-            SixRouterLinkDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UiLibraryAngularModule }); }
+            SixRouterLinkDirective,
+            // sidebar helpers
+            ActiveSidebarItemDirective,
+            ActiveSidebarItemGroupDirective,
+            ActiveSidebarDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: UiLibraryAngularModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UiLibraryAngularModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: UiLibraryAngularModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -2370,9 +3345,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         NumericValueAccessor,
                         RadioValueAccessor,
                         DatepickerValueAccessor,
+                        DateValueAccessor,
                         TimepickerValueAccessor,
                         SelectValueAccessor,
                         CheckboxValueAccessor,
+                        CheckboxMultiSelectValueAccessor,
+                        SixCheckboxGroupDirective,
                         SwitchValueAccessor,
                         RangeValueAccessor,
                         // validators
@@ -2381,11 +3359,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         MinDateValidator,
                         MaxDateValidator,
                         AllowedDatesValidator,
+                        MinDateValidatorIso,
+                        MaxDateValidatorIso,
+                        AllowedDatesValidatorIso,
                         // form helpers
                         SixFormDirective,
                         SixFormUtilDirective,
                         // router link directive
                         SixRouterLinkDirective,
+                        // sidebar helpers
+                        ActiveSidebarItemDirective,
+                        ActiveSidebarItemGroupDirective,
+                        ActiveSidebarDirective,
                     ],
                     imports: [],
                     exports: [
@@ -2396,9 +3381,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         NumericValueAccessor,
                         RadioValueAccessor,
                         DatepickerValueAccessor,
+                        DateValueAccessor,
                         TimepickerValueAccessor,
                         SelectValueAccessor,
                         CheckboxValueAccessor,
+                        CheckboxMultiSelectValueAccessor,
+                        SixCheckboxGroupDirective,
                         SwitchValueAccessor,
                         RangeValueAccessor,
                         // validators
@@ -2407,29 +3395,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         MinDateValidator,
                         MaxDateValidator,
                         AllowedDatesValidator,
+                        MinDateValidatorIso,
+                        MaxDateValidatorIso,
+                        AllowedDatesValidatorIso,
                         // form helpers
                         SixFormDirective,
                         SixFormUtilDirective,
                         // router link directive
                         SixRouterLinkDirective,
+                        // sidebar helpers
+                        ActiveSidebarItemDirective,
+                        ActiveSidebarItemGroupDirective,
+                        ActiveSidebarDirective,
                     ],
                 }]
         }] });
 
 class AlertService {
-    constructor() {
-        this.ngZone = inject(NgZone);
-    }
+    ngZone = inject(NgZone);
     /**
      * Displays an alert as a toast notification.
      */
     showAlert(message, alertType, duration, iconName) {
         this.ngZone.runOutsideAngular(() => showAlert(message, alertType, duration, iconName));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlertService, providedIn: 'root' }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AlertService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlertService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AlertService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -2442,5 +3435,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AlertService, AllowedDatesValidator, CheckboxValueAccessor, DIRECTIVES, DatepickerValueAccessor, MaxDateValidator, MaxValidator, MinDateValidator, MinValidator, NumericValueAccessor, RadioValueAccessor, RangeValueAccessor, SelectValueAccessor, SixAlert, SixAvatar, SixBadge, SixButton, SixCard, SixCheckbox, SixDatepicker, SixDetails, SixDialog, SixDrawer, SixDropdown, SixError, SixErrorPage, SixFileList, SixFileListItem, SixFileUpload, SixFooter, SixFormDirective, SixFormUtilDirective, SixGroupLabel, SixHeader, SixHeaderDropdownItem, SixHeaderItem, SixHeaderMenuButton, SixIcon, SixIconButton, SixInput, SixItemPicker, SixLanguageSwitcher, SixLayoutGrid, SixLogo, SixMainContainer, SixMenu, SixMenuDivider, SixMenuItem, SixMenuLabel, SixPicto, SixProgressBar, SixProgressRing, SixRadio, SixRange, SixRoot, SixRouterLinkDirective, SixSearchField, SixSelect, SixSidebar, SixSidebarItem, SixSidebarItemGroup, SixSpinner, SixStageIndicator, SixSwitch, SixTab, SixTabGroup, SixTabPanel, SixTag, SixTextarea, SixTile, SixTimepicker, SixTooltip, SixUiLibraryValidators, SwitchValueAccessor, TextValueAccessor, TimepickerValueAccessor, UiLibraryAngularModule, ValidationMessagesService, ValueAccessor };
+export { ActiveSidebarDirective, ActiveSidebarItemDirective, ActiveSidebarItemGroupDirective, AlertService, AllowedDatesValidator, AllowedDatesValidatorIso, CheckboxMultiSelectValueAccessor, CheckboxValueAccessor, DIRECTIVES, DateValueAccessor, DatepickerValueAccessor, MaxDateValidator, MaxDateValidatorIso, MaxValidator, MinDateValidator, MinDateValidatorIso, MinValidator, NumericValueAccessor, RadioValueAccessor, RangeValueAccessor, SelectValueAccessor, SixAlert, SixAvatar, SixBadge, SixBreadcrumbs, SixBreadcrumbsItem, SixButton, SixCard, SixCheckbox, SixCheckboxGroupDirective, SixDate, SixDatepicker, SixDetails, SixDialog, SixDrawer, SixDropdown, SixError, SixErrorPage, SixFileList, SixFileListItem, SixFileUpload, SixFooter, SixFormDirective, SixFormUtilDirective, SixGroupLabel, SixHeader, SixHeaderDropdownItem, SixHeaderItem, SixHeaderMenuButton, SixIcon, SixIconButton, SixInput, SixItemPicker, SixLanguageSwitcher, SixLayoutGrid, SixLogo, SixMainContainer, SixMenu, SixMenuDivider, SixMenuItem, SixMenuLabel, SixPaginator, SixPicto, SixProgressBar, SixProgressRing, SixRadio, SixRange, SixRating, SixRoot, SixRouterLinkDirective, SixSearchField, SixSelect, SixSidebar, SixSidebarItem, SixSidebarItemGroup, SixSpinner, SixStageIndicator, SixSwitch, SixTab, SixTabGroup, SixTabPanel, SixTag, SixTextarea, SixTile, SixTimepicker, SixTooltip, SixUiLibraryValidators, SwitchValueAccessor, TextValueAccessor, TimepickerValueAccessor, UiLibraryAngularModule, ValidationMessagesService, ValueAccessor };
 //# sourceMappingURL=six-group-ui-library-angular.mjs.map