@flywheel-io/vision 21.5.2 → 21.6.1

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.
@@ -1,7 +1,6 @@
1
1
  import { NgClass, CommonModule, NgStyle, NgTemplateOutlet, DecimalPipe, SlicePipe, Location } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
- import { inject, input, HostBinding, ChangeDetectionStrategy, Component, output, computed, NgModule, model, signal, effect, HostListener, ViewEncapsulation, EventEmitter, Output, ElementRef, ViewContainerRef, Directive, contentChildren, viewChild, ChangeDetectorRef, ContentChildren, Input, ViewChild, forwardRef, DestroyRef, ContentChild, contentChild, NgZone, untracked, Injectable, DOCUMENT, viewChildren, linkedSignal, ViewChildren, TemplateRef } from '@angular/core';
4
- import { DomSanitizer } from '@angular/platform-browser';
3
+ import { input, computed, ChangeDetectionStrategy, Component, output, NgModule, HostBinding, model, signal, effect, HostListener, ViewEncapsulation, EventEmitter, Output, inject, ElementRef, ViewContainerRef, Directive, contentChildren, viewChild, ChangeDetectorRef, ContentChildren, Input, ViewChild, forwardRef, DestroyRef, ContentChild, contentChild, NgZone, untracked, Injectable, DOCUMENT, viewChildren, linkedSignal, ViewChildren, TemplateRef } from '@angular/core';
5
4
  import { BehaviorSubject, debounce, timer, distinctUntilChanged, min, Subject, takeUntil, of, Subscription, combineLatest, tap, switchMap, map } from 'rxjs';
6
5
  import * as i1$1 from '@angular/cdk/overlay';
7
6
  import { CdkConnectedOverlay, OverlayModule, Overlay, CdkOverlayOrigin, OverlayContainer } from '@angular/cdk/overlay';
@@ -10,6 +9,7 @@ export { CdkTableModule } from '@angular/cdk/table';
10
9
  import { trigger, transition, style, animate, state } from '@angular/animations';
11
10
  import { _IdGenerator, LiveAnnouncer } from '@angular/cdk/a11y';
12
11
  import { ComponentPortal } from '@angular/cdk/portal';
12
+ import { DomSanitizer } from '@angular/platform-browser';
13
13
  import * as i1 from '@angular/forms';
14
14
  import { NG_VALUE_ACCESSOR, ReactiveFormsModule, FormsModule, NgControl, FormControl, FormGroup } from '@angular/forms';
15
15
  import { takeUntilDestroyed, toObservable, toSignal } from '@angular/core/rxjs-interop';
@@ -37,36 +37,28 @@ const namedSizeToPxMap = {
37
37
  */
38
38
  class FwIconComponent {
39
39
  constructor() {
40
- this.sanitizer = inject(DomSanitizer);
41
- this.ariaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
40
+ this.ariaLabel = input(...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
42
41
  this.size = input(undefined, { ...(ngDevMode ? { debugName: "size" } : /* istanbul ignore next */ {}), transform: (input) => {
43
42
  if (typeof input === 'string') {
44
43
  return namedSizeToPxMap[input] || parseInt(input) || 24;
45
44
  }
46
45
  return input;
47
46
  } });
48
- this.color = input(undefined, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
49
- this.class = 'vision-icon';
50
- }
51
- get style() {
52
- const sizeStyle = `font-size: ${this.size()}px; min-width: ${this.size()}px; width: ${this.size()}px;`;
53
- let colorStyle = '';
54
- const color = this.color();
55
- if (color) {
47
+ this.color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
48
+ this.parsedColor = computed(() => {
49
+ const color = this.color();
50
+ let parsed = '';
56
51
  if (color === 'muted') {
57
- colorStyle = 'color: var(--typography-muted);';
52
+ parsed = 'var(--typography-muted)';
58
53
  }
59
54
  else {
60
- colorStyle = `color: var(--${color}-base);`;
55
+ parsed = `var(--${color}-base)`;
61
56
  }
62
- }
63
- return this.sanitizer.bypassSecurityTrustStyle(`
64
- ${sizeStyle}
65
- ${colorStyle}
66
- `);
57
+ return parsed;
58
+ }, ...(ngDevMode ? [{ debugName: "parsedColor" }] : /* istanbul ignore next */ []));
67
59
  }
68
60
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
69
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: FwIconComponent, isStandalone: true, selector: "fw-icon", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "ariaLabel() ? \"img\" : null", "attr.aria-label": "ariaLabel() || null", "attr.aria-hidden": "ariaLabel() ? null : \"true\"", "class": "this.class", "style": "this.style" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
61
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: FwIconComponent, isStandalone: true, selector: "fw-icon", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "ariaLabel() ? \"img\" : null", "attr.aria-label": "ariaLabel() || null", "attr.aria-hidden": "ariaLabel() ? null : \"true\"", "style.font-size": "`${size()}px`", "style.min-width": "`${size()}px`", "style.width": "`${size()}px`", "style.color": "parsedColor()" }, classAttribute: "vision-icon" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
70
62
  }
71
63
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwIconComponent, decorators: [{
72
64
  type: Component,
@@ -78,15 +70,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
78
70
  '[attr.role]': 'ariaLabel() ? "img" : null',
79
71
  '[attr.aria-label]': 'ariaLabel() || null',
80
72
  '[attr.aria-hidden]': 'ariaLabel() ? null : "true"',
73
+ 'class': 'vision-icon',
74
+ '[style.font-size]': '`${size()}px`',
75
+ '[style.min-width]': '`${size()}px`',
76
+ '[style.width]': '`${size()}px`',
77
+ '[style.color]': 'parsedColor()',
81
78
  },
82
79
  }]
83
- }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], class: [{
84
- type: HostBinding,
85
- args: ['class']
86
- }], style: [{
87
- type: HostBinding,
88
- args: ['style']
89
- }] } });
80
+ }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
90
81
 
