@festo-ui/angular 6.1.0-dev.271 → 6.1.0-dev.276

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/esm2022/lib/forms/date-picker/date-picker.component.mjs +7 -4
  2. package/esm2022/lib/forms/date-range-picker/date-range-picker.component.mjs +7 -4
  3. package/esm2022/lib/forms/switch/switch.component.mjs +3 -3
  4. package/esm2022/lib/forms/time-picker/time-picker.component.mjs +7 -4
  5. package/fesm2022/festo-ui-angular.mjs +20 -11
  6. package/fesm2022/festo-ui-angular.mjs.map +1 -1
  7. package/lib/forms/date-picker/date-picker.component.d.ts +3 -2
  8. package/lib/forms/date-range-picker/date-range-picker.component.d.ts +3 -2
  9. package/lib/forms/time-picker/time-picker.component.d.ts +3 -2
  10. package/package.json +1 -1
package/fesm2022/festo-ui-angular.mjs CHANGED
@@ -4112,8 +4112,9 @@ class FngTimePickerComponent {
4112
4112
  }
4113
4113
  return timeFormat;
4114
4114
  }
4115
- constructor(overlay) {
4115
+ constructor(overlay, cd) {
4116
4116
  this.overlay = overlay;
4117
+ this.cd = cd;
4117
4118
  this.innerRequired = false;
4118
4119
  this.width = 'none';
4119
4120
  this.display = 'block';
@@ -4198,6 +4199,8 @@ class FngTimePickerComponent {
4198
4199
  if (ev.close) {
4199
4200
  this.disposeDropdown();
4200
4201
  }
4202
+ // we need to re-render our view after value changed
4203
+ this.cd.markForCheck();
4201
4204
  });
4202
4205
  this.timePickerRef
4203
4206
  .backdropClick()
@@ -4220,7 +4223,7 @@ class FngTimePickerComponent {
4220
4223
  this.complete.complete();
4221
4224
  }
4222
4225
  }
4223
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngTimePickerComponent, deps: [{ token: i1$3.Overlay }], target: i0.ɵɵFactoryTarget.Component }); }
4226
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngTimePickerComponent, deps: [{ token: i1$3.Overlay }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
4224
4227
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: FngTimePickerComponent, isStandalone: true, selector: "fng-time-picker", inputs: { value: "value", disabled: "disabled", required: "required", hint: "hint", error: "error", options: "options", width: "width" }, host: { properties: { "style.width": "this.width", "style.display": "this.display" } }, providers: [
4225
4228
  {
4226
4229
  provide: NG_VALUE_ACCESSOR,
@@ -4238,7 +4241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
4238
4241
  multi: true
4239
4242
  }
4240
4243
  ], encapsulation: ViewEncapsulation.None, template: "<label #connector class=\"fng-time-picker fwe-input-text fwe-input-text-icon\" (click)=\"toggle($event)\">\n <i class=\"fwe-icon fwe-icon-time-time\" [class.fwe-color-hero]=\"timePickerRef != null\" [class.fwe-color-control-disabled]=\"disabled\"></i>\n <input\n aria-label=\"picked time\"\n type=\"text\"\n readonly\n [required]=\"required === true || null\"\n [class.fwe-border-hero]=\"timePickerRef != null\"\n [value]=\"value | date: timeFormat\"\n [disabled]=\"disabled\"\n />\n <span class=\"fwe-input-text-label\"><ng-content></ng-content></span>\n <span *ngIf=\"hint\" class=\"fwe-input-text-info\">{{ hint }}</span>\n <span *ngIf=\"error\" class=\"fwe-input-text-invalid\">{{ error }}</span>\n</label>\n", styles: [".fng-first-child-fullwidth fng-time-picker-dropdown{width:100%}\n"] }]
