suis 3.0.0 → 3.0.1

package/README.md

@@ -10,4 +10,4 @@ Angular UI component library for dashboard systems development. Supports Angular
 | ------- | ----- |
 | 16.2.0 | 1.8.2 |
 | 17.1.0 | 2.0.1 |
-| 18.2.0 | 3.0.0 |
+| 18.2.0 | 3.0.1 |

package/esm2022/lib/components/suis-input-checkbox/suis-input-checkbox.component.mjs

@@ -13,7 +13,7 @@ export class SuisInputCheckboxComponent extends SuisCheckboxBase {
                 multi: true,
                 useExisting: forwardRef(() => SuisInputCheckboxComponent),
             },
-        ], usesInheritance: true, ngImport: i0, template: "<input\r\n  #input\r\n  type=\"checkbox\"\r\n  class=\"suis-input-checkbox\"\r\n  [attr.id]=\"id\"\r\n  [attr.name]=\"name\"\r\n  [value]=\"value\"\r\n  [disabled]=\"readonly\"\r\n  (change)=\"onChange($event)\"\r\n  (focus)=\"onTouch()\"\r\n/>\r\n\r\n<suis-label\r\n  class=\"suis-input-checkbox__label\"\r\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\r\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\r\n  [for]=\"id\"\r\n  [required]=\"required\"\r\n  [pointer]=\"true\"\r\n  [readonly]=\"readonly\"\r\n>\r\n  <div\r\n    [tabindex]=\"readonly ? -1 : 0\"\r\n    class=\"suis-input-checkbox__check\"\r\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\r\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\r\n  >\r\n    <suis-icon\r\n      *ngIf=\"value\"\r\n      type=\"check\"\r\n      size=\"lg\"\r\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\r\n    ></suis-icon>\r\n  </div>\r\n  <ng-content></ng-content>\r\n</suis-label>\r\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<input\n  type=\"checkbox\"\n  class=\"suis-input-checkbox\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-input-checkbox__label\"\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-input-checkbox__check\"\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\n  >\n    <suis-icon\n      *ngIf=\"value\"\n      type=\"check\"\n      size=\"lg\"\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\n    ></suis-icon>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisInputCheckboxComponent, decorators: [{
             type: Component,
@@ -23,6 +23,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             multi: true,
                             useExisting: forwardRef(() => SuisInputCheckboxComponent),
                         },