91
82
  /**
92
83
  * Component for a clickable icon-only button with configurable color, size, and selected state
@@ -423,36 +414,43 @@ var LayoutWidth;
423
414
  class FwLayoutContextComponent {
424
415
  constructor() {
425
416
  this.width = input(LayoutWidth.Small, ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
426
- this.icon = input(undefined, ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
417
+ this.widthPx = computed(() => {
418
+ const widthMap = {
419
+ small: '444px',
420
+ medium: '600px',
421
+ large: '900px',
422
+ 'extra-large': '1200px',
423
+ fill: '100%',
424
+ };
425
+ return widthMap[this.width()];
426
+ }, ...(ngDevMode ? [{ debugName: "widthPx" }] : /* istanbul ignore next */ []));
427
+ this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
427
428
  this.iconColor = input('secondary', ...(ngDevMode ? [{ debugName: "iconColor" }] : /* istanbul ignore next */ []));
428
- this.title = input(undefined, ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
429
- this.description = input(undefined, ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
430
- }
431
- get hostTitle() {
432
- return null;
433
- }
434
- get classes() {
435
- const classes = ['fw-layout-context'];
436
- classes.push(`context-width-${this.width()}`);
437
- const iconColor = this.iconColor();
438
- if (iconColor) {
439
- classes.push(`context-color-${iconColor}`);
440
- }
441
- return classes.join(' ');
429
+ this.parsedIconColor = computed(() => {
430
+ const colorMap = {
431
+ 'primary': 'primary',
432
+ 'secondary': 'secondary',
433
+ 'danger': 'red',
434
+ 'slate': 'slate',
435
+ 'warning': 'orange',
436
+ 'success': 'green',
437
+ };
438
+ return colorMap[this.iconColor()] || 'secondary';
439
+ }, ...(ngDevMode ? [{ debugName: "parsedIconColor" }] : /* istanbul ignore next */ []));
440
+ this.title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
441
+ this.description = input(...(ngDevMode ? [undefined, { debugName: "description" }] : /* istanbul ignore next */ []));
442
442
  }
443
443
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwLayoutContextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
444
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FwLayoutContextComponent, isStandalone: true, selector: "fw-layout-context", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.title": "this.hostTitle", "attr.class": "this.classes" } }, ngImport: i0, template: "@if (icon()) {\n <fw-icon [ngClass]=\"iconColor()\">{{ icon() }}</fw-icon>\n}\n\n@if (title()) {\n <h3>{{ title() }}</h3>\n}\n\n@if (description()) {\n <p class=\"vision-p3\">{{ description() }}</p>\n} @else {\n <ng-content select=\"[slot='description']\"></ng-content>\n}\n\n<div class=\"context-actions\">\n <ng-content select=\"fw-button\"></ng-content>\n</div>\n", styles: [":host{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:50px;max-width:100%}:host fw-icon{font-size:50px;width:50px;max-width:50px}:host fw-icon.primary{color:var(--primary-base)}:host fw-icon.secondary{color:var(--secondary-base)}:host fw-icon.slate{color:var(--slate-base)}:host fw-icon.danger{color:var(--red-base)}:host fw-icon.warning{color:var(--orange-base)}:host fw-icon.success{color:var(--green-base)}:host h3{margin:0}:host p{margin:0;text-align:center;color:var(--typography-muted)}:host .context-actions{display:flex;gap:8px}:host.context-width-small{width:444px}:host.context-width-medium{width:600px}:host.context-width-large{width:900px}:host.context-width-extra-large{width:1200px}\n"], dependencies: [{ kind: "component", type: FwIconComponent, selector: "fw-icon", inputs: ["ariaLabel", "size", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
444
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FwLayoutContextComponent, isStandalone: true, selector: "fw-layout-context", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.width": "widthPx()", "attr.title": "null" }, classAttribute: "fw-layout-context" }, ngImport: i0, template: "@if (icon()) {\n <fw-icon [color]=\"parsedIconColor()\">{{ icon() }}</fw-icon>\n}\n\n@if (title()) {\n <h3>{{ title() }}</h3>\n}\n\n@if (description()) {\n <p class=\"vision-p3\">{{ description() }}</p>\n} @else {\n <ng-content select=\"[slot='description']\"></ng-content>\n}\n\n<div class=\"context-actions\">\n <ng-content select=\"fw-button\"></ng-content>\n</div>\n", styles: [":host{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:50px;max-width:100%}:host fw-icon{font-size:50px;width:50px;max-width:50px}:host h3{margin:0}:host p{margin:0;text-align:center;color:var(--typography-muted)}:host .context-actions{display:flex;gap:8px}\n"], dependencies: [{ kind: "component", type: FwIconComponent, selector: "fw-icon", inputs: ["ariaLabel", "size", "color"] }] }); }
445
445
  }
446
446
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwLayoutContextComponent, decorators: [{
447
447
  type: Component,
448
- args: [{ selector: 'fw-layout-context', imports: [FwIconComponent, NgClass], template: "@if (icon()) {\n <fw-icon [ngClass]=\"iconColor()\">{{ icon() }}</fw-icon>\n}\n\n@if (title()) {\n <h3>{{ title() }}</h3>\n}\n\n@if (description()) {\n <p class=\"vision-p3\">{{ description() }}</p>\n} @else {\n <ng-content select=\"[slot='description']\"></ng-content>\n}\n\n<div class=\"context-actions\">\n <ng-content select=\"fw-button\"></ng-content>\n</div>\n", styles: [":host{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:50px;max-width:100%}:host fw-icon{font-size:50px;width:50px;max-width:50px}:host fw-icon.primary{color:var(--primary-base)}:host fw-icon.secondary{color:var(--secondary-base)}:host fw-icon.slate{color:var(--slate-base)}:host fw-icon.danger{color:var(--red-base)}:host fw-icon.warning{color:var(--orange-base)}:host fw-icon.success{color:var(--green-base)}:host h3{margin:0}:host p{margin:0;text-align:center;color:var(--typography-muted)}:host .context-actions{display:flex;gap:8px}:host.context-width-small{width:444px}:host.context-width-medium{width:600px}:host.context-width-large{width:900px}:host.context-width-extra-large{width:1200px}\n"] }]
449
- }], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconColor", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], hostTitle: [{
450
- type: HostBinding,
451
- args: ['attr.title']
452
- }], classes: [{
453
- type: HostBinding,
454
- args: ['attr.class']
455
- }] } });
448
+ args: [{ selector: 'fw-layout-context', imports: [FwIconComponent], host: {
449
+ class: 'fw-layout-context',
450
+ '[style.width]': 'widthPx()',
451
+ '[attr.title]': 'null',
452
+ }, template: "@if (icon()) {\n <fw-icon [color]=\"parsedIconColor()\">{{ icon() }}</fw-icon>\n}\n\n@if (title()) {\n <h3>{{ title() }}</h3>\n}\n\n@if (description()) {\n <p class=\"vision-p3\">{{ description() }}</p>\n} @else {\n <ng-content select=\"[slot='description']\"></ng-content>\n}\n\n<div class=\"context-actions\">\n <ng-content select=\"fw-button\"></ng-content>\n</div>\n", styles: [":host{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:50px;max-width:100%}:host fw-icon{font-size:50px;width:50px;max-width:50px}:host h3{margin:0}:host p{margin:0;text-align:center;color:var(--typography-muted)}:host .context-actions{display:flex;gap:8px}\n"] }]
453
+ }], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconColor", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }] } });
456
454
 
