@flywheel-io/vision 20.1.2 → 20.1.4
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.
|
@@ -351,6 +351,9 @@ class FwAvatarComponent {
|
|
|
351
351
|
constructor() {
|
|
352
352
|
this.bordered = input(false, ...(ngDevMode ? [{ debugName: "bordered" }] : []));
|
|
353
353
|
this.color = input('primary', ...(ngDevMode ? [{ debugName: "color" }] : []));
|
|
354
|
+
/**
|
|
355
|
+
* A seed that will be hashed to choose a color, overrides the `color` prop if set
|
|
356
|
+
*/
|
|
354
357
|
this.colorSeed = model(...(ngDevMode ? [undefined, { debugName: "colorSeed" }] : []));
|
|
355
358
|
this.content = input('icon', ...(ngDevMode ? [{ debugName: "content" }] : []));
|
|
356
359
|
this.icon = input('user', ...(ngDevMode ? [{ debugName: "icon" }] : []));
|
|
@@ -358,6 +361,9 @@ class FwAvatarComponent {
|
|
|
358
361
|
this.imageUrl = input('', ...(ngDevMode ? [{ debugName: "imageUrl" }] : []));
|
|
359
362
|
this.initial = input('', ...(ngDevMode ? [{ debugName: "initial" }] : []));
|
|
360
363
|
this.selectable = input(false, ...(ngDevMode ? [{ debugName: "selectable" }] : []));
|
|
364
|
+
/**
|
|
365
|
+
* Applies selected styling, they can also be applied by host-context
|
|
366
|
+
*/
|
|
361
367
|
this.selected = model(false, ...(ngDevMode ? [{ debugName: "selected" }] : []));
|
|
362
368
|
this.size = input('small', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
363
369
|
this.variant = input('circular', ...(ngDevMode ? [{ debugName: "variant" }] : []));
|
|
@@ -372,8 +378,8 @@ class FwAvatarComponent {
|
|
|
372
378
|
];
|
|
373
379
|
return classes.filter(Boolean).join(' ');
|
|
374
380
|
}, ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
|
|
375
|
-
this.
|
|
376
|
-
this.colorToDisplay = computed(() => this.colorSeed() ? this.
|
|
381
|
+
this.hashedColor = computed(() => pickColorViaHash(this.colorSeed()), ...(ngDevMode ? [{ debugName: "hashedColor" }] : []));
|
|
382
|
+
this.colorToDisplay = computed(() => this.colorSeed() ? this.hashedColor() : namedColorMap[this.color()], ...(ngDevMode ? [{ debugName: "colorToDisplay" }] : []));
|
|
377
383
|
this.isImageBroken = signal(false, ...(ngDevMode ? [{ debugName: "isImageBroken" }] : []));
|
|
378
384
|
this.reloadImageOnUrlChange = effect(() => {
|
|
379
385
|
this.imageUrl(); // establish dependency
|
|
@@ -724,6 +730,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
|
|
|
724
730
|
*/
|
|
725
731
|
class FwPopoverPanelComponent {
|
|
726
732
|
constructor() {
|
|
733
|
+
this.position = 'above';
|
|
727
734
|
this.mouseLeave = new EventEmitter();
|
|
728
735
|
this.showCaret = input(true, ...(ngDevMode ? [{ debugName: "showCaret" }] : []));
|
|
729
736
|
}
|
|
@@ -734,11 +741,11 @@ class FwPopoverPanelComponent {
|
|
|
734
741
|
this.mouseLeave.emit(e);
|
|
735
742
|
}
|
|
736
743
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FwPopoverPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
737
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.19", type: FwPopoverPanelComponent, isStandalone: true, selector: "fw-popover-panel", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: false, isRequired: false, transformFunction: null }, showCaret: { classPropertyName: "showCaret", publicName: "showCaret", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mouseLeave: "mouseLeave" }, host: { listeners: { "mouseleave": "hidePopover($event)" }, properties: { "attr.class": "this.classes" } }, ngImport: i0, template: "<div class=\"fw-popover-content-wrapper\">\n <ng-content></ng-content>\n <div *ngIf=\"showCaret()\" class=\"fw-popover-caret\"></div>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,:host .fw-popover-content-wrapper{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{opacity:1}:host .fw-popover-content-wrapper{position:relative;background:var(--card-background);border-radius:8px;border:1px solid var(--separations-border);min-width:60px;box-sizing:border-box}:host .fw-popover-content-wrapper .fw-popover-caret{position:absolute;overflow:hidden;width:25px;height:25px}:host .fw-popover-content-wrapper .fw-popover-caret:after{display:block;content:\"\";width:16px;height:16px;background:var(--card-background);border:1px solid var(--separations-border);transform:rotate(45deg);position:relative}:host.fw-popover-above{padding-bottom:16px}:host.fw-popover-above .fw-popover-caret{left:calc(50% - 12.5px);bottom:-16px;height:16px!important}:host.fw-popover-above .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-left{padding-bottom:16px}:host.fw-popover-above-left .fw-popover-caret{right:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-left .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-right{padding-bottom:16px}:host.fw-popover-above-right .fw-popover-caret{left:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-right .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-below{margin-top:16px}:host.fw-popover-below .fw-popover-caret{left:calc(50% - 12.5px);top:-16px;height:16px!important}:host.fw-popover-below .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-left{margin-top:16px}:host.fw-popover-below-left .fw-popover-caret{right:25px;top:-16px;height:16px!important}:host.fw-popover-below-left .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-right{margin-top:16px}:host.fw-popover-below-right .fw-popover-caret{left:25px;top:-16px;height:16px!important}:host.fw-popover-below-right .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-left{margin-right:16px}:host.fw-popover-left .fw-popover-caret{right:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-left .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-above{margin-right:16px}:host.fw-popover-left-above .fw-popover-caret{right:-16px;bottom:25px;width:16px!important}:host.fw-popover-left-above .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-below{margin-right:16px}:host.fw-popover-left-below .fw-popover-caret{right:-16px;top:25px;width:16px!important}:host.fw-popover-left-below .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-right{margin-left:16px}:host.fw-popover-right .fw-popover-caret{left:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-right .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-above{margin-left:16px}:host.fw-popover-right-above .fw-popover-caret{left:-16px;bottom:25px;width:16px!important}:host.fw-popover-right-above .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-below{margin-left:16px}:host.fw-popover-right-below .fw-popover-caret{left:-16px;top:25px;width:16px!important}:host.fw-popover-right-below .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
744
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.19", type: FwPopoverPanelComponent, isStandalone: true, selector: "fw-popover-panel", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: false, isRequired: false, transformFunction: null }, showCaret: { classPropertyName: "showCaret", publicName: "showCaret", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mouseLeave: "mouseLeave" }, host: { listeners: { "mouseleave": "hidePopover($event)" }, properties: { "attr.class": "this.classes" } }, ngImport: i0, template: "<div class=\"fw-popover-content-wrapper\">\n <ng-content></ng-content>\n <div *ngIf=\"showCaret()\" class=\"fw-popover-caret\"></div>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,:host .fw-popover-content-wrapper{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{opacity:1}:host .fw-popover-content-wrapper{position:relative;background:var(--card-background);border-radius:8px;border:1px solid var(--separations-border);min-width:60px;box-sizing:border-box}:host .fw-popover-content-wrapper .fw-popover-caret{pointer-events:none;position:absolute;overflow:hidden;width:25px;height:25px}:host .fw-popover-content-wrapper .fw-popover-caret:after{display:block;content:\"\";width:16px;height:16px;background:var(--card-background);border:1px solid var(--separations-border);transform:rotate(45deg);position:relative}:host.fw-popover-above{padding-bottom:16px}:host.fw-popover-above .fw-popover-caret{left:calc(50% - 12.5px);bottom:-16px;height:16px!important}:host.fw-popover-above .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-left{padding-bottom:16px}:host.fw-popover-above-left .fw-popover-caret{right:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-left .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-right{padding-bottom:16px}:host.fw-popover-above-right .fw-popover-caret{left:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-right .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-below{margin-top:16px}:host.fw-popover-below .fw-popover-caret{left:calc(50% - 12.5px);top:-16px;height:16px!important}:host.fw-popover-below .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-left{margin-top:16px}:host.fw-popover-below-left .fw-popover-caret{right:25px;top:-16px;height:16px!important}:host.fw-popover-below-left .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-right{margin-top:16px}:host.fw-popover-below-right .fw-popover-caret{left:25px;top:-16px;height:16px!important}:host.fw-popover-below-right .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-left{margin-right:16px}:host.fw-popover-left .fw-popover-caret{right:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-left .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-above{margin-right:16px}:host.fw-popover-left-above .fw-popover-caret{right:-16px;bottom:25px;width:16px!important}:host.fw-popover-left-above .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-below{margin-right:16px}:host.fw-popover-left-below .fw-popover-caret{right:-16px;top:25px;width:16px!important}:host.fw-popover-left-below .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-right{margin-left:16px}:host.fw-popover-right .fw-popover-caret{left:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-right .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-above{margin-left:16px}:host.fw-popover-right-above .fw-popover-caret{left:-16px;bottom:25px;width:16px!important}:host.fw-popover-right-above .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-below{margin-left:16px}:host.fw-popover-right-below .fw-popover-caret{left:-16px;top:25px;width:16px!important}:host.fw-popover-right-below .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
738
745
|
}
|
|
739
746
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FwPopoverPanelComponent, decorators: [{
|
|
740
747
|
type: Component,
|
|
741
|
-
args: [{ selector: 'fw-popover-panel', imports: [NgIf], template: "<div class=\"fw-popover-content-wrapper\">\n <ng-content></ng-content>\n <div *ngIf=\"showCaret()\" class=\"fw-popover-caret\"></div>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,:host .fw-popover-content-wrapper{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{opacity:1}:host .fw-popover-content-wrapper{position:relative;background:var(--card-background);border-radius:8px;border:1px solid var(--separations-border);min-width:60px;box-sizing:border-box}:host .fw-popover-content-wrapper .fw-popover-caret{position:absolute;overflow:hidden;width:25px;height:25px}:host .fw-popover-content-wrapper .fw-popover-caret:after{display:block;content:\"\";width:16px;height:16px;background:var(--card-background);border:1px solid var(--separations-border);transform:rotate(45deg);position:relative}:host.fw-popover-above{padding-bottom:16px}:host.fw-popover-above .fw-popover-caret{left:calc(50% - 12.5px);bottom:-16px;height:16px!important}:host.fw-popover-above .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-left{padding-bottom:16px}:host.fw-popover-above-left .fw-popover-caret{right:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-left .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-right{padding-bottom:16px}:host.fw-popover-above-right .fw-popover-caret{left:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-right .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-below{margin-top:16px}:host.fw-popover-below .fw-popover-caret{left:calc(50% - 12.5px);top:-16px;height:16px!important}:host.fw-popover-below .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-left{margin-top:16px}:host.fw-popover-below-left .fw-popover-caret{right:25px;top:-16px;height:16px!important}:host.fw-popover-below-left .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-right{margin-top:16px}:host.fw-popover-below-right .fw-popover-caret{left:25px;top:-16px;height:16px!important}:host.fw-popover-below-right .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-left{margin-right:16px}:host.fw-popover-left .fw-popover-caret{right:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-left .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-above{margin-right:16px}:host.fw-popover-left-above .fw-popover-caret{right:-16px;bottom:25px;width:16px!important}:host.fw-popover-left-above .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-below{margin-right:16px}:host.fw-popover-left-below .fw-popover-caret{right:-16px;top:25px;width:16px!important}:host.fw-popover-left-below .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-right{margin-left:16px}:host.fw-popover-right .fw-popover-caret{left:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-right .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-above{margin-left:16px}:host.fw-popover-right-above .fw-popover-caret{left:-16px;bottom:25px;width:16px!important}:host.fw-popover-right-above .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-below{margin-left:16px}:host.fw-popover-right-below .fw-popover-caret{left:-16px;top:25px;width:16px!important}:host.fw-popover-right-below .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}\n"] }]
|
|
748
|
+
args: [{ selector: 'fw-popover-panel', imports: [NgIf], template: "<div class=\"fw-popover-content-wrapper\">\n <ng-content></ng-content>\n <div *ngIf=\"showCaret()\" class=\"fw-popover-caret\"></div>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,:host .fw-popover-content-wrapper{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{opacity:1}:host .fw-popover-content-wrapper{position:relative;background:var(--card-background);border-radius:8px;border:1px solid var(--separations-border);min-width:60px;box-sizing:border-box}:host .fw-popover-content-wrapper .fw-popover-caret{pointer-events:none;position:absolute;overflow:hidden;width:25px;height:25px}:host .fw-popover-content-wrapper .fw-popover-caret:after{display:block;content:\"\";width:16px;height:16px;background:var(--card-background);border:1px solid var(--separations-border);transform:rotate(45deg);position:relative}:host.fw-popover-above{padding-bottom:16px}:host.fw-popover-above .fw-popover-caret{left:calc(50% - 12.5px);bottom:-16px;height:16px!important}:host.fw-popover-above .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-left{padding-bottom:16px}:host.fw-popover-above-left .fw-popover-caret{right:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-left .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-above-right{padding-bottom:16px}:host.fw-popover-above-right .fw-popover-caret{left:25px;bottom:-16px;height:16px!important}:host.fw-popover-above-right .fw-popover-caret:after{margin:-9px auto;width:16px}:host.fw-popover-below{margin-top:16px}:host.fw-popover-below .fw-popover-caret{left:calc(50% - 12.5px);top:-16px;height:16px!important}:host.fw-popover-below .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-left{margin-top:16px}:host.fw-popover-below-left .fw-popover-caret{right:25px;top:-16px;height:16px!important}:host.fw-popover-below-left .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-below-right{margin-top:16px}:host.fw-popover-below-right .fw-popover-caret{left:25px;top:-16px;height:16px!important}:host.fw-popover-below-right .fw-popover-caret:after{top:16px;margin:-9px auto;width:16px}:host.fw-popover-left{margin-right:16px}:host.fw-popover-left .fw-popover-caret{right:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-left .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-above{margin-right:16px}:host.fw-popover-left-above .fw-popover-caret{right:-16px;bottom:25px;width:16px!important}:host.fw-popover-left-above .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-left-below{margin-right:16px}:host.fw-popover-left-below .fw-popover-caret{right:-16px;top:25px;width:16px!important}:host.fw-popover-left-below .fw-popover-caret:after{top:calc(50% - 8px);left:-9px;width:16px}:host.fw-popover-right{margin-left:16px}:host.fw-popover-right .fw-popover-caret{left:-16px;top:calc(50% - 12.5px);width:16px!important}:host.fw-popover-right .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-above{margin-left:16px}:host.fw-popover-right-above .fw-popover-caret{left:-16px;bottom:25px;width:16px!important}:host.fw-popover-right-above .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}:host.fw-popover-right-below{margin-left:16px}:host.fw-popover-right-below .fw-popover-caret{left:-16px;top:25px;width:16px!important}:host.fw-popover-right-below .fw-popover-caret:after{top:calc(50% - 8px);right:-9px;width:16px}\n"] }]
|
|
742
749
|
}], propDecorators: { position: [{
|
|
743
750
|
type: Input
|
|
744
751
|
}], mouseLeave: [{
|
|
@@ -1159,9 +1166,10 @@ class FwTooltipDirective {
|
|
|
1159
1166
|
const tagsToCloseFor = ['mat-option', 'mat-select', 'fw-menu-item'];
|
|
1160
1167
|
const tagName = nativeElement.tagName.toLowerCase();
|
|
1161
1168
|
if (tagsToCloseFor.includes(tagName)) {
|
|
1169
|
+
// capture: true so stopPropagation() inside fw-menu-item's handleClick doesn't block this
|
|
1162
1170
|
nativeElement.addEventListener('click', () => {
|
|
1163
1171
|
this.hideTooltip();
|
|
1164
|
-
});
|
|
1172
|
+
}, { capture: true });
|
|
1165
1173
|
}
|
|
1166
1174
|
}, ...(ngDevMode ? [{ debugName: "addMouseEventListeners" }] : []));
|
|
1167
1175
|
this.openDelayTimer = 0;
|
|
@@ -3608,7 +3616,7 @@ class FwDialogConfirmComponent {
|
|
|
3608
3616
|
}, 300);
|
|
3609
3617
|
}
|
|
3610
3618
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FwDialogConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3611
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: FwDialogConfirmComponent, isStandalone: true, selector: "fw-dialog-confirm", inputs: { title: "title", icon: "icon", iconColor: "iconColor", confirmColor: "confirmColor", cancelColor: "cancelColor", confirmButtonText: "confirmButtonText", confirmButtonIcon: "confirmButtonIcon", cancelButtonText: "cancelButtonText", contentIcon: "contentIcon", contentTitle: "contentTitle", contentText: "contentText", showConfirmButtonIcon: "showConfirmButtonIcon", showClose: "showClose", width: "width", externalClasses: ["class", "externalClasses"] }, outputs: { close: "close", confirm: "confirm" }, host: { properties: { "class": "this.classes" } }, ngImport: i0, template: "<fw-dialog\n [width]=\"width\"\n [title]=\"title\"\n [icon]=\"icon\"\n [iconColor]=\"iconColor\"\n [showClose]=\"showClose\"\n [ngClass]=\"dialogClasses\">\n <fw-dialog-content>\n <div class=\"dialog-content-confirm\">\n @if (contentIcon) {\n <fw-icon class=\"content-icon\" [ngClass]=\"confirmColor\">\n {{ contentIcon }}\n </fw-icon>\n }\n\n @if (contentTitle) {\n <p class=\"vision-p2 content-title\">\n {{ contentTitle }}\n </p>\n }\n\n @if (contentText) {\n <p class=\"vision-p2 content-text\">\n {{ contentText }}\n </p>\n }\n </div>\n </fw-dialog-content>\n <fw-dialog-actions>\n @if (cancelButtonText) {\n <fw-button\n variant=\"outline\"\n [color]=\"cancelColor\"\n (click)=\"handleCloseButton()\">\n {{ cancelButtonText }}\n </fw-button>\n }\n\n @if (confirmButtonText) {\n <fw-button\n variant=\"solid\"\n [color]=\"confirmColor\"\n [leftIcon]=\"showConfirmButtonIcon ? confirmButtonIcon : null\"\n (click)=\"handleConfirm()\">\n {{ confirmButtonText }}\n </fw-button>\n }\n </fw-dialog-actions>\n</fw-dialog>\n", styles: ["@keyframes slide-in-from-bottom{0%{opacity:0;transform:translateY(100vh)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-bottom{0%{opacity:1;transform:translateY(0)}99%{opacity:0;transform:translateY(100vh)}to{opacity:0;transform:translateY(100vh)}}:host{box-sizing:border-box;animation:slide-in-from-bottom .3s ease-out}:host.dialog-closing{animation:slide-out-to-bottom .3s ease-in forwards}:host .fw-dialog-confirm{position:relative}.dialog-content-confirm{display:flex;flex-direction:column;padding:50px;align-items:center;justify-content:center}.dialog-content-confirm .content-title{margin-bottom:5px;font-weight:500}.dialog-content-confirm .content-text{margin:0;color:var(--typography-muted)}.dialog-content-confirm .content-icon{font-size:50px}.dialog-content-confirm .content-icon.primary{color:var(--primary-base)}.dialog-content-confirm .content-icon.secondary{color:var(--secondary-base)}.dialog-content-confirm .content-icon.slate{color:var(--slate-base)}.dialog-content-confirm .content-icon.success{color:var(--green-base)}.dialog-content-confirm .content-icon.warning{color:var(--orange-base)}.dialog-content-confirm .content-icon.danger{color:var(--red-base)}\n"], dependencies: [{ kind: "component", type: FwDialogComponent, selector: "fw-dialog", inputs: ["width", "title", "icon", "iconColor", "showClose", "class"], outputs: ["close"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FwDialogContentComponent, selector: "fw-dialog-content", inputs: ["padded"] }, { kind: "component", type: FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }, { kind: "component", type: FwDialogActionsComponent, selector: "fw-dialog-actions" }, { kind: "component", type: FwButtonComponent, selector: "fw-button", inputs: ["color", "size", "variant", "type", "disabled", "fullWidth", "leftIcon", "rightIcon"] }] }); }
|
|
3619
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: FwDialogConfirmComponent, isStandalone: true, selector: "fw-dialog-confirm", inputs: { title: "title", icon: "icon", iconColor: "iconColor", confirmColor: "confirmColor", cancelColor: "cancelColor", confirmButtonText: "confirmButtonText", confirmButtonIcon: "confirmButtonIcon", cancelButtonText: "cancelButtonText", contentIcon: "contentIcon", contentTitle: "contentTitle", contentText: "contentText", contentTextAlignment: "contentTextAlignment", showConfirmButtonIcon: "showConfirmButtonIcon", showClose: "showClose", width: "width", externalClasses: ["class", "externalClasses"] }, outputs: { close: "close", confirm: "confirm" }, host: { properties: { "class": "this.classes" } }, ngImport: i0, template: "<fw-dialog\n [width]=\"width\"\n [title]=\"title\"\n [icon]=\"icon\"\n [iconColor]=\"iconColor\"\n [showClose]=\"showClose\"\n [ngClass]=\"dialogClasses\">\n <fw-dialog-content>\n <div class=\"dialog-content-confirm\">\n @if (contentIcon) {\n <fw-icon class=\"content-icon\" [ngClass]=\"confirmColor\">\n {{ contentIcon }}\n </fw-icon>\n }\n\n @if (contentTitle) {\n <p class=\"vision-p2 content-title\">\n {{ contentTitle }}\n </p>\n }\n\n @if (contentText) {\n <p class=\"vision-p2 content-text {{contentTextAlignment}}\">\n {{ contentText }}\n </p>\n }\n </div>\n </fw-dialog-content>\n <fw-dialog-actions>\n @if (cancelButtonText) {\n <fw-button\n variant=\"outline\"\n [color]=\"cancelColor\"\n (click)=\"handleCloseButton()\">\n {{ cancelButtonText }}\n </fw-button>\n }\n\n @if (confirmButtonText) {\n <fw-button\n variant=\"solid\"\n [color]=\"confirmColor\"\n [leftIcon]=\"showConfirmButtonIcon ? confirmButtonIcon : null\"\n (click)=\"handleConfirm()\">\n {{ confirmButtonText }}\n </fw-button>\n }\n </fw-dialog-actions>\n</fw-dialog>\n", styles: ["@keyframes slide-in-from-bottom{0%{opacity:0;transform:translateY(100vh)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-bottom{0%{opacity:1;transform:translateY(0)}99%{opacity:0;transform:translateY(100vh)}to{opacity:0;transform:translateY(100vh)}}:host{box-sizing:border-box;animation:slide-in-from-bottom .3s ease-out}:host.dialog-closing{animation:slide-out-to-bottom .3s ease-in forwards}:host .fw-dialog-confirm{position:relative}.dialog-content-confirm{display:flex;flex-direction:column;padding:50px;align-items:center;justify-content:center}.dialog-content-confirm .content-title{margin-bottom:5px;font-weight:500}.dialog-content-confirm .content-text{margin:0;color:var(--typography-muted)}.dialog-content-confirm .content-text.start{text-align:start}.dialog-content-confirm .content-text.center{text-align:center}.dialog-content-confirm .content-text.end{text-align:end}.dialog-content-confirm .content-icon{font-size:50px}.dialog-content-confirm .content-icon.primary{color:var(--primary-base)}.dialog-content-confirm .content-icon.secondary{color:var(--secondary-base)}.dialog-content-confirm .content-icon.slate{color:var(--slate-base)}.dialog-content-confirm .content-icon.success{color:var(--green-base)}.dialog-content-confirm .content-icon.warning{color:var(--orange-base)}.dialog-content-confirm .content-icon.danger{color:var(--red-base)}\n"], dependencies: [{ kind: "component", type: FwDialogComponent, selector: "fw-dialog", inputs: ["width", "title", "icon", "iconColor", "showClose", "class"], outputs: ["close"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FwDialogContentComponent, selector: "fw-dialog-content", inputs: ["padded"] }, { kind: "component", type: FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }, { kind: "component", type: FwDialogActionsComponent, selector: "fw-dialog-actions" }, { kind: "component", type: FwButtonComponent, selector: "fw-button", inputs: ["color", "size", "variant", "type", "disabled", "fullWidth", "leftIcon", "rightIcon"] }] }); }
|
|
3612
3620
|
}
|
|
3613
3621
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FwDialogConfirmComponent, decorators: [{
|
|
3614
3622
|
type: Component,
|
|
@@ -3619,7 +3627,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
|
|
|
3619
3627
|
FwIconComponent,
|
|
3620
3628
|
FwDialogActionsComponent,
|
|
3621
3629
|
FwButtonComponent,
|
|
3622
|
-
], template: "<fw-dialog\n [width]=\"width\"\n [title]=\"title\"\n [icon]=\"icon\"\n [iconColor]=\"iconColor\"\n [showClose]=\"showClose\"\n [ngClass]=\"dialogClasses\">\n <fw-dialog-content>\n <div class=\"dialog-content-confirm\">\n @if (contentIcon) {\n <fw-icon class=\"content-icon\" [ngClass]=\"confirmColor\">\n {{ contentIcon }}\n </fw-icon>\n }\n\n @if (contentTitle) {\n <p class=\"vision-p2 content-title\">\n {{ contentTitle }}\n </p>\n }\n\n @if (contentText) {\n <p class=\"vision-p2 content-text\">\n {{ contentText }}\n </p>\n }\n </div>\n </fw-dialog-content>\n <fw-dialog-actions>\n @if (cancelButtonText) {\n <fw-button\n variant=\"outline\"\n [color]=\"cancelColor\"\n (click)=\"handleCloseButton()\">\n {{ cancelButtonText }}\n </fw-button>\n }\n\n @if (confirmButtonText) {\n <fw-button\n variant=\"solid\"\n [color]=\"confirmColor\"\n [leftIcon]=\"showConfirmButtonIcon ? confirmButtonIcon : null\"\n (click)=\"handleConfirm()\">\n {{ confirmButtonText }}\n </fw-button>\n }\n </fw-dialog-actions>\n</fw-dialog>\n", styles: ["@keyframes slide-in-from-bottom{0%{opacity:0;transform:translateY(100vh)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-bottom{0%{opacity:1;transform:translateY(0)}99%{opacity:0;transform:translateY(100vh)}to{opacity:0;transform:translateY(100vh)}}:host{box-sizing:border-box;animation:slide-in-from-bottom .3s ease-out}:host.dialog-closing{animation:slide-out-to-bottom .3s ease-in forwards}:host .fw-dialog-confirm{position:relative}.dialog-content-confirm{display:flex;flex-direction:column;padding:50px;align-items:center;justify-content:center}.dialog-content-confirm .content-title{margin-bottom:5px;font-weight:500}.dialog-content-confirm .content-text{margin:0;color:var(--typography-muted)}.dialog-content-confirm .content-icon{font-size:50px}.dialog-content-confirm .content-icon.primary{color:var(--primary-base)}.dialog-content-confirm .content-icon.secondary{color:var(--secondary-base)}.dialog-content-confirm .content-icon.slate{color:var(--slate-base)}.dialog-content-confirm .content-icon.success{color:var(--green-base)}.dialog-content-confirm .content-icon.warning{color:var(--orange-base)}.dialog-content-confirm .content-icon.danger{color:var(--red-base)}\n"] }]
|
|
3630
|
+
], template: "<fw-dialog\n [width]=\"width\"\n [title]=\"title\"\n [icon]=\"icon\"\n [iconColor]=\"iconColor\"\n [showClose]=\"showClose\"\n [ngClass]=\"dialogClasses\">\n <fw-dialog-content>\n <div class=\"dialog-content-confirm\">\n @if (contentIcon) {\n <fw-icon class=\"content-icon\" [ngClass]=\"confirmColor\">\n {{ contentIcon }}\n </fw-icon>\n }\n\n @if (contentTitle) {\n <p class=\"vision-p2 content-title\">\n {{ contentTitle }}\n </p>\n }\n\n @if (contentText) {\n <p class=\"vision-p2 content-text {{contentTextAlignment}}\">\n {{ contentText }}\n </p>\n }\n </div>\n </fw-dialog-content>\n <fw-dialog-actions>\n @if (cancelButtonText) {\n <fw-button\n variant=\"outline\"\n [color]=\"cancelColor\"\n (click)=\"handleCloseButton()\">\n {{ cancelButtonText }}\n </fw-button>\n }\n\n @if (confirmButtonText) {\n <fw-button\n variant=\"solid\"\n [color]=\"confirmColor\"\n [leftIcon]=\"showConfirmButtonIcon ? confirmButtonIcon : null\"\n (click)=\"handleConfirm()\">\n {{ confirmButtonText }}\n </fw-button>\n }\n </fw-dialog-actions>\n</fw-dialog>\n", styles: ["@keyframes slide-in-from-bottom{0%{opacity:0;transform:translateY(100vh)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-bottom{0%{opacity:1;transform:translateY(0)}99%{opacity:0;transform:translateY(100vh)}to{opacity:0;transform:translateY(100vh)}}:host{box-sizing:border-box;animation:slide-in-from-bottom .3s ease-out}:host.dialog-closing{animation:slide-out-to-bottom .3s ease-in forwards}:host .fw-dialog-confirm{position:relative}.dialog-content-confirm{display:flex;flex-direction:column;padding:50px;align-items:center;justify-content:center}.dialog-content-confirm .content-title{margin-bottom:5px;font-weight:500}.dialog-content-confirm .content-text{margin:0;color:var(--typography-muted)}.dialog-content-confirm .content-text.start{text-align:start}.dialog-content-confirm .content-text.center{text-align:center}.dialog-content-confirm .content-text.end{text-align:end}.dialog-content-confirm .content-icon{font-size:50px}.dialog-content-confirm .content-icon.primary{color:var(--primary-base)}.dialog-content-confirm .content-icon.secondary{color:var(--secondary-base)}.dialog-content-confirm .content-icon.slate{color:var(--slate-base)}.dialog-content-confirm .content-icon.success{color:var(--green-base)}.dialog-content-confirm .content-icon.warning{color:var(--orange-base)}.dialog-content-confirm .content-icon.danger{color:var(--red-base)}\n"] }]
|
|
3623
3631
|
}], propDecorators: { title: [{
|
|
3624
3632
|
type: Input
|
|
3625
3633
|
}], icon: [{
|
|
@@ -3642,6 +3650,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
|
|
|
3642
3650
|
type: Input
|
|
3643
3651
|
}], contentText: [{
|
|
3644
3652
|
type: Input
|
|
3653
|
+
}], contentTextAlignment: [{
|
|
3654
|
+
type: Input
|
|
3645
3655
|
}], showConfirmButtonIcon: [{
|
|
3646
3656
|
type: Input
|
|
3647
3657
|
}], showClose: [{
|
|
@@ -8351,11 +8361,11 @@ class FwBackButtonComponent {
|
|
|
8351
8361
|
}
|
|
8352
8362
|
}
|
|
8353
8363
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FwBackButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8354
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: FwBackButtonComponent, isStandalone: true, selector: "fw-back-button", inputs: { backFunction: "backFunction" }, host: { properties: { "attr.class": "this.class" } }, ngImport: i0, template: "<button (click)=\"handleClick()\">\n <fw-icon>arrow-back</fw-icon>\n</button>\n", styles: [".fw-back-button button{color:var(--typography-light);background-color:transparent;border:1px solid var(--slate-border);width:44px;height:44px;border-radius:36px;display:flex;align-items:center;justify-content:center}.fw-back-button button fw-icon{line-height:42px;font-size:24px;color:var(--typography-light)}.fw-back-button button:hover{background-color:var(--primary-hover);border:1px solid var(--primary-hover)}.fw-back-button button:hover fw-icon{color:var(--primary-base)}.fw-back-button button:active{background-color:var(--primary-focus);border:1px solid var(--primary-focus)}.fw-back-button button:active fw-icon{color:var(--primary-base)}\n"], dependencies: [{ kind: "component", type: FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8364
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: FwBackButtonComponent, isStandalone: true, selector: "fw-back-button", inputs: { backFunction: "backFunction" }, host: { properties: { "attr.class": "this.class" } }, ngImport: i0, template: "<button (click)=\"handleClick()\">\n <fw-icon>arrow-back</fw-icon>\n</button>\n", styles: [".fw-back-button button{color:var(--typography-light);background-color:transparent;border:1px solid var(--slate-border);width:44px;height:44px;border-radius:36px;display:flex;align-items:center;justify-content:center;cursor:pointer}.fw-back-button button fw-icon{line-height:42px;font-size:24px;color:var(--typography-light)}.fw-back-button button:hover{background-color:var(--primary-hover);border:1px solid var(--primary-hover)}.fw-back-button button:hover fw-icon{color:var(--primary-base)}.fw-back-button button:active{background-color:var(--primary-focus);border:1px solid var(--primary-focus)}.fw-back-button button:active fw-icon{color:var(--primary-base)}\n"], dependencies: [{ kind: "component", type: FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8355
8365
|
}
|
|
8356
8366
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FwBackButtonComponent, decorators: [{
|
|
8357
8367
|
type: Component,
|
|
8358
|
-
args: [{ selector: 'fw-back-button', encapsulation: ViewEncapsulation.None, imports: [FwIconComponent], template: "<button (click)=\"handleClick()\">\n <fw-icon>arrow-back</fw-icon>\n</button>\n", styles: [".fw-back-button button{color:var(--typography-light);background-color:transparent;border:1px solid var(--slate-border);width:44px;height:44px;border-radius:36px;display:flex;align-items:center;justify-content:center}.fw-back-button button fw-icon{line-height:42px;font-size:24px;color:var(--typography-light)}.fw-back-button button:hover{background-color:var(--primary-hover);border:1px solid var(--primary-hover)}.fw-back-button button:hover fw-icon{color:var(--primary-base)}.fw-back-button button:active{background-color:var(--primary-focus);border:1px solid var(--primary-focus)}.fw-back-button button:active fw-icon{color:var(--primary-base)}\n"] }]
|
|
8368
|
+
args: [{ selector: 'fw-back-button', encapsulation: ViewEncapsulation.None, imports: [FwIconComponent], template: "<button (click)=\"handleClick()\">\n <fw-icon>arrow-back</fw-icon>\n</button>\n", styles: [".fw-back-button button{color:var(--typography-light);background-color:transparent;border:1px solid var(--slate-border);width:44px;height:44px;border-radius:36px;display:flex;align-items:center;justify-content:center;cursor:pointer}.fw-back-button button fw-icon{line-height:42px;font-size:24px;color:var(--typography-light)}.fw-back-button button:hover{background-color:var(--primary-hover);border:1px solid var(--primary-hover)}.fw-back-button button:hover fw-icon{color:var(--primary-base)}.fw-back-button button:active{background-color:var(--primary-focus);border:1px solid var(--primary-focus)}.fw-back-button button:active fw-icon{color:var(--primary-base)}\n"] }]
|
|
8359
8369
|
}], propDecorators: { backFunction: [{
|
|
8360
8370
|
type: Input
|
|
8361
8371
|
}], class: [{
|