-                    ], template: "<input\r\n  #input\r\n  type=\"checkbox\"\r\n  class=\"suis-input-checkbox\"\r\n  [attr.id]=\"id\"\r\n  [attr.name]=\"name\"\r\n  [value]=\"value\"\r\n  [disabled]=\"readonly\"\r\n  (change)=\"onChange($event)\"\r\n  (focus)=\"onTouch()\"\r\n/>\r\n\r\n<suis-label\r\n  class=\"suis-input-checkbox__label\"\r\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\r\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\r\n  [for]=\"id\"\r\n  [required]=\"required\"\r\n  [pointer]=\"true\"\r\n  [readonly]=\"readonly\"\r\n>\r\n  <div\r\n    [tabindex]=\"readonly ? -1 : 0\"\r\n    class=\"suis-input-checkbox__check\"\r\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\r\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\r\n  >\r\n    <suis-icon\r\n      *ngIf=\"value\"\r\n      type=\"check\"\r\n      size=\"lg\"\r\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\r\n    ></suis-icon>\r\n  </div>\r\n  <ng-content></ng-content>\r\n</suis-label>\r\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"] }]
+                    ], template: "<input\n  type=\"checkbox\"\n  class=\"suis-input-checkbox\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-input-checkbox__label\"\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-input-checkbox__check\"\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\n  >\n    <suis-icon\n      *ngIf=\"value\"\n      type=\"check\"\n      size=\"lg\"\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\n    ></suis-icon>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"] }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtaW5wdXQtY2hlY2tib3gvc3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtaW5wdXQtY2hlY2tib3gvc3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvRSxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDdkMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFDeEUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbkQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFDckUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0seUNBQXlDLENBQUM7O0FBaUIzRSxNQUFNLE9BQU8sMEJBQTJCLFNBQVEsZ0JBQWdCOytHQUFuRCwwQkFBMEI7bUdBQTFCLDBCQUEwQixrRUFSMUI7WUFDVDtnQkFDRSxPQUFPLEVBQUUsaUJBQWlCO2dCQUMxQixLQUFLLEVBQUUsSUFBSTtnQkFDWCxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLDBCQUEwQixDQUFDO2FBQzFEO1NBQ0YsaURDcEJILGkrQkFvQ0EsbzVCRDFCWSxJQUFJLDZGQUFFLGtCQUFrQiwyR0FBRSxpQkFBaUI7OzRGQVkxQywwQkFBMEI7a0JBZnRDLFNBQVM7K0JBQ0UscUJBQXFCLGNBQ25CLElBQUksV0FDUCxDQUFDLElBQUksRUFBRSxrQkFBa0IsRUFBRSxpQkFBaUIsQ0FBQyxtQkFHckMsdUJBQXVCLENBQUMsTUFBTSxhQUNwQzt3QkFDVDs0QkFDRSxPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixLQUFLLEVBQUUsSUFBSTs0QkFDWCxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSwyQkFBMkIsQ0FBQzt5QkFDMUQ7cUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBmb3J3YXJkUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOZ0lmIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IFN1aXNMYWJlbENvbXBvbmVudCB9IGZyb20gJy4uL3N1aXMtbGFiZWwvc3Vpcy1sYWJlbC5jb21wb25lbnQnO1xuaW1wb3J0IHsgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBTdWlzSWNvbkNvbXBvbmVudCB9IGZyb20gJy4uL3N1aXMtaWNvbi9zdWlzLWljb24uY29tcG9uZW50JztcbmltcG9ydCB7IFN1aXNDaGVja2JveEJhc2UgfSBmcm9tICcuLi8uLi9zaGFyZWQvY2xhc3Nlcy9zdWlzLWNoZWNrYm94LmJhc2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWlzLWlucHV0LWNoZWNrYm94JyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW05nSWYsIFN1aXNMYWJlbENvbXBvbmVudCwgU3Vpc0ljb25Db21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vc3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3N1aXMtaW5wdXQtY2hlY2tib3guY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHByb3ZpZGVyczogW1xuICAgIHtcbiAgICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgICAgbXVsdGk6IHRydWUsXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBTdWlzSW5wdXRDaGVja2JveENvbXBvbmVudCksXG4gICAgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc0lucHV0Q2hlY2tib3hDb21wb25lbnQgZXh0ZW5kcyBTdWlzQ2hlY2tib3hCYXNlIHt9XG4iLCI8aW5wdXRcclxuICAjaW5wdXRcclxuICB0eXBlPVwiY2hlY2tib3hcIlxyXG4gIGNsYXNzPVwic3Vpcy1pbnB1dC1jaGVja2JveFwiXHJcbiAgW2F0dHIuaWRdPVwiaWRcIlxyXG4gIFthdHRyLm5hbWVdPVwibmFtZVwiXHJcbiAgW3ZhbHVlXT1cInZhbHVlXCJcclxuICBbZGlzYWJsZWRdPVwicmVhZG9ubHlcIlxyXG4gIChjaGFuZ2UpPVwib25DaGFuZ2UoJGV2ZW50KVwiXHJcbiAgKGZvY3VzKT1cIm9uVG91Y2goKVwiXHJcbi8+XHJcblxyXG48c3Vpcy1sYWJlbFxyXG4gIGNsYXNzPVwic3Vpcy1pbnB1dC1jaGVja2JveF9fbGFiZWxcIlxyXG4gIFtjbGFzcy5zdWlzLWlucHV0LWNoZWNrYm94X19sYWJlbC0taW52YWxpZF09XCJpbnZhbGlkXCJcclxuICBbY2xhc3Muc3Vpcy1pbnB1dC1jaGVja2JveF9fbGFiZWwtLXJlYWRvbmx5XT1cInJlYWRvbmx5XCJcclxuICBbZm9yXT1cImlkXCJcclxuICBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxyXG4gIFtwb2ludGVyXT1cInRydWVcIlxyXG4gIFtyZWFkb25seV09XCJyZWFkb25seVwiXHJcbj5cclxuICA8ZGl2XHJcbiAgICBbdGFiaW5kZXhdPVwicmVhZG9ubHkgPyAtMSA6IDBcIlxyXG4gICAgY2xhc3M9XCJzdWlzLWlucHV0LWNoZWNrYm94X19jaGVja1wiXHJcbiAgICBbY2xhc3Muc3Vpcy1pbnB1dC1jaGVja2JveF9fY2hlY2stLWludmFsaWRdPVwiaW52YWxpZFwiXHJcbiAgICBbY2xhc3Muc3Vpcy1pbnB1dC1jaGVja2JveF9fY2hlY2stLXJlYWRvbmx5XT1cInJlYWRvbmx5XCJcclxuICA+XHJcbiAgICA8c3Vpcy1pY29uXHJcbiAgICAgICpuZ0lmPVwidmFsdWVcIlxyXG4gICAgICB0eXBlPVwiY2hlY2tcIlxyXG4gICAgICBzaXplPVwibGdcIlxyXG4gICAgICBbY29sb3JdPVwicmVhZG9ubHkgPyAndGVydGlhcnknIDogJ3ByaW1hcnknXCJcclxuICAgID48L3N1aXMtaWNvbj5cclxuICA8L2Rpdj5cclxuICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XHJcbjwvc3Vpcy1sYWJlbD5cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtaW5wdXQtY2hlY2tib3gvc3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtaW5wdXQtY2hlY2tib3gvc3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvRSxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDdkMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFDeEUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbkQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFDckUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0seUNBQXlDLENBQUM7O0FBaUIzRSxNQUFNLE9BQU8sMEJBQTJCLFNBQVEsZ0JBQWdCOytHQUFuRCwwQkFBMEI7bUdBQTFCLDBCQUEwQixrRUFSMUI7WUFDVDtnQkFDRSxPQUFPLEVBQUUsaUJBQWlCO2dCQUMxQixLQUFLLEVBQUUsSUFBSTtnQkFDWCxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLDBCQUEwQixDQUFDO2FBQzFEO1NBQ0YsaURDcEJILHEzQkFrQ0EsbzVCRHhCWSxJQUFJLDZGQUFFLGtCQUFrQiwyR0FBRSxpQkFBaUI7OzRGQVkxQywwQkFBMEI7a0JBZnRDLFNBQVM7K0JBQ0UscUJBQXFCLGNBQ25CLElBQUksV0FDUCxDQUFDLElBQUksRUFBRSxrQkFBa0IsRUFBRSxpQkFBaUIsQ0FBQyxtQkFHckMsdUJBQXVCLENBQUMsTUFBTSxhQUNwQzt3QkFDVDs0QkFDRSxPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixLQUFLLEVBQUUsSUFBSTs0QkFDWCxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSwyQkFBMkIsQ0FBQzt5QkFDMUQ7cUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBmb3J3YXJkUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOZ0lmIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IFN1aXNMYWJlbENvbXBvbmVudCB9IGZyb20gJy4uL3N1aXMtbGFiZWwvc3Vpcy1sYWJlbC5jb21wb25lbnQnO1xuaW1wb3J0IHsgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBTdWlzSWNvbkNvbXBvbmVudCB9IGZyb20gJy4uL3N1aXMtaWNvbi9zdWlzLWljb24uY29tcG9uZW50JztcbmltcG9ydCB7IFN1aXNDaGVja2JveEJhc2UgfSBmcm9tICcuLi8uLi9zaGFyZWQvY2xhc3Nlcy9zdWlzLWNoZWNrYm94LmJhc2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWlzLWlucHV0LWNoZWNrYm94JyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW05nSWYsIFN1aXNMYWJlbENvbXBvbmVudCwgU3Vpc0ljb25Db21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vc3Vpcy1pbnB1dC1jaGVja2JveC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3N1aXMtaW5wdXQtY2hlY2tib3guY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHByb3ZpZGVyczogW1xuICAgIHtcbiAgICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgICAgbXVsdGk6IHRydWUsXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBTdWlzSW5wdXRDaGVja2JveENvbXBvbmVudCksXG4gICAgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc0lucHV0Q2hlY2tib3hDb21wb25lbnQgZXh0ZW5kcyBTdWlzQ2hlY2tib3hCYXNlIHt9XG4iLCI8aW5wdXRcbiAgdHlwZT1cImNoZWNrYm94XCJcbiAgY2xhc3M9XCJzdWlzLWlucHV0LWNoZWNrYm94XCJcbiAgW2F0dHIuaWRdPVwiaWRcIlxuICBbYXR0ci5uYW1lXT1cIm5hbWVcIlxuICBbdmFsdWVdPVwidmFsdWVcIlxuICBbZGlzYWJsZWRdPVwicmVhZG9ubHlcIlxuLz5cblxuPHN1aXMtbGFiZWxcbiAgY2xhc3M9XCJzdWlzLWlucHV0LWNoZWNrYm94X19sYWJlbFwiXG4gIFtjbGFzcy5zdWlzLWlucHV0LWNoZWNrYm94X19sYWJlbC0taW52YWxpZF09XCJpbnZhbGlkXCJcbiAgW2NsYXNzLnN1aXMtaW5wdXQtY2hlY2tib3hfX2xhYmVsLS1yZWFkb25seV09XCJyZWFkb25seVwiXG4gIFtmb3JdPVwiaWRcIlxuICBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICBbcG9pbnRlcl09XCJ0cnVlXCJcbiAgW3JlYWRvbmx5XT1cInJlYWRvbmx5XCJcbiAgKGNsaWNrKT1cIm9uQ2hhbmdlKCRldmVudClcIlxuPlxuICA8ZGl2XG4gICAgW3RhYmluZGV4XT1cInJlYWRvbmx5ID8gLTEgOiAwXCJcbiAgICBjbGFzcz1cInN1aXMtaW5wdXQtY2hlY2tib3hfX2NoZWNrXCJcbiAgICBbY2xhc3Muc3Vpcy1pbnB1dC1jaGVja2JveF9fY2hlY2stLWludmFsaWRdPVwiaW52YWxpZFwiXG4gICAgW2NsYXNzLnN1aXMtaW5wdXQtY2hlY2tib3hfX2NoZWNrLS1yZWFkb25seV09XCJyZWFkb25seVwiXG4gID5cbiAgICA8c3Vpcy1pY29uXG4gICAgICAqbmdJZj1cInZhbHVlXCJcbiAgICAgIHR5cGU9XCJjaGVja1wiXG4gICAgICBzaXplPVwibGdcIlxuICAgICAgW2NvbG9yXT1cInJlYWRvbmx5ID8gJ3RlcnRpYXJ5JyA6ICdwcmltYXJ5J1wiXG4gICAgPjwvc3Vpcy1pY29uPlxuICA8L2Rpdj5cbiAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuPC9zdWlzLWxhYmVsPlxuIl19