457
455
  /**
458
456
  * Layout component for a 12-column responsive grid container
@@ -3728,6 +3726,8 @@ const DEFAULT_PRESET_COLORS = [
3728
3726
  '#F5F5F5FF',
3729
3727
  ];
3730
3728
 
3729
+ // dragSaturation/dragHue/dragAlpha need the track element's current rect on every pointermove
3730
+ /* eslint-disable @rx-angular/prefer-no-layout-sensitive-apis */
3731
3731
  /**
3732
3732
  * Just under 360, not 359.99: hsvaToRgba rounds its output to 8-bit RGB channels, so a hue that's
3733
3733
  * only a fraction of a degree short of 360 still round-trips back as hue 0 once rounding destroys
@@ -4220,6 +4220,54 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
4220
4220
  }]
4221
4221
  }] });
4222
4222
 
4223
+ /**
4224
+ * A boxed, single-select card combining `FwContainedInput`'s contained-card layout with a radio control.
4225
+ * Renders as a child of `fw-radio-group`, the same way `fw-radio-button` does.
4226
+ * @see [Vision storybook](https://cdn.flywheel.io/docs/vision/master/?path=/docs/form-controls-contained-radio--docs)
4227
+ */
4228
+ class FwContainedRadioComponent {
4229
+ constructor() {
4230
+ this.value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
4231
+ this.title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
4232
+ this.description = input(...(ngDevMode ? [undefined, { debugName: "description" }] : /* istanbul ignore next */ []));
4233
+ this.inputPosition = input('start', ...(ngDevMode ? [{ debugName: "inputPosition" }] : /* istanbul ignore next */ []));
4234
+ this.clamped = input(false, ...(ngDevMode ? [{ debugName: "clamped" }] : /* istanbul ignore next */ []));
4235
+ this.margin = input(false, ...(ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []));
4236
+ /**
4237
+ * Set by the owning `fw-radio-group`, matching the underlying native `name` attribute so browser radio
4238
+ * semantics (exclusivity, arrow-key navigation) work across sibling `fw-radio-button`/`fw-contained-radio` items
4239
+ */
4240
+ this.group = model('', ...(ngDevMode ? [{ debugName: "group" }] : /* istanbul ignore next */ []));
4241
+ this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
4242
+ this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
4243
+ this.color = model('primary', ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
4244
+ this.size = model('medium', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
4245
+ // eslint-disable-next-line @angular-eslint/no-output-native
4246
+ this.change = output();
4247
+ this.inputId = computed(() => `${this.group()}${this.value()}`, ...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
4248
+ this.hostClass = computed(() => [
4249
+ 'fw-contained-radio',
4250
+ `position-${this.inputPosition()}`,
4251
+ `color-${this.color()}`,
4252
+ `size-${this.size()}`,
4253
+ this.checked() ? 'checked' : '',
4254
+ this.disabled() ? 'disabled' : '',
4255
+ this.margin() ? 'margin' : '',
4256
+ ].join(' '), ...(ngDevMode ? [{ debugName: "hostClass" }] : /* istanbul ignore next */ []));
4257
+ }
4258
+ handleChange(event) {
4259
+ this.change.emit(event?.target?.value);
4260
+ }
4261
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwContainedRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4262
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FwContainedRadioComponent, isStandalone: true, selector: "fw-contained-radio", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, inputPosition: { classPropertyName: "inputPosition", publicName: "inputPosition", isSignal: true, isRequired: false, transformFunction: null }, clamped: { classPropertyName: "clamped", publicName: "clamped", isSignal: true, isRequired: false, transformFunction: null }, margin: { classPropertyName: "margin", publicName: "margin", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { group: "groupChange", checked: "checkedChange", disabled: "disabledChange", color: "colorChange", size: "sizeChange", change: "change" }, host: { properties: { "class": "hostClass()" } }, ngImport: i0, template: "<label class=\"content\" [attr.for]=\"inputId()\">\n <div class=\"input-heading\">\n <h4 class=\"vision-h4 section-heading\">\n <span [class.clamped]=\"clamped()\">{{ title() }}</span>\n <ng-content select=\"fw-tag\"></ng-content>\n </h4>\n @if (description()) {\n <p class=\"vision-p3\" [class.clamped]=\"clamped()\">{{ description() }}</p>\n }\n </div>\n <div class=\"input-wrapper\">\n <input\n type=\"radio\"\n class=\"radio-input\"\n [id]=\"inputId()\"\n [value]=\"value()\"\n [checked]=\"checked()\"\n [name]=\"group()\"\n [disabled]=\"disabled()\"\n (change)=\"handleChange($event)\"\n />\n <span class=\"item\">\n @if (checked()) {\n <span class=\"indicator\"></span>\n }\n </span>\n </div>\n</label>\n", styles: [":host{position:relative;flex:1;display:flex;border:1px solid var(--separations-base);border-radius:8px;-webkit-user-select:none;user-select:none}:host:hover{background-color:var(--slate-hover);border-color:var(--slate-border)}:host.checked{border-color:var(--slate-base);z-index:1}:host.checked:hover{background-color:transparent}:host:not(:first-child){border-top-left-radius:0;border-top-right-radius:0;margin-top:-1px}:host:not(:last-child){border-bottom-left-radius:0;border-bottom-right-radius:0}:host.margin{margin-bottom:16px;border-radius:8px}:host.margin+::ng-deep fw-contained-radio{margin-top:0;border-top-left-radius:8px;border-top-right-radius:8px}:host.color-primary:hover{background-color:var(--primary-hover);border-color:var(--primary-border)}:host.color-primary.checked{border-color:var(--primary-base)}:host.color-primary.checked:hover{background-color:transparent}:host.color-secondary:hover{background-color:var(--secondary-hover);border-color:var(--secondary-border)}:host.color-secondary.checked{border-color:var(--secondary-base)}:host.color-secondary.checked:hover{background-color:transparent}:host.color-slate:hover{background-color:var(--slate-hover);border-color:var(--slate-border)}:host.color-slate.checked{border-color:var(--slate-base)}:host.color-slate.checked:hover{background-color:transparent}:host.position-start .content{flex-direction:row-reverse}:host.disabled{opacity:.4;cursor:not-allowed}:host.disabled .content{cursor:not-allowed}:host .content{position:relative;flex:1;min-width:0;display:flex;flex-direction:row;align-items:center;padding:16px;gap:16px;cursor:pointer}:host.size-compact .content{padding:12px;gap:12px}:host .input-heading{display:flex;flex-direction:column;flex:1;min-width:0}:host .input-wrapper{position:relative;display:flex}:host h4{color:var(--typography-base);margin:0;display:flex;align-items:center;gap:5px}:host h4 .clamped{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host p{color:var(--typography-muted);margin:0;line-height:140%}:host p.clamped{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .radio-input{position:absolute;inset:0;width:36px;height:36px;margin:0;opacity:0;cursor:pointer}:host .radio-input:disabled{cursor:not-allowed}:host .item{height:36px;width:36px;min-height:36px;min-width:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;position:relative}:host .item:after{content:\"\";position:absolute;display:block;width:20px;height:20px;background-clip:content-box;border:2px solid var(--typography-light);background-color:transparent;border-radius:50%}:host .radio-input:focus-visible+.item{outline:2px solid var(--primary-base);outline-offset:2px}:host.color-primary .radio-input:checked+.item:after{border-color:var(--primary-base)}:host.color-secondary .radio-input:checked+.item:after{border-color:var(--secondary-base)}:host.size-compact .item{width:30px;height:30px;min-width:30px;min-height:30px}:host.size-compact .item:after{width:18px;height:18px}:host.size-compact .radio-input{width:30px;height:30px}:host .indicator{width:12px;height:12px;background-color:var(--typography-light);border-radius:50%}:host.color-primary .indicator{background-color:var(--primary-base)}:host.color-secondary .indicator{background-color:var(--secondary-base)}:host.size-compact .indicator{width:10px;height:10px}:host.disabled .item:after{border:2px solid var(--typography-light)!important}:host.disabled .indicator{background-color:var(--typography-light)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4263
+ }
4264
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwContainedRadioComponent, decorators: [{
4265
+ type: Component,
4266
+ args: [{ selector: 'fw-contained-radio', changeDetection: ChangeDetectionStrategy.OnPush, host: {
4267
+ '[class]': 'hostClass()',
4268
+ }, template: "<label class=\"content\" [attr.for]=\"inputId()\">\n <div class=\"input-heading\">\n <h4 class=\"vision-h4 section-heading\">\n <span [class.clamped]=\"clamped()\">{{ title() }}</span>\n <ng-content select=\"fw-tag\"></ng-content>\n </h4>\n @if (description()) {\n <p class=\"vision-p3\" [class.clamped]=\"clamped()\">{{ description() }}</p>\n }\n </div>\n <div class=\"input-wrapper\">\n <input\n type=\"radio\"\n class=\"radio-input\"\n [id]=\"inputId()\"\n [value]=\"value()\"\n [checked]=\"checked()\"\n [name]=\"group()\"\n [disabled]=\"disabled()\"\n (change)=\"handleChange($event)\"\n />\n <span class=\"item\">\n @if (checked()) {\n <span class=\"indicator\"></span>\n }\n </span>\n </div>\n</label>\n", styles: [":host{position:relative;flex:1;display:flex;border:1px solid var(--separations-base);border-radius:8px;-webkit-user-select:none;user-select:none}:host:hover{background-color:var(--slate-hover);border-color:var(--slate-border)}:host.checked{border-color:var(--slate-base);z-index:1}:host.checked:hover{background-color:transparent}:host:not(:first-child){border-top-left-radius:0;border-top-right-radius:0;margin-top:-1px}:host:not(:last-child){border-bottom-left-radius:0;border-bottom-right-radius:0}:host.margin{margin-bottom:16px;border-radius:8px}:host.margin+::ng-deep fw-contained-radio{margin-top:0;border-top-left-radius:8px;border-top-right-radius:8px}:host.color-primary:hover{background-color:var(--primary-hover);border-color:var(--primary-border)}:host.color-primary.checked{border-color:var(--primary-base)}:host.color-primary.checked:hover{background-color:transparent}:host.color-secondary:hover{background-color:var(--secondary-hover);border-color:var(--secondary-border)}:host.color-secondary.checked{border-color:var(--secondary-base)}:host.color-secondary.checked:hover{background-color:transparent}:host.color-slate:hover{background-color:var(--slate-hover);border-color:var(--slate-border)}:host.color-slate.checked{border-color:var(--slate-base)}:host.color-slate.checked:hover{background-color:transparent}:host.position-start .content{flex-direction:row-reverse}:host.disabled{opacity:.4;cursor:not-allowed}:host.disabled .content{cursor:not-allowed}:host .content{position:relative;flex:1;min-width:0;display:flex;flex-direction:row;align-items:center;padding:16px;gap:16px;cursor:pointer}:host.size-compact .content{padding:12px;gap:12px}:host .input-heading{display:flex;flex-direction:column;flex:1;min-width:0}:host .input-wrapper{position:relative;display:flex}:host h4{color:var(--typography-base);margin:0;display:flex;align-items:center;gap:5px}:host h4 .clamped{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host p{color:var(--typography-muted);margin:0;line-height:140%}:host p.clamped{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .radio-input{position:absolute;inset:0;width:36px;height:36px;margin:0;opacity:0;cursor:pointer}:host .radio-input:disabled{cursor:not-allowed}:host .item{height:36px;width:36px;min-height:36px;min-width:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;position:relative}:host .item:after{content:\"\";position:absolute;display:block;width:20px;height:20px;background-clip:content-box;border:2px solid var(--typography-light);background-color:transparent;border-radius:50%}:host .radio-input:focus-visible+.item{outline:2px solid var(--primary-base);outline-offset:2px}:host.color-primary .radio-input:checked+.item:after{border-color:var(--primary-base)}:host.color-secondary .radio-input:checked+.item:after{border-color:var(--secondary-base)}:host.size-compact .item{width:30px;height:30px;min-width:30px;min-height:30px}:host.size-compact .item:after{width:18px;height:18px}:host.size-compact .radio-input{width:30px;height:30px}:host .indicator{width:12px;height:12px;background-color:var(--typography-light);border-radius:50%}:host.color-primary .indicator{background-color:var(--primary-base)}:host.color-secondary .indicator{background-color:var(--secondary-base)}:host.size-compact .indicator{width:10px;height:10px}:host.disabled .item:after{border:2px solid var(--typography-light)!important}:host.disabled .indicator{background-color:var(--typography-light)!important}\n"] }]
4269
+ }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], inputPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputPosition", required: false }] }], clamped: [{ type: i0.Input, args: [{ isSignal: true, alias: "clamped", required: false }] }], margin: [{ type: i0.Input, args: [{ isSignal: true, alias: "margin", required: false }] }], group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }, { type: i0.Output, args: ["groupChange"] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }, { type: i0.Output, args: ["colorChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }, { type: i0.Output, args: ["sizeChange"] }], change: [{ type: i0.Output, args: ["change"] }] } });
4270
+
4223
4271
  /**
4224
4272
  * Form control component for date, time, or datetime-local input with optional icon and Angular forms integration
4225
4273
  * @see [Vision storybook](https://cdn.flywheel.io/docs/vision/master/?path=/docs/form-controls-date-input--docs)
@@ -5961,13 +6009,16 @@ class FwRadioGroupComponent {
5961
6009
  this.sanitizer = inject(DomSanitizer);
5962
6010
  this.dr = inject(DestroyRef);
5963
6011
  this.radioButtons = contentChildren(FwRadioComponent, ...(ngDevMode ? [{ debugName: "radioButtons" }] : /* istanbul ignore next */ []));
