@flywheel-io/vision 2.9.2 → 2.10.1

package/esm2022/components/navbar/navbar-item/navbar-item.component.mjs

@@ -47,7 +47,7 @@ export class FwNavbarItemComponent {
         return false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FwNavbarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FwNavbarItemComponent, selector: "fw-navbar-item", inputs: { value: "value", title: "title", description: "description", icon: "icon", iconColor: "iconColor", disabled: "disabled", hidden: "hidden", tooltipText: "tooltipText", showTooltip: "showTooltip", collapsed: "collapsed", href: "href", target: "target", subItemsOpen: "subItemsOpen", subItemsTooltipTitle: "subItemsTooltipTitle", selected: "selected" }, host: { properties: { "class.collapsed": "this.collapsed", "class.selected": "this.selected" } }, queries: [{ propertyName: "subItems", predicate: FwNavbarSubItemComponent }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!hidden\">\n  <a [href]=\"href?href:'javascript:void(0)'\" [target]=\"target?target:''\">\n    <fw-tooltip [title]=\"showTooltip ? tooltipText || title : ''\" position=\"right\" [fullWidth]=\"true\">\n      <div\n        [ngClass]=\"['navbar-item', disabled?'disabled':'']\"\n        [class.disabled]=\"disabled\">\n        <fw-icon [color]=\"iconColor\" *ngIf=\"icon\" class=\"navbar-icon {{iconColor}}\">{{ icon }}</fw-icon>\n        <ng-content select=\"fw-avatar\"></ng-content>\n        <div class=\"navbar-text\" *ngIf=\"title\">\n          <h5 class=\"vision-h5\">{{ title }}</h5>\n          <p *ngIf=\"description\" class=\"vision-p4 description\">{{ description }}</p>\n        </div>\n        <div class=\"key-text vision-p2\">\n          <ng-content select=\"p\"></ng-content>\n          <ng-content select=\"fw-badge\"></ng-content>\n          <ng-content select=\"fw-icon\"></ng-content>\n          <ng-content select=\"fw-icon-button\"></ng-content>\n          <fw-tooltip\n            *ngIf=\"subItems.length>0 && !collapsed\"\n            [title]=\"subItemsTooltipTitle\"\n            position=\"right\">\n            <fw-icon-button\n              [size]=\"'small'\"\n              [icon]=\"subItemsOpen?'chevron-up':'chevron-down'\"\n              (click)=\"toggleSubItemsView($event)\">\n            </fw-icon-button>\n          </fw-tooltip>\n        </div>\n      </div>\n    </fw-tooltip>\n  </a>\n</div>\n<div class=\"item-subitems\">\n  <ng-content select=\"fw-navbar-sub-item\"></ng-content>\n</div>\n", styles: [":host{position:relative;display:flex;flex-direction:column}:host a{text-decoration:none;color:var(--typography-base);outline:none;display:flex;flex:1;max-width:100%}:host h5{text-overflow:ellipsis}:host:hover:not(.selected) .navbar-item:not(.disabled),:host.focused:not(.selected) .navbar-item:not(.disabled){background-color:var(--primary-hover);cursor:pointer}:host:hover:not(.selected) .navbar-item:not(.disabled) .navbar-text h5,:host.focused:not(.selected) .navbar-item:not(.disabled) .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-item{background-color:var(--primary-hover);cursor:pointer}:host.selected .navbar-item .navbar-icon{color:var(--primary-base)}:host.selected .navbar-item .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-item:before{position:absolute;content:\" \";height:16px;border-left:3px solid var(--primary-base);margin-left:-16px}:host.collapsed .navbar-item{container-name:navbaritem;container-type:size}:host .navbar-item{box-sizing:border-box;display:flex;flex-direction:row;align-items:center;flex:1;gap:8px;padding:8px 16px;border-radius:6px;margin:1px 4px;color:var(--typography-muted);height:34px;width:stretch;cursor:pointer}:host .navbar-item .navbar-icon{font-size:18px;width:18px;max-width:18px;white-space:nowrap}:host .navbar-item .navbar-text{flex:1;overflow:hidden;padding:2px 0}:host .navbar-item .navbar-text h5{margin:0;color:var(--typography-muted);white-space:nowrap;overflow:hidden}:host .navbar-item .navbar-text p{margin:0}:host .navbar-item .navbar-text p.description{color:var(--typography-light)}:host .navbar-item .key-text{display:flex;align-items:center;gap:8px;color:var(--typography-light)}:host .navbar-item .key-text fw-icon-button{min-height:22px!important;min-width:22px!important;margin-top:2px;margin-right:-4px}:host .navbar-item.disabled{opacity:.4;cursor:not-allowed}:host .item-subitems{display:flex;flex-direction:column}@container navbaritem (max-width: 60px){.navbar-item{gap:0}.navbar-item .navbar-text{opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconButtonComponent, selector: "fw-icon-button", inputs: ["color", "icon", "size", "disabled", "selected"] }, { kind: "component", type: i3.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }, { kind: "component", type: i4.FwTooltipComponent, selector: "fw-tooltip", inputs: ["title", "color", "position", "maxWidth", "fullWidth", "isOpen", "trigger", "delay"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FwNavbarItemComponent, selector: "fw-navbar-item", inputs: { value: "value", title: "title", description: "description", icon: "icon", iconColor: "iconColor", disabled: "disabled", hidden: "hidden", tooltipText: "tooltipText", showTooltip: "showTooltip", collapsed: "collapsed", href: "href", target: "target", subItemsOpen: "subItemsOpen", subItemsTooltipTitle: "subItemsTooltipTitle", selected: "selected" }, host: { properties: { "class.collapsed": "this.collapsed", "class.selected": "this.selected" } }, queries: [{ propertyName: "subItems", predicate: FwNavbarSubItemComponent }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!hidden\">\n  <a [href]=\"href?href:'javascript:void(0)'\" [target]=\"target?target:''\">\n    <fw-tooltip [title]=\"showTooltip ? tooltipText || title : ''\" position=\"right\" [fullWidth]=\"true\">\n      <div\n        [ngClass]=\"['navbar-item', disabled?'disabled':'']\"\n        [class.disabled]=\"disabled\">\n        <fw-icon [color]=\"iconColor\" *ngIf=\"icon\" class=\"navbar-icon {{iconColor}}\">{{ icon }}</fw-icon>\n        <ng-content select=\"fw-avatar\"></ng-content>\n        <div class=\"navbar-text\" *ngIf=\"title\">\n          <h5 class=\"vision-h5\">{{ title }}</h5>\n          <p *ngIf=\"description\" class=\"vision-p4 description\">{{ description }}</p>\n        </div>\n        <div class=\"key-text vision-p2\">\n          <ng-content select=\"p\"></ng-content>\n          <ng-content select=\"fw-badge\"></ng-content>\n          <ng-content select=\"fw-icon\"></ng-content>\n          <ng-content select=\"fw-icon-button\"></ng-content>\n          <fw-tooltip\n            *ngIf=\"subItems.length>0 && !collapsed\"\n            [title]=\"subItemsTooltipTitle\"\n            position=\"right\">\n            <fw-icon-button\n              [size]=\"'small'\"\n              [icon]=\"subItemsOpen?'chevron-up':'chevron-down'\"\n              (click)=\"toggleSubItemsView($event)\">\n            </fw-icon-button>\n          </fw-tooltip>\n        </div>\n      </div>\n    </fw-tooltip>\n  </a>\n</div>\n<div class=\"item-subitems\">\n  <ng-content select=\"fw-navbar-sub-item\"></ng-content>\n</div>\n", styles: [":host{position:relative;display:flex;flex-direction:column}:host a{text-decoration:none;color:var(--typography-base);outline:none;display:flex;flex:1;max-width:100%}:host h5{text-overflow:ellipsis}:host:hover:not(.selected) .navbar-item:not(.disabled),:host.focused:not(.selected) .navbar-item:not(.disabled){background-color:var(--primary-hover);cursor:pointer}:host:hover:not(.selected) .navbar-item:not(.disabled) .navbar-text h5,:host.focused:not(.selected) .navbar-item:not(.disabled) .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-item{background-color:var(--primary-hover);cursor:pointer}:host.selected .navbar-item .navbar-icon{color:var(--primary-base)}:host.selected .navbar-item .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-item:before{position:absolute;content:\" \";height:16px;border-left:3px solid var(--primary-base);margin-left:-16px}:host.collapsed .navbar-item{container-name:navbaritem;container-type:size}:host .navbar-item{box-sizing:border-box;display:flex;flex-direction:row;align-items:center;flex:1;gap:8px;padding:8px 16px;border-radius:6px;margin:1px 4px;color:var(--typography-muted);height:34px;width:stretch;cursor:pointer}:host .navbar-item .navbar-icon{font-size:18px;width:18px;max-width:18px;white-space:nowrap}:host .navbar-item .navbar-text{flex:1;overflow:hidden;padding:2px 0}:host .navbar-item .navbar-text h5{margin:0;color:var(--typography-muted);white-space:nowrap;overflow:hidden}:host .navbar-item .navbar-text p{margin:0}:host .navbar-item .navbar-text p.description{color:var(--typography-light)}:host .navbar-item .key-text{display:flex;align-items:center;gap:8px;color:var(--typography-light)}:host .navbar-item .key-text fw-icon-button{min-height:22px!important;min-width:22px!important;margin-top:2px;margin-right:-4px}:host .navbar-item.disabled{opacity:.4;cursor:not-allowed}:host .item-subitems{display:flex;flex-direction:column}@container navbaritem (max-width: 60px){.navbar-item{gap:0}.navbar-item .navbar-text{opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconButtonComponent, selector: "fw-icon-button", inputs: ["color", "icon", "size", "disabled", "selected", "border"] }, { kind: "component", type: i3.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }, { kind: "component", type: i4.FwTooltipComponent, selector: "fw-tooltip", inputs: ["title", "color", "position", "maxWidth", "fullWidth", "isOpen", "trigger", "delay"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FwNavbarItemComponent, decorators: [{
             type: Component,

package/esm2022/components/snackbar/snackbar/snackbar.component.mjs

@@ -83,7 +83,7 @@ export class FwSnackbarComponent {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FwSnackbarComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.FwSnackbarTimerService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: FwSnackbarComponent, selector: "fw-snackbar", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, messageDuration: { classPropertyName: "messageDuration", publicName: "messageDuration", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ready: "ready", dismiss: "dismiss", action: "action" }, host: { properties: { "class": "this.cssClass" } }, providers: [FwSnackbarTimerService], ngImport: i0, template: "@if (message(); as msg) {\n  @if (icon()) {\n    <fw-icon>{{ icon() }}</fw-icon>\n  }\n  @if (isTemplateRef()) {\n    <ng-container *ngTemplateOutlet=\"$any(msg.message); context: msg.templateContext\"></ng-container>\n  } @else {\n    @if (msg.message) {\n      <h4 class=\"vision-h4\">{{ msg.message }}</h4>\n    }\n  }\n  @if (msg.actionText) {\n    <fw-button\n      size=\"small\"\n      variant=\"ghost\"\n      [color]=\"color()\"\n      (click)=\"handleAction()\"\n    >\n      {{ msg.actionText }}\n    </fw-button>\n  }\n  @if (showClose()) {\n    <fw-icon-button\n      icon=\"close\"\n      size=\"small\"\n      [color]=\"msg.severity\"\n      (click)=\"handleDismiss()\"\n    ></fw-icon-button>\n  }\n  @if (!msg.actionText && !showClose()) {\n    <div></div>\n  }\n}\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,fw-snackbar{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}fw-snackbar{display:flex;align-items:flex-start;box-sizing:border-box;max-width:320px;min-width:200px;min-height:30px;padding:8px 8px 8px 16px;gap:8px;transform-origin:center;background-color:var(--card-header);color:var(--typography-base);white-space:pre-wrap;border-radius:4px;border:1px solid var(--separations-border);margin:8px}fw-snackbar>fw-icon{width:24px;height:24px;font-size:24px;white-space:nowrap;margin:3px 0}fw-snackbar h4{margin:6px 0 0;flex:1}fw-snackbar.primary fw-icon{color:var(--primary-base)}fw-snackbar.danger fw-icon{color:var(--red-base)}fw-snackbar.success fw-icon{color:var(--green-base)}fw-snackbar.warning fw-icon{color:var(--orange-base)}\n"], dependencies: [{ kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.FwButtonComponent, selector: "fw-button", inputs: ["color", "size", "variant", "type", "disabled", "fullWidth", "leftIcon", "rightIcon"] }, { kind: "component", type: i4.FwIconButtonComponent, selector: "fw-icon-button", inputs: ["color", "icon", "size", "disabled", "selected"] }, { kind: "component", type: i5.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: FwSnackbarComponent, selector: "fw-snackbar", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, messageDuration: { classPropertyName: "messageDuration", publicName: "messageDuration", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ready: "ready", dismiss: "dismiss", action: "action" }, host: { properties: { "class": "this.cssClass" } }, providers: [FwSnackbarTimerService], ngImport: i0, template: "@if (message(); as msg) {\n  @if (icon()) {\n    <fw-icon>{{ icon() }}</fw-icon>\n  }\n  @if (isTemplateRef()) {\n    <ng-container *ngTemplateOutlet=\"$any(msg.message); context: msg.templateContext\"></ng-container>\n  } @else {\n    @if (msg.message) {\n      <h4 class=\"vision-h4\">{{ msg.message }}</h4>\n    }\n  }\n  @if (msg.actionText) {\n    <fw-button\n      size=\"small\"\n      variant=\"ghost\"\n      [color]=\"color()\"\n      (click)=\"handleAction()\"\n    >\n      {{ msg.actionText }}\n    </fw-button>\n  }\n  @if (showClose()) {\n    <fw-icon-button\n      icon=\"close\"\n      size=\"small\"\n      [color]=\"msg.severity\"\n      (click)=\"handleDismiss()\"\n    ></fw-icon-button>\n  }\n  @if (!msg.actionText && !showClose()) {\n    <div></div>\n  }\n}\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,fw-snackbar{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}fw-snackbar{display:flex;align-items:flex-start;box-sizing:border-box;max-width:320px;min-width:200px;min-height:30px;padding:8px 8px 8px 16px;gap:8px;transform-origin:center;background-color:var(--card-header);color:var(--typography-base);white-space:pre-wrap;border-radius:4px;border:1px solid var(--separations-border);margin:8px}fw-snackbar>fw-icon{width:24px;height:24px;font-size:24px;white-space:nowrap;margin:3px 0}fw-snackbar h4{margin:6px 0 0;flex:1}fw-snackbar.primary fw-icon{color:var(--primary-base)}fw-snackbar.danger fw-icon{color:var(--red-base)}fw-snackbar.success fw-icon{color:var(--green-base)}fw-snackbar.warning fw-icon{color:var(--orange-base)}\n"], dependencies: [{ kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.FwButtonComponent, selector: "fw-button", inputs: ["color", "size", "variant", "type", "disabled", "fullWidth", "leftIcon", "rightIcon"] }, { kind: "component", type: i4.FwIconButtonComponent, selector: "fw-icon-button", inputs: ["color", "icon", "size", "disabled", "selected", "border"] }, { kind: "component", type: i5.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FwSnackbarComponent, decorators: [{
             type: Component,