@flywheel-io/vision 2.3.0-beta.0 → 2.3.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.
- package/components/popover/popover-panel/popover-panel.component.d.ts +2 -1
- package/components/popover/popover.component.d.ts +14 -5
- package/components/tooltip/tooltip.component.d.ts +12 -1
- package/esm2022/components/avatar/avatar.component.mjs +1 -1
- package/esm2022/components/card/card-content/card-content.component.mjs +2 -2
- package/esm2022/components/card/card-header/card-header.component.mjs +2 -2
- package/esm2022/components/date-input/date-input.component.mjs +2 -2
- package/esm2022/components/layouts/grid/grid.component.mjs +4 -4
- package/esm2022/components/menu/menu-item-group/menu-item-group.component.mjs +2 -2
- package/esm2022/components/navbar/navbar-item/navbar-item.component.mjs +1 -1
- package/esm2022/components/navbar/navbar-sub-item/navbar-sub-item.component.mjs +2 -2
- package/esm2022/components/number-input/number-input.component.mjs +2 -2
- package/esm2022/components/phone-input/phone-input.component.mjs +2 -2
- package/esm2022/components/popover/popover-panel/popover-panel.component.mjs +6 -4
- package/esm2022/components/popover/popover.component.mjs +55 -12
- package/esm2022/components/snackbar/snackbar-container/snackbar-container.component.mjs +4 -4
- package/esm2022/components/table/table-dense.component.mjs +2 -2
- package/esm2022/components/table/table.component.mjs +2 -2
- package/esm2022/components/text-input/text-input.component.mjs +2 -2
- package/esm2022/components/textarea-input/textarea-input.component.mjs +2 -2
- package/esm2022/components/tooltip/tooltip.component.mjs +49 -4
- package/fesm2022/flywheel-io-vision.mjs +130 -43
- package/fesm2022/flywheel-io-vision.mjs.map +1 -1
- package/package.json +1 -1
- package/scss/config/typography.scss +25 -1
- package/styles.css +23 -0
- package/flywheel-io-vision-2.3.0-beta.0.tgz +0 -0
|
@@ -11,7 +11,7 @@ export class FwNavbarSubItemComponent {
|
|
|
11
11
|
this.selected = false;
|
|
12
12
|
}
|
|
13
13
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FwNavbarSubItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FwNavbarSubItemComponent, selector: "fw-navbar-sub-item", inputs: { value: "value", title: "title", description: "description", icon: "icon", disabled: "disabled", hidden: "hidden", tooltipText: "tooltipText", showTooltip: "showTooltip", href: "href", target: "target", collapsed: "collapsed", selected: "selected" }, host: { properties: { "class.collapsed": "this.collapsed", "class.selected": "this.selected" } }, ngImport: i0, template: "<div\n *ngIf=\"!hidden\"\n [@openClose]=\"{value: collapsed?'closed':'open'}\">\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-sub-item', disabled?'disabled':'']\"\n [class.disabled]=\"disabled\">\n <div class=\"navbar-text\" *ngIf=\"title\">\n <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 </div>\n </div>\n </fw-tooltip>\n </a>\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 .navbar-sub-item:not(.disabled),:host.focused:not(.selected) .navbar-sub-item:not(.disabled){background-color:var(--primary-hover);cursor:pointer}:host:hover .navbar-sub-item:not(.disabled) .navbar-icon,:host.focused:not(.selected) .navbar-sub-item:not(.disabled) .navbar-icon{color:var(--primary-base)}:host:hover .navbar-sub-item:not(.disabled) .navbar-text h5,:host.focused:not(.selected) .navbar-sub-item:not(.disabled) .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-sub-item{background-color:var(--primary-hover);cursor:pointer}:host.selected .navbar-sub-item .navbar-icon{color:var(--primary-base)}:host.selected .navbar-sub-item .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-sub-item:before{position:absolute;content:\" \";height:16px;border-left:3px solid var(--primary-base);margin-left:-16px}:host.collapsed .navbar-sub-item{container-name:navbaritem;container-type:size}:host fw-tooltip{display:flex;flex-direction:row;flex:1;width:stretch}:host fw-tooltip .tooltip-trigger{display:flex;flex-direction:row;flex:1;width:stretch}:host .navbar-sub-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:30px;width:stretch;cursor:pointer}:host .navbar-sub-item .navbar-icon{font-size:18px;white-space:nowrap}:host .navbar-sub-item .navbar-text{flex:1;overflow:hidden;padding:2px 0 2px 26px}:host .navbar-sub-item .navbar-text h5{margin:0;color:var(--typography-muted);white-space:nowrap;overflow:hidden}:host .navbar-sub-item .navbar-text p{margin:0}:host .navbar-sub-item .navbar-text p.description{color:var(--typography-light)}:host .navbar-sub-item .key-text{display:flex;align-items:center;gap:8px;color:var(--typography-light)}:host .navbar-sub-item .key-text fw-icon-button{min-height:22px!important;min-width:22px!important}:host .navbar-sub-item.disabled{opacity:.4;cursor:not-allowed}@container navbaritem (max-width: 60px){.navbar-sub-item{gap:0}.navbar-sub-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.FwTooltipComponent, selector: "fw-tooltip", inputs: ["title", "color", "position", "maxWidth", "fullWidth", "isOpen", "trigger"] }], animations: [
|
|
14
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FwNavbarSubItemComponent, selector: "fw-navbar-sub-item", inputs: { value: "value", title: "title", description: "description", icon: "icon", disabled: "disabled", hidden: "hidden", tooltipText: "tooltipText", showTooltip: "showTooltip", href: "href", target: "target", collapsed: "collapsed", selected: "selected" }, host: { properties: { "class.collapsed": "this.collapsed", "class.selected": "this.selected" } }, ngImport: i0, template: "<div\n *ngIf=\"!hidden\"\n [@openClose]=\"{value: collapsed?'closed':'open'}\">\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-sub-item', disabled?'disabled':'']\"\n [class.disabled]=\"disabled\">\n <div class=\"navbar-text\" *ngIf=\"title\">\n <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 </div>\n </div>\n </fw-tooltip>\n </a>\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 .navbar-sub-item:not(.disabled),:host.focused:not(.selected) .navbar-sub-item:not(.disabled){background-color:var(--primary-hover);cursor:pointer}:host:hover .navbar-sub-item:not(.disabled) .navbar-icon,:host.focused:not(.selected) .navbar-sub-item:not(.disabled) .navbar-icon{color:var(--primary-base)}:host:hover .navbar-sub-item:not(.disabled) .navbar-text h5,:host.focused:not(.selected) .navbar-sub-item:not(.disabled) .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-sub-item{background-color:var(--primary-hover);cursor:pointer}:host.selected .navbar-sub-item .navbar-icon{color:var(--primary-base)}:host.selected .navbar-sub-item .navbar-text h5{color:var(--typography-base)}:host.selected .navbar-sub-item:before{position:absolute;content:\" \";height:16px;border-left:3px solid var(--primary-base);margin-left:-16px}:host.collapsed .navbar-sub-item{container-name:navbaritem;container-type:size}:host fw-tooltip{display:flex;flex-direction:row;flex:1;width:stretch}:host fw-tooltip .tooltip-trigger{display:flex;flex-direction:row;flex:1;width:stretch}:host .navbar-sub-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:30px;width:stretch;cursor:pointer}:host .navbar-sub-item .navbar-icon{font-size:18px;white-space:nowrap}:host .navbar-sub-item .navbar-text{flex:1;overflow:hidden;padding:2px 0 2px 26px}:host .navbar-sub-item .navbar-text h5{margin:0;color:var(--typography-muted);white-space:nowrap;overflow:hidden}:host .navbar-sub-item .navbar-text p{margin:0}:host .navbar-sub-item .navbar-text p.description{color:var(--typography-light)}:host .navbar-sub-item .key-text{display:flex;align-items:center;gap:8px;color:var(--typography-light)}:host .navbar-sub-item .key-text fw-icon-button{min-height:22px!important;min-width:22px!important}:host .navbar-sub-item.disabled{opacity:.4;cursor:not-allowed}@container navbaritem (max-width: 60px){.navbar-sub-item{gap:0}.navbar-sub-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.FwTooltipComponent, selector: "fw-tooltip", inputs: ["title", "color", "position", "maxWidth", "fullWidth", "isOpen", "trigger", "delay"] }], animations: [
|
|
15
15
|
trigger('openClose', [
|
|
16
16
|
// ...
|
|
17
17
|
state('open', style({
|
|
@@ -73,4 +73,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
73
73
|
}, {
|
|
74
74
|
type: Input
|
|
75
75
|
}] } });
|
|
76
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
76
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2YmFyLXN1Yi1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL25hdmJhci9uYXZiYXItc3ViLWl0ZW0vbmF2YmFyLXN1Yi1pdGVtLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL25hdmJhci9uYXZiYXItc3ViLWl0ZW0vbmF2YmFyLXN1Yi1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsT0FBTyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDakYsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBd0I5RCxNQUFNLE9BQU8sd0JBQXdCO0lBbkJyQztRQXlCVyxXQUFNLEdBQWEsS0FBSyxDQUFDO1FBRXpCLGdCQUFXLEdBQWEsS0FBSyxDQUFDO1FBSXZDLDREQUE0RDtRQUNwQixhQUFRLEdBQWEsS0FBSyxDQUFDO0tBQ3BFOytHQWRZLHdCQUF3QjttR0FBeEIsd0JBQXdCLGdhQ3pCckMsdTVCQXNCQSxxb0ZEWmM7WUFDVixPQUFPLENBQUMsV0FBVyxFQUFFO2dCQUNuQixNQUFNO2dCQUNOLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDO29CQUNsQixNQUFNLEVBQUUsTUFBTTtpQkFDZixDQUFDLEVBQUUsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUM7Z0JBQ25CLEtBQUssQ0FBQyxRQUFRLEVBQUUsS0FBSyxDQUFDO29CQUNwQixNQUFNLEVBQUUsR0FBRztpQkFDWixDQUFDLEVBQUUsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUM7Z0JBQ25CLFVBQVUsQ0FBQyxpQkFBaUIsRUFBRTtvQkFDNUIsT0FBTyxDQUFDLGtCQUFrQixDQUFDO2lCQUM1QixDQUFDO2FBQ0gsQ0FBQztTQUNIOzs0RkFFVSx3QkFBd0I7a0JBbkJwQyxTQUFTOytCQUNFLG9CQUFvQixjQUdsQjt3QkFDVixPQUFPLENBQUMsV0FBVyxFQUFFOzRCQUNuQixNQUFNOzRCQUNOLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDO2dDQUNsQixNQUFNLEVBQUUsTUFBTTs2QkFDZixDQUFDLEVBQUUsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUM7NEJBQ25CLEtBQUssQ0FBQyxRQUFRLEVBQUUsS0FBSyxDQUFDO2dDQUNwQixNQUFNLEVBQUUsR0FBRzs2QkFDWixDQUFDLEVBQUUsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUM7NEJBQ25CLFVBQVUsQ0FBQyxpQkFBaUIsRUFBRTtnQ0FDNUIsT0FBTyxDQUFDLGtCQUFrQixDQUFDOzZCQUM1QixDQUFDO3lCQUNILENBQUM7cUJBQ0g7OEJBR1EsS0FBSztzQkFBYixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDbUMsU0FBUztzQkFBakQsV0FBVzt1QkFBQyxpQkFBaUI7O3NCQUFHLEtBQUs7Z0JBRUUsUUFBUTtzQkFBL0MsV0FBVzt1QkFBQyxnQkFBZ0I7O3NCQUFHLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBhbmltYXRlLCBzdGF0ZSwgc3R5bGUsIHRyYW5zaXRpb24sIHRyaWdnZXIgfSBmcm9tICdAYW5ndWxhci9hbmltYXRpb25zJztcbmltcG9ydCB7IENvbXBvbmVudCwgSG9zdEJpbmRpbmcsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IEljb25UeXBlIH0gZnJvbSAnLi4vLi4vaWNvbi9pY29uLnR5cGVzJztcblxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmdy1uYXZiYXItc3ViLWl0ZW0nLFxuICB0ZW1wbGF0ZVVybDogJy4vbmF2YmFyLXN1Yi1pdGVtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vbmF2YmFyLXN1Yi1pdGVtLmNvbXBvbmVudC5zY3NzJ10sXG4gIGFuaW1hdGlvbnM6IFtcbiAgICB0cmlnZ2VyKCdvcGVuQ2xvc2UnLCBbXG4gICAgICAvLyAuLi5cbiAgICAgIHN0YXRlKCdvcGVuJywgc3R5bGUoe1xuICAgICAgICBoZWlnaHQ6ICdhdXRvJyxcbiAgICAgIH0pLCB7IHBhcmFtczoge30gfSksXG4gICAgICBzdGF0ZSgnY2xvc2VkJywgc3R5bGUoe1xuICAgICAgICBoZWlnaHQ6ICcwJyxcbiAgICAgIH0pLCB7IHBhcmFtczoge30gfSksXG4gICAgICB0cmFuc2l0aW9uKCdvcGVuIDw9PiBjbG9zZWQnLCBbXG4gICAgICAgIGFuaW1hdGUoJy4zM3MgZWFzZS1pbi1vdXQnKSxcbiAgICAgIF0pLFxuICAgIF0pLFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBGd05hdmJhclN1Ykl0ZW1Db21wb25lbnQge1xuICBASW5wdXQoKSB2YWx1ZT86IHN0cmluZztcbiAgQElucHV0KCkgdGl0bGU6IHN0cmluZztcbiAgQElucHV0KCkgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGljb24/OiBJY29uVHlwZTtcbiAgQElucHV0KCkgZGlzYWJsZWQ/OiBib29sZWFuO1xuICBASW5wdXQoKSBoaWRkZW4/OiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHRvb2x0aXBUZXh0Pzogc3RyaW5nO1xuICBASW5wdXQoKSBzaG93VG9vbHRpcD86IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgaHJlZj86IHN0cmluZztcbiAgQElucHV0KCkgdGFyZ2V0Pzogc3RyaW5nO1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmNvbGxhcHNlZCcpIEBJbnB1dCgpIGNvbGxhcHNlZD86IGJvb2xlYW47XG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAYW5ndWxhci1lc2xpbnQvbm8tb3V0cHV0LW5hdGl2ZVxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNlbGVjdGVkJykgQElucHV0KCkgc2VsZWN0ZWQ/OiBib29sZWFuID0gZmFsc2U7XG59XG4iLCI8ZGl2XG4gICpuZ0lmPVwiIWhpZGRlblwiXG4gIFtAb3BlbkNsb3NlXT1cInt2YWx1ZTogY29sbGFwc2VkPydjbG9zZWQnOidvcGVuJ31cIj5cbiAgPGEgW2hyZWZdPVwiaHJlZj9ocmVmOidqYXZhc2NyaXB0OnZvaWQoMCknXCIgW3RhcmdldF09XCJ0YXJnZXQ/dGFyZ2V0OicnXCI+XG4gICAgPGZ3LXRvb2x0aXAgW3RpdGxlXT1cInNob3dUb29sdGlwID8gdG9vbHRpcFRleHQgfHwgdGl0bGUgOiAnJ1wiIHBvc2l0aW9uPVwicmlnaHRcIiBbZnVsbFdpZHRoXT1cInRydWVcIj5cbiAgICAgIDxkaXZcbiAgICAgICAgW25nQ2xhc3NdPVwiWyduYXZiYXItc3ViLWl0ZW0nLCBkaXNhYmxlZD8nZGlzYWJsZWQnOicnXVwiXG4gICAgICAgIFtjbGFzcy5kaXNhYmxlZF09XCJkaXNhYmxlZFwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwibmF2YmFyLXRleHRcIiAqbmdJZj1cInRpdGxlXCI+XG4gICAgICAgICAgPGg1Pnt7IHRpdGxlIH19PC9oNT5cbiAgICAgICAgICA8cCAqbmdJZj1cImRlc2NyaXB0aW9uXCIgY2xhc3M9XCJ2aXNpb24tcDQgZGVzY3JpcHRpb25cIj57eyBkZXNjcmlwdGlvbiB9fTwvcD5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJrZXktdGV4dCB2aXNpb24tcDJcIj5cbiAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJwXCI+PC9uZy1jb250ZW50PlxuICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImZ3LWJhZGdlXCI+PC9uZy1jb250ZW50PlxuICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImZ3LWljb25cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiZnctaWNvbi1idXR0b25cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC9mdy10b29sdGlwPlxuICA8L2E+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -63,7 +63,7 @@ export class FwNumberInputComponent {
|
|
|
63
63
|
provide: NG_VALUE_ACCESSOR,
|
|
64
64
|
useExisting: FwNumberInputComponent,
|
|
65
65
|
multi: true,
|
|
66
|
-
}], viewQueries: [{ propertyName: "numberInput", first: true, predicate: ["numberInput"], descendants: true }], ngImport: i0, template: "<div class=\"full-container\" [ngClass]=\"{'disabled': disabled}\">\n <div class=\"input-container\" [class]=\"size\">\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleDecrement()\">-</button>\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ leftIcon }}\n </fw-icon>\n <p class=\"vision-p2 context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n\n <input\n #numberInput\n [class]=\"arrows\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n [value]=\"value\"\n type=\"number\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\"\n >\n <ng-content select=\"input\"></ng-content>\n <p class=\"vision-p2 context\" *ngIf=\"!!context\">{{ context }}</p>\n\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n <fw-icon\n *ngIf=\"!!rightIcon\"\n (click)=\"useActionableIcons?onRightIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ rightIcon }}\n </fw-icon>\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleIncrement()\">+</button>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4{font-size:10px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-link{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link:hover{text-decoration:none}.vision-link:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link:visited{color:var(--secondary-base)}.vision-link-inherited{text-decoration:underline;color:var(--primary-base);cursor:pointer;color:inherit}.vision-link-inherited:hover{text-decoration:none}.vision-link-inherited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-inherited:visited{color:var(--secondary-base)}.vision-link-inherited:visited{color:inherit}.vision-link-no-visited{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link-no-visited:hover{text-decoration:none}.vision-link-no-visited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-no-visited:visited{color:var(--secondary-base)}.vision-link-no-visited:visited{color:var(--primary-base)}.full-container{display:flex;flex-direction:column;line-height:21px}.full-container.disabled{cursor:not-allowed}.full-container.disabled fw-icon{cursor:not-allowed!important}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input.native[type=number]::-webkit-inner-spin-button,.full-container .input-container input.native[type=number]::-webkit-outer-spin-button{opacity:1;filter:brightness(1.1)}.full-container .input-container input.none::-webkit-outer-spin-button,.full-container .input-container input.none::-webkit-inner-spin-button,.full-container .input-container input.plus-minus::-webkit-outer-spin-button,.full-container .input-container input.plus-minus::-webkit-inner-spin-button{appearance:none;margin:0}.full-container .input-container input.none[type=number],.full-container .input-container input.plus-minus[type=number]{appearance:textfield}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .input-container button{background:transparent;border:none;cursor:pointer;padding:0;margin:0;aspect-ratio:1}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px;min-width:18px;width:18px}.medium{height:36px}.medium>fw-icon{font-size:20px;min-width:20px;width:20px}.large{height:40px}.large>fw-icon{font-size:24px;min-width:24px;width:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}.disabled .actionable:hover{color:var(--typography-light);background-color:transparent}\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.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] }); }
|
|
66
|
+
}], viewQueries: [{ propertyName: "numberInput", first: true, predicate: ["numberInput"], descendants: true }], ngImport: i0, template: "<div class=\"full-container\" [ngClass]=\"{'disabled': disabled}\">\n <div class=\"input-container\" [class]=\"size\">\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleDecrement()\">-</button>\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ leftIcon }}\n </fw-icon>\n <p class=\"vision-p2 context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n\n <input\n #numberInput\n [class]=\"arrows\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n [value]=\"value\"\n type=\"number\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\"\n >\n <ng-content select=\"input\"></ng-content>\n <p class=\"vision-p2 context\" *ngIf=\"!!context\">{{ context }}</p>\n\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n <fw-icon\n *ngIf=\"!!rightIcon\"\n (click)=\"useActionableIcons?onRightIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ rightIcon }}\n </fw-icon>\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleIncrement()\">+</button>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-h6{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:10px;line-height:120%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4{font-size:10px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p5{font-size:8px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-link{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link:hover{text-decoration:none}.vision-link:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link:visited{color:var(--secondary-base)}.vision-link-inherited{text-decoration:underline;color:var(--primary-base);cursor:pointer;color:inherit}.vision-link-inherited:hover{text-decoration:none}.vision-link-inherited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-inherited:visited{color:var(--secondary-base)}.vision-link-inherited:visited{color:inherit}.vision-link-no-visited{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link-no-visited:hover{text-decoration:none}.vision-link-no-visited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-no-visited:visited{color:var(--secondary-base)}.vision-link-no-visited:visited{color:var(--primary-base)}.full-container{display:flex;flex-direction:column;line-height:21px}.full-container.disabled{cursor:not-allowed}.full-container.disabled fw-icon{cursor:not-allowed!important}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input.native[type=number]::-webkit-inner-spin-button,.full-container .input-container input.native[type=number]::-webkit-outer-spin-button{opacity:1;filter:brightness(1.1)}.full-container .input-container input.none::-webkit-outer-spin-button,.full-container .input-container input.none::-webkit-inner-spin-button,.full-container .input-container input.plus-minus::-webkit-outer-spin-button,.full-container .input-container input.plus-minus::-webkit-inner-spin-button{appearance:none;margin:0}.full-container .input-container input.none[type=number],.full-container .input-container input.plus-minus[type=number]{appearance:textfield}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .input-container button{background:transparent;border:none;cursor:pointer;padding:0;margin:0;aspect-ratio:1}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px;min-width:18px;width:18px}.medium{height:36px}.medium>fw-icon{font-size:20px;min-width:20px;width:20px}.large{height:40px}.large>fw-icon{font-size:24px;min-width:24px;width:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}.disabled .actionable:hover{color:var(--typography-light);background-color:transparent}\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.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] }); }
|
|
67
67
|
}
|
|
68
68
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FwNumberInputComponent, decorators: [{
|
|
69
69
|
type: Component,
|
|
@@ -71,7 +71,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
71
71
|
provide: NG_VALUE_ACCESSOR,
|
|
72
72
|
useExisting: FwNumberInputComponent,
|
|
73
73
|
multi: true,
|
|
74
|
-
}], template: "<div class=\"full-container\" [ngClass]=\"{'disabled': disabled}\">\n <div class=\"input-container\" [class]=\"size\">\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleDecrement()\">-</button>\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ leftIcon }}\n </fw-icon>\n <p class=\"vision-p2 context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n\n <input\n #numberInput\n [class]=\"arrows\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n [value]=\"value\"\n type=\"number\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\"\n >\n <ng-content select=\"input\"></ng-content>\n <p class=\"vision-p2 context\" *ngIf=\"!!context\">{{ context }}</p>\n\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n <fw-icon\n *ngIf=\"!!rightIcon\"\n (click)=\"useActionableIcons?onRightIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ rightIcon }}\n </fw-icon>\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleIncrement()\">+</button>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4{font-size:10px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-link{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link:hover{text-decoration:none}.vision-link:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link:visited{color:var(--secondary-base)}.vision-link-inherited{text-decoration:underline;color:var(--primary-base);cursor:pointer;color:inherit}.vision-link-inherited:hover{text-decoration:none}.vision-link-inherited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-inherited:visited{color:var(--secondary-base)}.vision-link-inherited:visited{color:inherit}.vision-link-no-visited{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link-no-visited:hover{text-decoration:none}.vision-link-no-visited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-no-visited:visited{color:var(--secondary-base)}.vision-link-no-visited:visited{color:var(--primary-base)}.full-container{display:flex;flex-direction:column;line-height:21px}.full-container.disabled{cursor:not-allowed}.full-container.disabled fw-icon{cursor:not-allowed!important}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input.native[type=number]::-webkit-inner-spin-button,.full-container .input-container input.native[type=number]::-webkit-outer-spin-button{opacity:1;filter:brightness(1.1)}.full-container .input-container input.none::-webkit-outer-spin-button,.full-container .input-container input.none::-webkit-inner-spin-button,.full-container .input-container input.plus-minus::-webkit-outer-spin-button,.full-container .input-container input.plus-minus::-webkit-inner-spin-button{appearance:none;margin:0}.full-container .input-container input.none[type=number],.full-container .input-container input.plus-minus[type=number]{appearance:textfield}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .input-container button{background:transparent;border:none;cursor:pointer;padding:0;margin:0;aspect-ratio:1}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px;min-width:18px;width:18px}.medium{height:36px}.medium>fw-icon{font-size:20px;min-width:20px;width:20px}.large{height:40px}.large>fw-icon{font-size:24px;min-width:24px;width:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}.disabled .actionable:hover{color:var(--typography-light);background-color:transparent}\n"] }]
|
|
74
|
+
}], template: "<div class=\"full-container\" [ngClass]=\"{'disabled': disabled}\">\n <div class=\"input-container\" [class]=\"size\">\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleDecrement()\">-</button>\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ leftIcon }}\n </fw-icon>\n <p class=\"vision-p2 context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n\n <input\n #numberInput\n [class]=\"arrows\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n [value]=\"value\"\n type=\"number\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\"\n >\n <ng-content select=\"input\"></ng-content>\n <p class=\"vision-p2 context\" *ngIf=\"!!context\">{{ context }}</p>\n\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n <fw-icon\n *ngIf=\"!!rightIcon\"\n (click)=\"useActionableIcons?onRightIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">{{ rightIcon }}\n </fw-icon>\n <button *ngIf=\"arrows === 'plus-minus'\" (click)=\"handleIncrement()\">+</button>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-h6{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:10px;line-height:120%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4{font-size:10px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p5{font-size:8px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-link{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link:hover{text-decoration:none}.vision-link:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link:visited{color:var(--secondary-base)}.vision-link-inherited{text-decoration:underline;color:var(--primary-base);cursor:pointer;color:inherit}.vision-link-inherited:hover{text-decoration:none}.vision-link-inherited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-inherited:visited{color:var(--secondary-base)}.vision-link-inherited:visited{color:inherit}.vision-link-no-visited{text-decoration:underline;color:var(--primary-base);cursor:pointer}.vision-link-no-visited:hover{text-decoration:none}.vision-link-no-visited:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}.vision-link-no-visited:visited{color:var(--secondary-base)}.vision-link-no-visited:visited{color:var(--primary-base)}.full-container{display:flex;flex-direction:column;line-height:21px}.full-container.disabled{cursor:not-allowed}.full-container.disabled fw-icon{cursor:not-allowed!important}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input.native[type=number]::-webkit-inner-spin-button,.full-container .input-container input.native[type=number]::-webkit-outer-spin-button{opacity:1;filter:brightness(1.1)}.full-container .input-container input.none::-webkit-outer-spin-button,.full-container .input-container input.none::-webkit-inner-spin-button,.full-container .input-container input.plus-minus::-webkit-outer-spin-button,.full-container .input-container input.plus-minus::-webkit-inner-spin-button{appearance:none;margin:0}.full-container .input-container input.none[type=number],.full-container .input-container input.plus-minus[type=number]{appearance:textfield}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .input-container button{background:transparent;border:none;cursor:pointer;padding:0;margin:0;aspect-ratio:1}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px;min-width:18px;width:18px}.medium{height:36px}.medium>fw-icon{font-size:20px;min-width:20px;width:20px}.large{height:40px}.large>fw-icon{font-size:24px;min-width:24px;width:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}.disabled .actionable:hover{color:var(--typography-light);background-color:transparent}\n"] }]
|
|
75
75
|
}], propDecorators: { disabled: [{
|
|
76
76
|
type: Input
|
|
77
77
|
}], useActionableIcons: [{
|