6012
+ this.containedRadioButtons = contentChildren(FwContainedRadioComponent, ...(ngDevMode ? [{ debugName: "containedRadioButtons" }] : /* istanbul ignore next */ []));
6013
+ this.allRadios = computed(() => [...this.radioButtons(), ...this.containedRadioButtons()], ...(ngDevMode ? [{ debugName: "allRadios" }] : /* istanbul ignore next */ []));
5964
6014
  this._value = signal(null, ...(ngDevMode ? [{ debugName: "_value" }] : /* istanbul ignore next */ []));
5965
6015
  this.radioSubs = new Map();
6016
+ this.containedRadioSubs = new Map();
5966
6017
  this.onTouch = () => { };
5967
6018
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
5968
6019
  this.onChange = (value) => { };
5969
6020
  effect(() => {
5970
- const radios = this.radioButtons();
6021
+ const radios = this.allRadios();
5971
6022
  const value = this._value();
5972
6023
  const disabled = this.disabled();
5973
6024
  const group = this.group();
@@ -6000,6 +6051,21 @@ class FwRadioGroupComponent {
6000
6051
  }
6001
6052
  });
6002
6053
  });
6054
+ effect(() => {
6055
+ const containedRadios = this.containedRadioButtons();
6056
+ this.containedRadioSubs.forEach((sub, rb) => {
6057
+ if (!containedRadios.includes(rb)) {
6058
+ sub.unsubscribe();
6059
+ this.containedRadioSubs.delete(rb);
6060
+ }
6061
+ });
6062
+ containedRadios.forEach((rb) => {
6063
+ if (!this.containedRadioSubs.has(rb)) {
6064
+ const sub = rb.change.subscribe((value) => this.handleChange(value));
6065
+ this.containedRadioSubs.set(rb, sub);
6066
+ }
6067
+ });
6068
+ });
6003
6069
  }