package/esm2022/lib/components/suis-toggle/suis-toggle.component.mjs

@@ -11,7 +11,7 @@ export class SuisToggleComponent extends SuisCheckboxBase {
                 multi: true,
                 useExisting: forwardRef(() => SuisToggleComponent),
             },
-        ], usesInheritance: true, ngImport: i0, template: "<input\n  #input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n  (input)=\"onChange($event)\"\n  (focus)=\"onTouch()\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"], dependencies: [{ kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"], dependencies: [{ kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisToggleComponent, decorators: [{
             type: Component,
@@ -21,6 +21,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             multi: true,
                             useExisting: forwardRef(() => SuisToggleComponent),
                         },
-                    ], template: "<input\n  #input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n  (input)=\"onChange($event)\"\n  (focus)=\"onTouch()\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"] }]
+                    ], template: "<input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"] }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy10b2dnbGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvY29tcG9uZW50cy9zdWlzLXRvZ2dsZS9zdWlzLXRvZ2dsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtdG9nZ2xlL3N1aXMtdG9nZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHlDQUF5QyxDQUFDO0FBQzNFLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ25ELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFpQm5ELE1BQU0sT0FBTyxtQkFBb0IsU0FBUSxnQkFBZ0I7K0dBQTVDLG1CQUFtQjttR0FBbkIsbUJBQW1CLDBEQVJuQjtZQUNUO2dCQUNFLE9BQU8sRUFBRSxpQkFBaUI7Z0JBQzFCLEtBQUssRUFBRSxJQUFJO2dCQUNYLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsbUJBQW1CLENBQUM7YUFDbkQ7U0FDRixpRENsQkgsKzlCQW9DQSw4eENENUJZLGtCQUFrQjs7NEZBWWpCLG1CQUFtQjtrQkFmL0IsU0FBUzsrQkFDRSxhQUFhLGNBQ1gsSUFBSSxXQUNQLENBQUMsa0JBQWtCLENBQUMsbUJBR1osdUJBQXVCLENBQUMsTUFBTSxhQUNwQzt3QkFDVDs0QkFDRSxPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixLQUFLLEVBQUUsSUFBSTs0QkFDWCxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxvQkFBb0IsQ0FBQzt5QkFDbkQ7cUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBmb3J3YXJkUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWlzQ2hlY2tib3hCYXNlIH0gZnJvbSAnLi4vLi4vc2hhcmVkL2NsYXNzZXMvc3Vpcy1jaGVja2JveC5iYXNlJztcbmltcG9ydCB7IE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgU3Vpc0xhYmVsQ29tcG9uZW50IH0gZnJvbSAnLi4vc3Vpcy1sYWJlbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N1aXMtdG9nZ2xlJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW1N1aXNMYWJlbENvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9zdWlzLXRvZ2dsZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3N1aXMtdG9nZ2xlLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcm92aWRlcnM6IFtcbiAgICB7XG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcbiAgICAgIG11bHRpOiB0cnVlLFxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gU3Vpc1RvZ2dsZUNvbXBvbmVudCksXG4gICAgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc1RvZ2dsZUNvbXBvbmVudCBleHRlbmRzIFN1aXNDaGVja2JveEJhc2Uge31cbiIsIjxpbnB1dFxuICAjaW5wdXRcbiAgdHlwZT1cImNoZWNrYm94XCJcbiAgY2xhc3M9XCJzdWlzLXRvZ2dsZVwiXG4gIFthdHRyLmlkXT1cImlkXCJcbiAgW2F0dHIubmFtZV09XCJuYW1lXCJcbiAgW3ZhbHVlXT1cInZhbHVlXCJcbiAgW2Rpc2FibGVkXT1cInJlYWRvbmx5XCJcbiAgKGlucHV0KT1cIm9uQ2hhbmdlKCRldmVudClcIlxuICAoZm9jdXMpPVwib25Ub3VjaCgpXCJcbi8+XG5cbjxzdWlzLWxhYmVsXG4gIGNsYXNzPVwic3Vpcy10b2dnbGVfX2xhYmVsXCJcbiAgW2NsYXNzLnN1aXMtdG9nZ2xlX19sYWJlbC0taW52YWxpZF09XCJpbnZhbGlkXCJcbiAgW2NsYXNzLnN1aXMtdG9nZ2xlX19sYWJlbC0tcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICBbZm9yXT1cImlkXCJcbiAgW3JlcXVpcmVkXT1cInJlcXVpcmVkXCJcbiAgW3BvaW50ZXJdPVwidHJ1ZVwiXG4gIFtyZWFkb25seV09XCJyZWFkb25seVwiXG4+XG4gIDxkaXZcbiAgICBbdGFiaW5kZXhdPVwicmVhZG9ubHkgPyAtMSA6IDBcIlxuICAgIGNsYXNzPVwic3Vpcy10b2dnbGVfX2NvbnRhaW5lclwiXG4gICAgW2NsYXNzLnN1aXMtdG9nZ2xlX19jb250YWluZXItLWludmFsaWRdPVwiaW52YWxpZFwiXG4gICAgW2NsYXNzLnN1aXMtdG9nZ2xlX19jb250YWluZXItLXJlYWRvbmx5XT1cInJlYWRvbmx5XCJcbiAgPlxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwic3Vpcy10b2dnbGVfX2NvbnRhaW5lcl9fdGh1bWJcIlxuICAgICAgW2NsYXNzLnN1aXMtdG9nZ2xlX19jb250YWluZXJfX3RodW1iLS1hY3RpdmVdPVwidmFsdWVcIlxuICAgICAgW2NsYXNzLnN1aXMtdG9nZ2xlX19jb250YWluZXJfX3RodW1iLS1pbnZhbGlkXT1cImludmFsaWRcIlxuICAgICAgW2NsYXNzLnN1aXMtdG9nZ2xlX19jb250YWluZXJfX3RodW1iLS1yZWFkb25seV09XCJyZWFkb25seVwiXG4gICAgPjwvZGl2PlxuICA8L2Rpdj5cbiAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuPC9zdWlzLWxhYmVsPlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy10b2dnbGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvY29tcG9uZW50cy9zdWlzLXRvZ2dsZS9zdWlzLXRvZ2dsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtdG9nZ2xlL3N1aXMtdG9nZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHlDQUF5QyxDQUFDO0FBQzNFLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ25ELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFpQm5ELE1BQU0sT0FBTyxtQkFBb0IsU0FBUSxnQkFBZ0I7K0dBQTVDLG1CQUFtQjttR0FBbkIsbUJBQW1CLDBEQVJuQjtZQUNUO2dCQUNFLE9BQU8sRUFBRSxpQkFBaUI7Z0JBQzFCLEtBQUssRUFBRSxJQUFJO2dCQUNYLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsbUJBQW1CLENBQUM7YUFDbkQ7U0FDRixpRENsQkgsNDdCQWtDQSw4eENEMUJZLGtCQUFrQjs7NEZBWWpCLG1CQUFtQjtrQkFmL0IsU0FBUzsrQkFDRSxhQUFhLGNBQ1gsSUFBSSxXQUNQLENBQUMsa0JBQWtCLENBQUMsbUJBR1osdUJBQXVCLENBQUMsTUFBTSxhQUNwQzt3QkFDVDs0QkFDRSxPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixLQUFLLEVBQUUsSUFBSTs0QkFDWCxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxvQkFBb0IsQ0FBQzt5QkFDbkQ7cUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBmb3J3YXJkUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWlzQ2hlY2tib3hCYXNlIH0gZnJvbSAnLi4vLi4vc2hhcmVkL2NsYXNzZXMvc3Vpcy1jaGVja2JveC5iYXNlJztcbmltcG9ydCB7IE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgU3Vpc0xhYmVsQ29tcG9uZW50IH0gZnJvbSAnLi4vc3Vpcy1sYWJlbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N1aXMtdG9nZ2xlJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW1N1aXNMYWJlbENvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9zdWlzLXRvZ2dsZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3N1aXMtdG9nZ2xlLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcm92aWRlcnM6IFtcbiAgICB7XG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcbiAgICAgIG11bHRpOiB0cnVlLFxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gU3Vpc1RvZ2dsZUNvbXBvbmVudCksXG4gICAgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc1RvZ2dsZUNvbXBvbmVudCBleHRlbmRzIFN1aXNDaGVja2JveEJhc2Uge31cbiIsIjxpbnB1dFxuICB0eXBlPVwiY2hlY2tib3hcIlxuICBjbGFzcz1cInN1aXMtdG9nZ2xlXCJcbiAgW2F0dHIuaWRdPVwiaWRcIlxuICBbYXR0ci5uYW1lXT1cIm5hbWVcIlxuICBbdmFsdWVdPVwidmFsdWVcIlxuICBbZGlzYWJsZWRdPVwicmVhZG9ubHlcIlxuLz5cblxuPHN1aXMtbGFiZWxcbiAgY2xhc3M9XCJzdWlzLXRvZ2dsZV9fbGFiZWxcIlxuICBbY2xhc3Muc3Vpcy10b2dnbGVfX2xhYmVsLS1pbnZhbGlkXT1cImludmFsaWRcIlxuICBbY2xhc3Muc3Vpcy10b2dnbGVfX2xhYmVsLS1yZWFkb25seV09XCJyZWFkb25seVwiXG4gIFtmb3JdPVwiaWRcIlxuICBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICBbcG9pbnRlcl09XCJ0cnVlXCJcbiAgW3JlYWRvbmx5XT1cInJlYWRvbmx5XCJcbiAgKGNsaWNrKT1cIm9uQ2hhbmdlKCRldmVudClcIlxuPlxuICA8ZGl2XG4gICAgW3RhYmluZGV4XT1cInJlYWRvbmx5ID8gLTEgOiAwXCJcbiAgICBjbGFzcz1cInN1aXMtdG9nZ2xlX19jb250YWluZXJcIlxuICAgIFtjbGFzcy5zdWlzLXRvZ2dsZV9fY29udGFpbmVyLS1pbnZhbGlkXT1cImludmFsaWRcIlxuICAgIFtjbGFzcy5zdWlzLXRvZ2dsZV9fY29udGFpbmVyLS1yZWFkb25seV09XCJyZWFkb25seVwiXG4gID5cbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cInN1aXMtdG9nZ2xlX19jb250YWluZXJfX3RodW1iXCJcbiAgICAgIFtjbGFzcy5zdWlzLXRvZ2dsZV9fY29udGFpbmVyX190aHVtYi0tYWN0aXZlXT1cInZhbHVlXCJcbiAgICAgIFtjbGFzcy5zdWlzLXRvZ2dsZV9fY29udGFpbmVyX190aHVtYi0taW52YWxpZF09XCJpbnZhbGlkXCJcbiAgICAgIFtjbGFzcy5zdWlzLXRvZ2dsZV9fY29udGFpbmVyX190aHVtYi0tcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICAgID48L2Rpdj5cbiAgPC9kaXY+XG4gIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbjwvc3Vpcy1sYWJlbD5cbiJdfQ==