4241
- }], ctorParameters: () => [{ type: i1$3.Overlay }], propDecorators: { value: [{
4244
+ }], ctorParameters: () => [{ type: i1$3.Overlay }, { type: i0.ChangeDetectorRef }], propDecorators: { value: [{
4242
4245
  type: Input
4243
4246
  }], disabled: [{
4244
4247
  type: Input
@@ -4351,9 +4354,10 @@ class FngDatePickerComponent {
4351
4354
  const timezone = this.timezone;
4352
4355
  return formatDate(this.value, format, locale, timezone);
4353
4356
  }
4354
- constructor(overlay, localeDefault) {
4357
+ constructor(overlay, localeDefault, cd) {
4355
4358
  this.overlay = overlay;
4356
4359
  this.localeDefault = localeDefault;
4360
+ this.cd = cd;
4357
4361
  this.innerDisabled = false;
4358
4362
  this.options = {};
4359
4363
  this.innerRequired = false;
@@ -4368,6 +4372,8 @@ class FngDatePickerComponent {
4368
4372
  }
4369
4373
  onDateChange(date) {
4370
4374
  this.value = date;
4375
+ // we need to re-render our view after value changed
4376
+ this.cd.markForCheck();
4371
4377
  }
4372
4378
  writeValue(date) {
4373
4379
  this.innerValue = date;
@@ -4450,7 +4456,7 @@ class FngDatePickerComponent {
4450
4456
  this.complete.complete();
4451
4457
  }
4452
4458
  }
4453
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngDatePickerComponent, deps: [{ token: i1$3.Overlay }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component }); }
4459
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngDatePickerComponent, deps: [{ token: i1$3.Overlay }, { token: LOCALE_ID }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
4454
4460
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: FngDatePickerComponent, isStandalone: true, selector: "fng-date-picker", inputs: { value: "value", disabled: "disabled", hint: "hint", error: "error", options: "options", locale: "locale", format: "format", timezone: "timezone", required: "required", width: "width" }, host: { listeners: { "document:keydown": "hide($event)" }, properties: { "style.width": "this.width", "style.display": "this.display" } }, providers: [
4455
4461
  {
4456
4462
  provide: NG_VALUE_ACCESSOR,
@@ -4471,7 +4477,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
4471
4477
  }], ctorParameters: () => [{ type: i1$3.Overlay }, { type: undefined, decorators: [{
4472
4478
  type: Inject,
4473
4479
  args: [LOCALE_ID]
4474
- }] }], propDecorators: { value: [{
4480
+ }] }, { type: i0.ChangeDetectorRef }], propDecorators: { value: [{
4475
4481
  type: Input
4476
4482
  }], disabled: [{
4477
4483
  type: Input
@@ -4556,9 +4562,10 @@ class FngDateRangePickerComponent {
4556
4562
  const timezone = this.timezone;
4557
4563
  return formatDate(to, format, locale, timezone);
4558
4564
  }
4559
- constructor(overlay, localeDefault) {
4565
+ constructor(overlay, localeDefault, cd) {
4560
4566
  this.overlay = overlay;
4561
4567
  this.localeDefault = localeDefault;
4568
+ this.cd = cd;
4562
4569
  this.innerDisabled = false;
4563
4570
  this.options = {};
4564
4571
  this.innerRequired = false;
@@ -4576,6 +4583,8 @@ class FngDateRangePickerComponent {
4576
4583
  }
4577
4584
  onDateChange(dateRange) {
4578
4585
  this.value = dateRange;
4586
+ // we need to re-render our view after value changed
4587
+ this.cd.markForCheck();
4579
4588
  }
4580
4589
  writeValue(dateRange) {
4581
4590
  this.innerValue = dateRange;
@@ -4662,7 +4671,7 @@ class FngDateRangePickerComponent {
4662
4671
  this.complete.complete();
4663
4672
  }
4664
4673
  }
4665
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngDateRangePickerComponent, deps: [{ token: i1$3.Overlay }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component }); }
4674
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngDateRangePickerComponent, deps: [{ token: i1$3.Overlay }, { token: LOCALE_ID }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
4666
4675
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: FngDateRangePickerComponent, isStandalone: true, selector: "fng-date-range-picker", inputs: { value: "value", disabled: "disabled", hint: "hint", error: "error", locale: "locale", format: "format", timezone: "timezone", options: "options", required: "required", width: "width" }, outputs: { fngChange: "fngChange", change: "change" }, host: { listeners: { "document:keydown": "hide($event)" }, properties: { "style.width": "this.width", "style.display": "this.display" } }, providers: [
4667
4676
  {
4668
4677
  provide: NG_VALUE_ACCESSOR,
@@ -4683,7 +4692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
4683
4692
  }], ctorParameters: () => [{ type: i1$3.Overlay }, { type: undefined, decorators: [{
4684
4693
  type: Inject,
4685
4694
  args: [LOCALE_ID]
4686
- }] }], propDecorators: { value: [{
4695
+ }] }, { type: i0.ChangeDetectorRef }], propDecorators: { value: [{
4687
4696
  type: Input
4688
4697
  }], disabled: [{
4689
4698
  type: Input
@@ -5803,7 +5812,7 @@ class FngSwitchComponent {
5803
5812
  useExisting: forwardRef(() => FngSwitchComponent),
5804
5813
  multi: true
5805
5814
  }
5806
- ], ngImport: i0, template: "<label\n [ngClass]=\"{\n 'fwe-switch-container': true,\n 'fwe-checked': checked,\n 'fwe-disabled': disabled,\n 'fwe-switch-label-below': labelPosition == 'below',\n 'fwe-switch-label-before': labelPosition == 'before',\n 'fwe-switch-lg': large\n }\"\n>\n <input\n title=\"checkbox\"\n type=\"checkbox\"\n [checked]=\"checked\"\n [attr.value]=\"value\"\n [attr.name]=\"name\"\n (change)=\"onInteractionEvent($event)\"\n (click)=\"onInputClick($event)\"\n [disabled]=\"disabled\"\n />\n <div class=\"fwe-switch-track\"></div>\n <div class=\"fwe-switch-label-content\">\n <ng-content></ng-content>\n </div>\n</label>\n", styles: [".fwe-switch-container.fwe-switch-label-before{flex-direction:row-reverse;justify-content:flex-end}.fwe-switch-container.fwe-switch-label-before .fwe-switch-label-content{margin-left:0;margin-right:8px}.fwe-switch-container.fwe-switch-label-below{flex-direction:column}.fwe-switch-container.fwe-switch-label-below .fwe-switch-label-content{margin:8px 0 0}.fwe-switch-container.fwe-switch-label-below .fwe-switch-track{margin-top:0;margin-bottom:0}.fwe-switch-container{cursor:pointer;display:flex;align-items:center;white-space:nowrap;vertical-align:middle;width:100%;-webkit-user-select:none;user-select:none}.fwe-switch-container .fwe-switch-track{box-sizing:border-box;position:relative;height:16px;width:32px;border:none;background-color:var(--fwe-control-border);border-radius:8px;margin-top:4px;margin-bottom:4px}.fwe-switch-container .fwe-switch-track:after{content:\"\";position:absolute;top:3px;left:3px;height:10px;width:10px;background:var(--fwe-white);border-radius:50%;transition:left .2s}.fwe-switch-container.fwe-switch-lg .fwe-switch-track{height:24px;width:48px;border-radius:12px;margin-top:0;margin-bottom:0}.fwe-switch-container.fwe-switch-lg .fwe-switch-track:after{top:5px;left:5px;height:14px;width:14px}.fwe-switch-container.fwe-switch-lg.fwe-checked .fwe-switch-track:after{left:29px}.fwe-switch-container .fwe-switch-label-content{line-height:24px;margin-left:8px}.fwe-switch-container input[type=checkbox]{height:0px;width:0px;opacity:0;cursor:pointer}.fwe-switch-container:hover .fwe-switch-track{background-color:var(--fwe-control-border-dark)}.fwe-switch-container:active .fwe-switch-track{background-color:var(--fwe-control-border-darker)}.fwe-switch-container.fwe-checked .fwe-switch-track{background-color:var(--fwe-caerul)}.fwe-switch-container.fwe-checked .fwe-switch-track:after{left:19px}.fwe-switch-container:hover.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-dark)}.fwe-switch-container:active.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-darker)}.fwe-switch-container.fwe-disabled .fwe-switch-track,.fwe-switch-container.fwe-disabled.fwe-checked .fwe-switch-track{background-color:var(--fwe-control-disabled);cursor:not-allowed}.fwe-switch-container.fwe-disabled{cursor:not-allowed}.fwe-switch-container.fwe-disabled .fwe-switch-label-content{color:var(--fwe-text-disabled);cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5815
+ ], ngImport: i0, template: "<label\n [ngClass]=\"{\n 'fwe-switch-container': true,\n 'fwe-checked': checked,\n 'fwe-disabled': disabled,\n 'fwe-switch-label-below': labelPosition == 'below',\n 'fwe-switch-label-before': labelPosition == 'before',\n 'fwe-switch-lg': large\n }\"\n>\n <input\n title=\"checkbox\"\n type=\"checkbox\"\n [checked]=\"checked\"\n [attr.value]=\"value\"\n [attr.name]=\"name\"\n (change)=\"onInteractionEvent($event)\"\n (click)=\"onInputClick($event)\"\n [disabled]=\"disabled\"\n />\n <div class=\"fwe-switch-track\"></div>\n <div class=\"fwe-switch-label-content\">\n <ng-content></ng-content>\n </div>\n</label>\n", styles: [".fwe-switch-container.fwe-switch-label-before{flex-direction:row-reverse;justify-content:flex-end}.fwe-switch-container.fwe-switch-label-before .fwe-switch-label-content{margin-left:0;margin-right:8px}.fwe-switch-container.fwe-switch-label-below{flex-direction:column}.fwe-switch-container.fwe-switch-label-below .fwe-switch-label-content{margin:8px 0 0}.fwe-switch-container.fwe-switch-label-below .fwe-switch-track{margin-top:0;margin-bottom:0}.fwe-switch-container{cursor:pointer;display:flex;align-items:center;white-space:nowrap;vertical-align:middle;width:100%;-webkit-user-select:none;user-select:none}.fwe-switch-container .fwe-switch-track{min-width:32px;box-sizing:border-box;position:relative;height:16px;width:32px;border:none;background-color:var(--fwe-control-border);border-radius:8px;margin-top:4px;margin-bottom:4px}.fwe-switch-container .fwe-switch-track:after{content:\"\";position:absolute;top:3px;left:3px;height:10px;width:10px;background:var(--fwe-white);border-radius:50%;transition:left .2s}.fwe-switch-container.fwe-switch-lg .fwe-switch-track{height:24px;width:48px;border-radius:12px;margin-top:0;margin-bottom:0}.fwe-switch-container.fwe-switch-lg .fwe-switch-track:after{top:5px;left:5px;height:14px;width:14px}.fwe-switch-container.fwe-switch-lg.fwe-checked .fwe-switch-track:after{left:29px}.fwe-switch-container .fwe-switch-label-content{line-height:24px;margin-left:8px}.fwe-switch-container input[type=checkbox]{height:0px;width:0px;opacity:0;cursor:pointer}.fwe-switch-container:hover .fwe-switch-track{background-color:var(--fwe-control-border-dark)}.fwe-switch-container:active .fwe-switch-track{background-color:var(--fwe-control-border-darker)}.fwe-switch-container.fwe-checked .fwe-switch-track{background-color:var(--fwe-caerul)}.fwe-switch-container.fwe-checked .fwe-switch-track:after{left:19px}.fwe-switch-container:hover.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-dark)}.fwe-switch-container:active.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-darker)}.fwe-switch-container.fwe-disabled .fwe-switch-track,.fwe-switch-container.fwe-disabled.fwe-checked .fwe-switch-track{background-color:var(--fwe-control-disabled);cursor:not-allowed}.fwe-switch-container.fwe-disabled{cursor:not-allowed}.fwe-switch-container.fwe-disabled .fwe-switch-label-content{color:var(--fwe-text-disabled);cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5807
5816
  }
5808
5817
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FngSwitchComponent, decorators: [{
5809
5818
  type: Component,
@@ -5813,7 +5822,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
5813
5822
  useExisting: forwardRef(() => FngSwitchComponent),
5814
5823
  multi: true
5815
5824
  }
5816
- ], template: "<label\n [ngClass]=\"{\n 'fwe-switch-container': true,\n 'fwe-checked': checked,\n 'fwe-disabled': disabled,\n 'fwe-switch-label-below': labelPosition == 'below',\n 'fwe-switch-label-before': labelPosition == 'before',\n 'fwe-switch-lg': large\n }\"\n>\n <input\n title=\"checkbox\"\n type=\"checkbox\"\n [checked]=\"checked\"\n [attr.value]=\"value\"\n [attr.name]=\"name\"\n (change)=\"onInteractionEvent($event)\"\n (click)=\"onInputClick($event)\"\n [disabled]=\"disabled\"\n />\n <div class=\"fwe-switch-track\"></div>\n <div class=\"fwe-switch-label-content\">\n <ng-content></ng-content>\n </div>\n</label>\n", styles: [".fwe-switch-container.fwe-switch-label-before{flex-direction:row-reverse;justify-content:flex-end}.fwe-switch-container.fwe-switch-label-before .fwe-switch-label-content{margin-left:0;margin-right:8px}.fwe-switch-container.fwe-switch-label-below{flex-direction:column}.fwe-switch-container.fwe-switch-label-below .fwe-switch-label-content{margin:8px 0 0}.fwe-switch-container.fwe-switch-label-below .fwe-switch-track{margin-top:0;margin-bottom:0}.fwe-switch-container{cursor:pointer;display:flex;align-items:center;white-space:nowrap;vertical-align:middle;width:100%;-webkit-user-select:none;user-select:none}.fwe-switch-container .fwe-switch-track{box-sizing:border-box;position:relative;height:16px;width:32px;border:none;background-color:var(--fwe-control-border);border-radius:8px;margin-top:4px;margin-bottom:4px}.fwe-switch-container .fwe-switch-track:after{content:\"\";position:absolute;top:3px;left:3px;height:10px;width:10px;background:var(--fwe-white);border-radius:50%;transition:left .2s}.fwe-switch-container.fwe-switch-lg .fwe-switch-track{height:24px;width:48px;border-radius:12px;margin-top:0;margin-bottom:0}.fwe-switch-container.fwe-switch-lg .fwe-switch-track:after{top:5px;left:5px;height:14px;width:14px}.fwe-switch-container.fwe-switch-lg.fwe-checked .fwe-switch-track:after{left:29px}.fwe-switch-container .fwe-switch-label-content{line-height:24px;margin-left:8px}.fwe-switch-container input[type=checkbox]{height:0px;width:0px;opacity:0;cursor:pointer}.fwe-switch-container:hover .fwe-switch-track{background-color:var(--fwe-control-border-dark)}.fwe-switch-container:active .fwe-switch-track{background-color:var(--fwe-control-border-darker)}.fwe-switch-container.fwe-checked .fwe-switch-track{background-color:var(--fwe-caerul)}.fwe-switch-container.fwe-checked .fwe-switch-track:after{left:19px}.fwe-switch-container:hover.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-dark)}.fwe-switch-container:active.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-darker)}.fwe-switch-container.fwe-disabled .fwe-switch-track,.fwe-switch-container.fwe-disabled.fwe-checked .fwe-switch-track{background-color:var(--fwe-control-disabled);cursor:not-allowed}.fwe-switch-container.fwe-disabled{cursor:not-allowed}.fwe-switch-container.fwe-disabled .fwe-switch-label-content{color:var(--fwe-text-disabled);cursor:not-allowed}\n"] }]
5825
+ ], template: "<label\n [ngClass]=\"{\n 'fwe-switch-container': true,\n 'fwe-checked': checked,\n 'fwe-disabled': disabled,\n 'fwe-switch-label-below': labelPosition == 'below',\n 'fwe-switch-label-before': labelPosition == 'before',\n 'fwe-switch-lg': large\n }\"\n>\n <input\n title=\"checkbox\"\n type=\"checkbox\"\n [checked]=\"checked\"\n [attr.value]=\"value\"\n [attr.name]=\"name\"\n (change)=\"onInteractionEvent($event)\"\n (click)=\"onInputClick($event)\"\n [disabled]=\"disabled\"\n />\n <div class=\"fwe-switch-track\"></div>\n <div class=\"fwe-switch-label-content\">\n <ng-content></ng-content>\n </div>\n</label>\n", styles: [".fwe-switch-container.fwe-switch-label-before{flex-direction:row-reverse;justify-content:flex-end}.fwe-switch-container.fwe-switch-label-before .fwe-switch-label-content{margin-left:0;margin-right:8px}.fwe-switch-container.fwe-switch-label-below{flex-direction:column}.fwe-switch-container.fwe-switch-label-below .fwe-switch-label-content{margin:8px 0 0}.fwe-switch-container.fwe-switch-label-below .fwe-switch-track{margin-top:0;margin-bottom:0}.fwe-switch-container{cursor:pointer;display:flex;align-items:center;white-space:nowrap;vertical-align:middle;width:100%;-webkit-user-select:none;user-select:none}.fwe-switch-container .fwe-switch-track{min-width:32px;box-sizing:border-box;position:relative;height:16px;width:32px;border:none;background-color:var(--fwe-control-border);border-radius:8px;margin-top:4px;margin-bottom:4px}.fwe-switch-container .fwe-switch-track:after{content:\"\";position:absolute;top:3px;left:3px;height:10px;width:10px;background:var(--fwe-white);border-radius:50%;transition:left .2s}.fwe-switch-container.fwe-switch-lg .fwe-switch-track{height:24px;width:48px;border-radius:12px;margin-top:0;margin-bottom:0}.fwe-switch-container.fwe-switch-lg .fwe-switch-track:after{top:5px;left:5px;height:14px;width:14px}.fwe-switch-container.fwe-switch-lg.fwe-checked .fwe-switch-track:after{left:29px}.fwe-switch-container .fwe-switch-label-content{line-height:24px;margin-left:8px}.fwe-switch-container input[type=checkbox]{height:0px;width:0px;opacity:0;cursor:pointer}.fwe-switch-container:hover .fwe-switch-track{background-color:var(--fwe-control-border-dark)}.fwe-switch-container:active .fwe-switch-track{background-color:var(--fwe-control-border-darker)}.fwe-switch-container.fwe-checked .fwe-switch-track{background-color:var(--fwe-caerul)}.fwe-switch-container.fwe-checked .fwe-switch-track:after{left:19px}.fwe-switch-container:hover.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-dark)}.fwe-switch-container:active.fwe-checked .fwe-switch-track{background-color:var(--fwe-hero-darker)}.fwe-switch-container.fwe-disabled .fwe-switch-track,.fwe-switch-container.fwe-disabled.fwe-checked .fwe-switch-track{background-color:var(--fwe-control-disabled);cursor:not-allowed}.fwe-switch-container.fwe-disabled{cursor:not-allowed}.fwe-switch-container.fwe-disabled .fwe-switch-label-content{color:var(--fwe-text-disabled);cursor:not-allowed}\n"] }]
5817
5826
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { name: [{
5818
5827
  type: Input
5819
5828
  }], large: [{