6004
6070
  writeValue(newValue) {
6005
6071
  this.value.set(newValue);
@@ -6029,11 +6095,11 @@ class FwRadioGroupComponent {
6029
6095
  useExisting: FwRadioGroupComponent,
6030
6096
  multi: true,
6031
6097
  },
6032
- ], queries: [{ propertyName: "radioButtons", predicate: FwRadioComponent, isSignal: true }], ngImport: i0, template: '<ng-content select="fw-radio-button"></ng-content>', isInline: true }); }
6098
+ ], queries: [{ propertyName: "radioButtons", predicate: FwRadioComponent, isSignal: true }, { propertyName: "containedRadioButtons", predicate: FwContainedRadioComponent, isSignal: true }], ngImport: i0, template: '<ng-content select="fw-radio-button, fw-contained-radio"></ng-content>', isInline: true }); }
6033
6099
  }
6034
6100
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FwRadioGroupComponent, decorators: [{
6035
6101
  type: Component,
6036
- args: [{ selector: 'fw-radio-group', template: '<ng-content select="fw-radio-button"></ng-content>', providers: [
6102
+ args: [{ selector: 'fw-radio-group', template: '<ng-content select="fw-radio-button, fw-contained-radio"></ng-content>', providers: [
6037
6103
  {
6038
6104
  provide: NG_VALUE_ACCESSOR,
6039
6105
  useExisting: FwRadioGroupComponent,
@@ -6042,7 +6108,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
6042
6108
  ] }]
6043
6109
  }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], change: [{
6044
6110
  type: Output
6045
- }], radioButtons: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FwRadioComponent), { isSignal: true }] }], style: [{
6111
+ }], radioButtons: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FwRadioComponent), { isSignal: true }] }], containedRadioButtons: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FwContainedRadioComponent), { isSignal: true }] }], style: [{
6046
6112
  type: HostBinding,
6047
6113
  args: ['style']
6048
6114
  }] } });