package/esm2022/lib/shared/classes/suis-checkbox.base.mjs

@@ -1,4 +1,4 @@
-import { Directive, ElementRef, Input, ViewChild, } from '@angular/core';
+import { Directive, Input } from '@angular/core';
 import { SuisInputBase } from './suis-input.base';
 import * as i0 from "@angular/core";
 export class SuisCheckboxBase extends SuisInputBase {
@@ -11,31 +11,24 @@ export class SuisCheckboxBase extends SuisInputBase {
          */
         this.required = false;
     }
-    ngAfterViewInit() {
-        if (this.value)
-            (this.checkboxInput?.nativeElement).checked = true;
-    }
     writeValue(obj) {
         this.value = obj;
         this._onChange(this.value);
         this.cdRef.markForCheck();
     }
     onChange(event) {
-        const target = event.target;
-        this.value = target.checked;
+        event.stopPropagation();
+        this.value = !this.value;
         this._onChange(this.value);
         this.changed.emit(this.value);
         this.cdRef.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisCheckboxBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SuisCheckboxBase, inputs: { required: "required" }, viewQueries: [{ propertyName: "checkboxInput", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SuisCheckboxBase, inputs: { required: "required" }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisCheckboxBase, decorators: [{
             type: Directive
-        }], propDecorators: { checkboxInput: [{
-                type: ViewChild,
-                args: ['input']
-            }], required: [{
+        }], propDecorators: { required: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1jaGVja2JveC5iYXNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvc2hhcmVkL2NsYXNzZXMvc3Vpcy1jaGVja2JveC5iYXNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFFTCxTQUFTLEVBQ1QsVUFBVSxFQUNWLEtBQUssRUFDTCxTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLG1CQUFtQixDQUFDOztBQUdsRCxNQUFNLE9BQWdCLGdCQUNwQixTQUFRLGFBQWE7SUFGdkI7O1FBUUUsZ0JBQWdCO1FBQ2hCLFVBQUssR0FBWSxLQUFLLENBQUM7UUFFdkI7O1dBRUc7UUFDTSxhQUFRLEdBQVksS0FBSyxDQUFDO0tBb0JwQztJQWxCQyxlQUFlO1FBQ2IsSUFBSSxJQUFJLENBQUMsS0FBSztZQUNaLENBQUMsSUFBSSxDQUFDLGFBQWEsRUFBRSxhQUFrQyxDQUFBLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQztJQUMzRSxDQUFDO0lBRVEsVUFBVSxDQUFDLEdBQVk7UUFDOUIsSUFBSSxDQUFDLEtBQUssR0FBRyxHQUFHLENBQUM7UUFDakIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDM0IsSUFBSSxDQUFDLEtBQUssQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRUQsUUFBUSxDQUFDLEtBQVk7UUFDbkIsTUFBTSxNQUFNLEdBQUcsS0FBSyxDQUFDLE1BQTBCLENBQUM7UUFDaEQsSUFBSSxDQUFDLEtBQUssR0FBRyxNQUFNLENBQUMsT0FBTyxDQUFDO1FBQzVCLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzNCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM5QixJQUFJLENBQUMsS0FBSyxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQzVCLENBQUM7K0dBaENtQixnQkFBZ0I7bUdBQWhCLGdCQUFnQjs7NEZBQWhCLGdCQUFnQjtrQkFEckMsU0FBUzs4QkFNWSxhQUFhO3NCQUFoQyxTQUFTO3VCQUFDLE9BQU87Z0JBUVQsUUFBUTtzQkFBaEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgQWZ0ZXJWaWV3SW5pdCxcclxuICBEaXJlY3RpdmUsXHJcbiAgRWxlbWVudFJlZixcclxuICBJbnB1dCxcclxuICBWaWV3Q2hpbGQsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFN1aXNJbnB1dEJhc2UgfSBmcm9tICcuL3N1aXMtaW5wdXQuYmFzZSc7XHJcblxyXG5ARGlyZWN0aXZlKClcclxuZXhwb3J0IGFic3RyYWN0IGNsYXNzIFN1aXNDaGVja2JveEJhc2VcclxuICBleHRlbmRzIFN1aXNJbnB1dEJhc2VcclxuICBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXRcclxue1xyXG4gIC8qKiBAaW50ZXJuYWwgKi9cclxuICBAVmlld0NoaWxkKCdpbnB1dCcpIGNoZWNrYm94SW5wdXQ/OiBFbGVtZW50UmVmO1xyXG5cclxuICAvKiogQGludGVybmFsICovXHJcbiAgdmFsdWU6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgLyoqXHJcbiAgICogQWRkcyBhIHJlZCBjb2xvcmVkIGFzdGVyaXNrIGFmdGVyIHRoZSBsYWJlbC4gQnkgZGVmYXVsdCBzZXQgdG8gZmFsc2UuXHJcbiAgICovXHJcbiAgQElucHV0KCkgcmVxdWlyZWQ6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xyXG4gICAgaWYgKHRoaXMudmFsdWUpXHJcbiAgICAgICh0aGlzLmNoZWNrYm94SW5wdXQ/Lm5hdGl2ZUVsZW1lbnQgYXMgSFRNTElucHV0RWxlbWVudCkuY2hlY2tlZCA9IHRydWU7XHJcbiAgfVxyXG5cclxuICBvdmVycmlkZSB3cml0ZVZhbHVlKG9iajogYm9vbGVhbik6IHZvaWQge1xyXG4gICAgdGhpcy52YWx1ZSA9IG9iajtcclxuICAgIHRoaXMuX29uQ2hhbmdlKHRoaXMudmFsdWUpO1xyXG4gICAgdGhpcy5jZFJlZi5tYXJrRm9yQ2hlY2soKTtcclxuICB9XHJcblxyXG4gIG9uQ2hhbmdlKGV2ZW50OiBFdmVudCk6IHZvaWQge1xyXG4gICAgY29uc3QgdGFyZ2V0ID0gZXZlbnQudGFyZ2V0IGFzIEhUTUxJbnB1dEVsZW1lbnQ7XHJcbiAgICB0aGlzLnZhbHVlID0gdGFyZ2V0LmNoZWNrZWQ7XHJcbiAgICB0aGlzLl9vbkNoYW5nZSh0aGlzLnZhbHVlKTtcclxuICAgIHRoaXMuY2hhbmdlZC5lbWl0KHRoaXMudmFsdWUpO1xyXG4gICAgdGhpcy5jZFJlZi5tYXJrRm9yQ2hlY2soKTtcclxuICB9XHJcbn1cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1jaGVja2JveC5iYXNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvc2hhcmVkL2NsYXNzZXMvc3Vpcy1jaGVja2JveC5iYXNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQzs7QUFHbEQsTUFBTSxPQUFnQixnQkFBaUIsU0FBUSxhQUFhO0lBRDVEOztRQUVFLGdCQUFnQjtRQUNoQixVQUFLLEdBQVksS0FBSyxDQUFDO1FBRXZCOztXQUVHO1FBQ00sYUFBUSxHQUFZLEtBQUssQ0FBQztLQWVwQztJQWJVLFVBQVUsQ0FBQyxHQUFZO1FBQzlCLElBQUksQ0FBQyxLQUFLLEdBQUcsR0FBRyxDQUFDO1FBQ2pCLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzNCLElBQUksQ0FBQyxLQUFLLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDNUIsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFZO1FBQ25CLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQztRQUN6QixJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDOUIsSUFBSSxDQUFDLEtBQUssQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUM1QixDQUFDOytHQXJCbUIsZ0JBQWdCO21HQUFoQixnQkFBZ0I7OzRGQUFoQixnQkFBZ0I7a0JBRHJDLFNBQVM7OEJBUUMsUUFBUTtzQkFBaEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFN1aXNJbnB1dEJhc2UgfSBmcm9tICcuL3N1aXMtaW5wdXQuYmFzZSc7XG5cbkBEaXJlY3RpdmUoKVxuZXhwb3J0IGFic3RyYWN0IGNsYXNzIFN1aXNDaGVja2JveEJhc2UgZXh0ZW5kcyBTdWlzSW5wdXRCYXNlIHtcbiAgLyoqIEBpbnRlcm5hbCAqL1xuICB2YWx1ZTogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBBZGRzIGEgcmVkIGNvbG9yZWQgYXN0ZXJpc2sgYWZ0ZXIgdGhlIGxhYmVsLiBCeSBkZWZhdWx0IHNldCB0byBmYWxzZS5cbiAgICovXG4gIEBJbnB1dCgpIHJlcXVpcmVkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgb3ZlcnJpZGUgd3JpdGVWYWx1ZShvYmo6IGJvb2xlYW4pOiB2b2lkIHtcbiAgICB0aGlzLnZhbHVlID0gb2JqO1xuICAgIHRoaXMuX29uQ2hhbmdlKHRoaXMudmFsdWUpO1xuICAgIHRoaXMuY2RSZWYubWFya0ZvckNoZWNrKCk7XG4gIH1cblxuICBvbkNoYW5nZShldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICB0aGlzLnZhbHVlID0gIXRoaXMudmFsdWU7XG4gICAgdGhpcy5fb25DaGFuZ2UodGhpcy52YWx1ZSk7XG4gICAgdGhpcy5jaGFuZ2VkLmVtaXQodGhpcy52YWx1ZSk7XG4gICAgdGhpcy5jZFJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgfVxufVxuIl19

package/fesm2022/suis.mjs

@@ -860,31 +860,24 @@ class SuisCheckboxBase extends SuisInputBase {
          */
         this.required = false;
     }
-    ngAfterViewInit() {
-        if (this.value)
-            (this.checkboxInput?.nativeElement).checked = true;
-    }
     writeValue(obj) {
         this.value = obj;
         this._onChange(this.value);
         this.cdRef.markForCheck();
     }
     onChange(event) {
-        const target = event.target;
-        this.value = target.checked;
+        event.stopPropagation();
+        this.value = !this.value;
         this._onChange(this.value);
         this.changed.emit(this.value);
         this.cdRef.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisCheckboxBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SuisCheckboxBase, inputs: { required: "required" }, viewQueries: [{ propertyName: "checkboxInput", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SuisCheckboxBase, inputs: { required: "required" }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisCheckboxBase, decorators: [{
             type: Directive
-        }], propDecorators: { checkboxInput: [{
-                type: ViewChild,
-                args: ['input']
-            }], required: [{
+        }], propDecorators: { required: [{
                 type: Input
             }] } });
 
@@ -896,7 +889,7 @@ class SuisInputCheckboxComponent extends SuisCheckboxBase {
                 multi: true,
                 useExisting: forwardRef(() => SuisInputCheckboxComponent),
             },
-        ], usesInheritance: true, ngImport: i0, template: "<input\r\n  #input\r\n  type=\"checkbox\"\r\n  class=\"suis-input-checkbox\"\r\n  [attr.id]=\"id\"\r\n  [attr.name]=\"name\"\r\n  [value]=\"value\"\r\n  [disabled]=\"readonly\"\r\n  (change)=\"onChange($event)\"\r\n  (focus)=\"onTouch()\"\r\n/>\r\n\r\n<suis-label\r\n  class=\"suis-input-checkbox__label\"\r\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\r\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\r\n  [for]=\"id\"\r\n  [required]=\"required\"\r\n  [pointer]=\"true\"\r\n  [readonly]=\"readonly\"\r\n>\r\n  <div\r\n    [tabindex]=\"readonly ? -1 : 0\"\r\n    class=\"suis-input-checkbox__check\"\r\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\r\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\r\n  >\r\n    <suis-icon\r\n      *ngIf=\"value\"\r\n      type=\"check\"\r\n      size=\"lg\"\r\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\r\n    ></suis-icon>\r\n  </div>\r\n  <ng-content></ng-content>\r\n</suis-label>\r\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<input\n  type=\"checkbox\"\n  class=\"suis-input-checkbox\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-input-checkbox__label\"\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-input-checkbox__check\"\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\n  >\n    <suis-icon\n      *ngIf=\"value\"\n      type=\"check\"\n      size=\"lg\"\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\n    ></suis-icon>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisInputCheckboxComponent, decorators: [{
             type: Component,
@@ -906,7 +899,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             multi: true,
                             useExisting: forwardRef(() => SuisInputCheckboxComponent),
                         },
-                    ], template: "<input\r\n  #input\r\n  type=\"checkbox\"\r\n  class=\"suis-input-checkbox\"\r\n  [attr.id]=\"id\"\r\n  [attr.name]=\"name\"\r\n  [value]=\"value\"\r\n  [disabled]=\"readonly\"\r\n  (change)=\"onChange($event)\"\r\n  (focus)=\"onTouch()\"\r\n/>\r\n\r\n<suis-label\r\n  class=\"suis-input-checkbox__label\"\r\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\r\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\r\n  [for]=\"id\"\r\n  [required]=\"required\"\r\n  [pointer]=\"true\"\r\n  [readonly]=\"readonly\"\r\n>\r\n  <div\r\n    [tabindex]=\"readonly ? -1 : 0\"\r\n    class=\"suis-input-checkbox__check\"\r\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\r\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\r\n  >\r\n    <suis-icon\r\n      *ngIf=\"value\"\r\n      type=\"check\"\r\n      size=\"lg\"\r\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\r\n    ></suis-icon>\r\n  </div>\r\n  <ng-content></ng-content>\r\n</suis-label>\r\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"] }]
+                    ], template: "<input\n  type=\"checkbox\"\n  class=\"suis-input-checkbox\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-input-checkbox__label\"\n  [class.suis-input-checkbox__label--invalid]=\"invalid\"\n  [class.suis-input-checkbox__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-input-checkbox__check\"\n    [class.suis-input-checkbox__check--invalid]=\"invalid\"\n    [class.suis-input-checkbox__check--readonly]=\"readonly\"\n  >\n    <suis-icon\n      *ngIf=\"value\"\n      type=\"check\"\n      size=\"lg\"\n      [color]=\"readonly ? 'tertiary' : 'primary'\"\n    ></suis-icon>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__label--invalid{color:#ff4757}.suis-input-checkbox__label--readonly{cursor:not-allowed}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #dcdde1;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff;border-radius:.25rem}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;color:#ff4757}.suis-input-checkbox__check--invalid:focus{box-shadow:0 2px 5px #ff4757bf}\n"] }]
         }] });
 
 class SuisInputChipsComponent extends SuisInputBase {
@@ -2590,7 +2583,7 @@ class SuisToggleComponent extends SuisCheckboxBase {
                 multi: true,
                 useExisting: forwardRef(() => SuisToggleComponent),
             },
-        ], usesInheritance: true, ngImport: i0, template: "<input\n  #input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n  (input)=\"onChange($event)\"\n  (focus)=\"onTouch()\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"], dependencies: [{ kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"], dependencies: [{ kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuisToggleComponent, decorators: [{
             type: Component,
@@ -2600,7 +2593,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             multi: true,
                             useExisting: forwardRef(() => SuisToggleComponent),
                         },
-                    ], template: "<input\n  #input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n  (input)=\"onChange($event)\"\n  (focus)=\"onTouch()\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"] }]
+                    ], template: "<input\n  type=\"checkbox\"\n  class=\"suis-toggle\"\n  [attr.id]=\"id\"\n  [attr.name]=\"name\"\n  [value]=\"value\"\n  [disabled]=\"readonly\"\n/>\n\n<suis-label\n  class=\"suis-toggle__label\"\n  [class.suis-toggle__label--invalid]=\"invalid\"\n  [class.suis-toggle__label--readonly]=\"readonly\"\n  [for]=\"id\"\n  [required]=\"required\"\n  [pointer]=\"true\"\n  [readonly]=\"readonly\"\n  (click)=\"onChange($event)\"\n>\n  <div\n    [tabindex]=\"readonly ? -1 : 0\"\n    class=\"suis-toggle__container\"\n    [class.suis-toggle__container--invalid]=\"invalid\"\n    [class.suis-toggle__container--readonly]=\"readonly\"\n  >\n    <div\n      class=\"suis-toggle__container__thumb\"\n      [class.suis-toggle__container__thumb--active]=\"value\"\n      [class.suis-toggle__container__thumb--invalid]=\"invalid\"\n      [class.suis-toggle__container__thumb--readonly]=\"readonly\"\n    ></div>\n  </div>\n  <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-toggle{display:none}.suis-toggle:checked~suis-label ::ng-deep .suis-toggle__container{border:.0625rem solid #192a56}.suis-toggle__label--invalid{color:#ff4757}.suis-toggle__label--readonly{cursor:not-allowed}.suis-toggle__container{width:2.25rem;height:1.25rem;border:.0625rem solid #dcdde1;border-radius:1rem;display:flex;align-items:center;margin-right:.5rem;background-color:#fff}.suis-toggle__container:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-toggle__container--readonly{border:.0625rem solid #dcdde1;cursor:not-allowed}.suis-toggle__container--readonly:focus{box-shadow:none}.suis-toggle__container--invalid{border:.0625rem solid #ff4757}.suis-toggle__container--invalid:focus{box-shadow:0 2px 5px #ff4757bf}.suis-toggle__container__thumb{border-radius:100%;height:.75rem;width:.75rem;background-color:#dcdde1;transform:translate(.25rem);transition:.25s ease-in-out}.suis-toggle__container__thumb--invalid{background-color:#ff4757d9}.suis-toggle__container__thumb--active{background-color:#192a56;transform:translate(1.125rem)}.suis-toggle__container__thumb--readonly{background-color:#dcdde1}\n"] }]
         }] });
 
 class SuisToolbarComponent {