@@ -11035,5 +11101,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
11035
11101
  * Generated bundle index. Do not edit.
11036
11102
  */
11037
11103
 
11038
- export { DEFAULT_PRESET_COLORS, DEFAULT_RGBA, DialogWidth, FieldType, FwAlertComponent, FwAlertModule, FwAppIconComponent, FwAppIconModule, FwAvatarComponent, FwAvatarListComponent, FwAvatarModule, FwBackButtonComponent, FwBadgeComponent, FwBadgeModule, FwBreadcrumbsComponent, FwBreadcrumbsModule, FwButtonComponent, FwButtonDangerDirective, FwButtonDirective, FwButtonGroupComponent, FwButtonGroupModule, FwButtonModule, FwButtonPrimaryDirective, FwButtonSecondaryDirective, FwButtonSuccessDirective, FwButtonToggleComponent, FwButtonToggleItemComponent, FwButtonToggleModule, FwCardAttributeComponent, FwCardAuthorComponent, FwCardComponent, FwCardContentComponent, FwCardFooterComponent, FwCardHeaderComponent, FwCardModule, FwCell, FwCellDef, FwCheckboxComponent, FwCheckboxGroupComponent, FwCheckboxModule, FwChipComponent, FwChipModule, FwColorPickerComponent, FwColumnDef, FwContainedInputComponent, FwContainedInputModule, FwCrumbComponent, FwDateInputComponent, FwDateInputModule, FwDialogActionsComponent, FwDialogComponent, FwDialogConfirmComponent, FwDialogContentComponent, FwDialogHeaderComponent, FwDialogService, FwDialogSimpleComponent, FwDialogsModule, FwFooterCell, FwFooterCellDef, FwFooterRow, FwFooterRowDef, FwFormHeadingComponent, FwFormHeadingModule, FwFormRendererComponent, FwGridComponent, FwGridItemComponent, FwHeaderCell, FwHeaderCellDef, FwHeaderRow, FwHeaderRowDef, FwIconButtonComponent, FwIconButtonModule, FwIconComponent, FwIconModule, FwLayoutContextComponent, FwLayoutGroupComponent, FwLayoutPanelComponent, FwLayoutSidebarComponent, FwLayoutToolbarComponent, FwLayoutsModule, FwMenuCloseTriggersDirective, FwMenuComponent, FwMenuContainerComponent, FwMenuHeaderComponent, FwMenuItemComponent, FwMenuItemGroupComponent, FwMenuModule, FwMenuSeparatorComponent, FwMenuSubItemComponent, FwMultiSelectMenuComponent, FwNavbarComponent, FwNavbarHeaderComponent, FwNavbarItemComponent, FwNavbarModule, FwNavbarSubItemComponent, FwNoDataRow, FwNumberInputComponent, FwNumberInputModule, FwPaginatorAdvancedComponent, FwPaginatorComponent, FwPaginatorModule, FwPhoneInputComponent, FwPhoneInputModule, FwPopoverComponent, FwPopoverModule, FwPopoverPanelComponent, FwProgressBarComponent, FwProgressModule, FwProgressSpinnerComponent, FwRadioComponent, FwRadioGroupComponent, FwRadioModule, FwRow, FwRowDef, FwSectionHeadingComponent, FwSectionHeadingModule, FwSelectMenuComponent, FwSelectMenuModule, FwSnackbarComponent, FwSnackbarContainerComponent, FwSnackbarModule, FwSnackbarService, FwStepComponent, FwStepDecoratorComponent, FwStepperComponent, FwStepperModule, FwSubsectionHeadingComponent, FwSwitchComponent, FwSwitchModule, FwTabComponent, FwTabPanelComponent, FwTableComponent, FwTableDenseComponent, FwTableModule, FwTabsComponent, FwTabsModule, FwTagComponent, FwTagModule, FwTextAreaInputComponent, FwTextAreaInputModule, FwTextComponent, FwTextInputComponent, FwTextInputModule, FwTimeZoneSelectComponent, FwTooltipComponent, FwTooltipDirective, FwTooltipModule, FwTooltipPanelComponent, FwTypeaheadComponent, FwValidators, FwWrappedInputComponent, FwWrappedInputModule, LayoutWidth, MAX_PRESET_COLORS, MenuManagerService, MenuRegisterDirective, MinimalTranslationService, NoopValueAccessorDirective, TranslationService, allIcons, clamp, genMessageId, hexToRgba, hslaToHsva, hsvaToHsla, hsvaToRgba, notBeforeDate, notFutureDate, rgbaToHex, rgbaToHex8, rgbaToHsva };
11104
+ export { DEFAULT_PRESET_COLORS, DEFAULT_RGBA, DialogWidth, FieldType, FwAlertComponent, FwAlertModule, FwAppIconComponent, FwAppIconModule, FwAvatarComponent, FwAvatarListComponent, FwAvatarModule, FwBackButtonComponent, FwBadgeComponent, FwBadgeModule, FwBreadcrumbsComponent, FwBreadcrumbsModule, FwButtonComponent, FwButtonDangerDirective, FwButtonDirective, FwButtonGroupComponent, FwButtonGroupModule, FwButtonModule, FwButtonPrimaryDirective, FwButtonSecondaryDirective, FwButtonSuccessDirective, FwButtonToggleComponent, FwButtonToggleItemComponent, FwButtonToggleModule, FwCardAttributeComponent, FwCardAuthorComponent, FwCardComponent, FwCardContentComponent, FwCardFooterComponent, FwCardHeaderComponent, FwCardModule, FwCell, FwCellDef, FwCheckboxComponent, FwCheckboxGroupComponent, FwCheckboxModule, FwChipComponent, FwChipModule, FwColorPickerComponent, FwColumnDef, FwContainedInputComponent, FwContainedInputModule, FwContainedRadioComponent, FwCrumbComponent, FwDateInputComponent, FwDateInputModule, FwDialogActionsComponent, FwDialogComponent, FwDialogConfirmComponent, FwDialogContentComponent, FwDialogHeaderComponent, FwDialogService, FwDialogSimpleComponent, FwDialogsModule, FwFooterCell, FwFooterCellDef, FwFooterRow, FwFooterRowDef, FwFormHeadingComponent, FwFormHeadingModule, FwFormRendererComponent, FwGridComponent, FwGridItemComponent, FwHeaderCell, FwHeaderCellDef, FwHeaderRow, FwHeaderRowDef, FwIconButtonComponent, FwIconButtonModule, FwIconComponent, FwIconModule, FwLayoutContextComponent, FwLayoutGroupComponent, FwLayoutPanelComponent, FwLayoutSidebarComponent, FwLayoutToolbarComponent, FwLayoutsModule, FwMenuCloseTriggersDirective, FwMenuComponent, FwMenuContainerComponent, FwMenuHeaderComponent, FwMenuItemComponent, FwMenuItemGroupComponent, FwMenuModule, FwMenuSeparatorComponent, FwMenuSubItemComponent, FwMultiSelectMenuComponent, FwNavbarComponent, FwNavbarHeaderComponent, FwNavbarItemComponent, FwNavbarModule, FwNavbarSubItemComponent, FwNoDataRow, FwNumberInputComponent, FwNumberInputModule, FwPaginatorAdvancedComponent, FwPaginatorComponent, FwPaginatorModule, FwPhoneInputComponent, FwPhoneInputModule, FwPopoverComponent, FwPopoverModule, FwPopoverPanelComponent, FwProgressBarComponent, FwProgressModule, FwProgressSpinnerComponent, FwRadioComponent, FwRadioGroupComponent, FwRadioModule, FwRow, FwRowDef, FwSectionHeadingComponent, FwSectionHeadingModule, FwSelectMenuComponent, FwSelectMenuModule, FwSnackbarComponent, FwSnackbarContainerComponent, FwSnackbarModule, FwSnackbarService, FwStepComponent, FwStepDecoratorComponent, FwStepperComponent, FwStepperModule, FwSubsectionHeadingComponent, FwSwitchComponent, FwSwitchModule, FwTabComponent, FwTabPanelComponent, FwTableComponent, FwTableDenseComponent, FwTableModule, FwTabsComponent, FwTabsModule, FwTagComponent, FwTagModule, FwTextAreaInputComponent, FwTextAreaInputModule, FwTextComponent, FwTextInputComponent, FwTextInputModule, FwTimeZoneSelectComponent, FwTooltipComponent, FwTooltipDirective, FwTooltipModule, FwTooltipPanelComponent, FwTypeaheadComponent, FwValidators, FwWrappedInputComponent, FwWrappedInputModule, LayoutWidth, MAX_PRESET_COLORS, MenuManagerService, MenuRegisterDirective, MinimalTranslationService, NoopValueAccessorDirective, TranslationService, allIcons, clamp, genMessageId, hexToRgba, hslaToHsva, hsvaToHsla, hsvaToRgba, notBeforeDate, notFutureDate, rgbaToHex, rgbaToHex8, rgbaToHsva };
11039
11105
  //# sourceMappingURL=flywheel-io-vision.mjs.map