@flywheel-io/vision 1.3.2 → 1.4.0
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/assets/fonts/Flywheel-Vision-Icons.svg +5 -1
- package/assets/fonts/Flywheel-Vision-Icons.ttf +0 -0
- package/assets/fonts/Flywheel-Vision-Icons.woff +0 -0
- package/assets/svg/browser-internet-web-windows.svg +8 -0
- package/assets/svg/hammer-legal-square.svg +7 -0
- package/components/dialog/dialog-actions.component.d.ts +9 -0
- package/components/dialog/dialog-confirm.component.d.ts +3 -1
- package/components/dialog/dialog-content.component.d.ts +10 -0
- package/components/dialog/dialog-header.component.d.ts +9 -0
- package/components/dialog/dialog-simple.component.d.ts +7 -1
- package/components/dialog/dialog.component.d.ts +3 -20
- package/components/dialog/dialogs.module.d.ts +13 -10
- package/components/icon/icon.component.d.ts +7 -1
- package/components/layouts/layout-group.component.d.ts +3 -1
- package/components/layouts/layouts.module.d.ts +6 -4
- package/components/layouts/panel/panel.component.d.ts +9 -0
- package/components/layouts/sidebar/sidebar.component.d.ts +9 -0
- package/components/layouts/toolbar/toolbar.component.d.ts +3 -1
- package/components/menu/menu-header/menu-header.component.d.ts +1 -1
- package/components/menu/menu-item/menu-item.component.d.ts +2 -1
- package/components/menu/menu-sub-item/menu-sub-item.component.d.ts +1 -1
- package/components/menu/menu.module.d.ts +6 -5
- package/components/select-menu/select-menu.component.d.ts +5 -3
- package/components/text-input/text-input.component.d.ts +9 -1
- package/components/textarea-input/textarea-input.component.d.ts +28 -0
- package/components/textarea-input/textarea-input.module.d.ts +11 -0
- package/esm2020/components/alert/alert.component.mjs +1 -1
- package/esm2020/components/app-icon/app-icon.component.mjs +2 -2
- package/esm2020/components/avatar/avatar.component.mjs +2 -2
- package/esm2020/components/badge/badge.component.mjs +2 -2
- package/esm2020/components/breadcrumbs/crumb.component.mjs +1 -1
- package/esm2020/components/button/button.component.mjs +1 -1
- package/esm2020/components/card/card-attribute/card-attribute.component.mjs +1 -1
- package/esm2020/components/card/card-content/card-content.component.mjs +2 -2
- package/esm2020/components/card/card-header/card-header.component.mjs +2 -2
- package/esm2020/components/card/card.component.mjs +2 -2
- package/esm2020/components/chip/chip.component.mjs +2 -2
- package/esm2020/components/dialog/dialog-actions.component.mjs +32 -0
- package/esm2020/components/dialog/dialog-confirm.component.mjs +11 -4
- package/esm2020/components/dialog/dialog-content.component.mjs +38 -0
- package/esm2020/components/dialog/dialog-header.component.mjs +35 -0
- package/esm2020/components/dialog/dialog-simple.component.mjs +20 -4
- package/esm2020/components/dialog/dialog.component.mjs +9 -76
- package/esm2020/components/dialog/dialog.service.mjs +2 -2
- package/esm2020/components/dialog/dialogs.module.mjs +5 -2
- package/esm2020/components/icon/icon.component.mjs +37 -6
- package/esm2020/components/icon-button/icon-button.component.mjs +1 -1
- package/esm2020/components/layouts/context/context.component.mjs +1 -1
- package/esm2020/components/layouts/grid/grid.component.mjs +4 -4
- package/esm2020/components/layouts/layout-group.component.mjs +13 -4
- package/esm2020/components/layouts/layouts.module.mjs +11 -1
- package/esm2020/components/layouts/panel/panel.component.mjs +26 -0
- package/esm2020/components/layouts/sidebar/sidebar.component.mjs +26 -0
- package/esm2020/components/layouts/toolbar/toolbar.component.mjs +15 -5
- package/esm2020/components/legacy/notification/notification-container/notification-container.component.mjs +1 -1
- package/esm2020/components/menu/menu-container/menu-container.component.mjs +2 -2
- package/esm2020/components/menu/menu-header/menu-header.component.mjs +3 -3
- package/esm2020/components/menu/menu-item/menu-item.component.mjs +6 -3
- package/esm2020/components/menu/menu-sub-item/menu-sub-item.component.mjs +3 -3
- package/esm2020/components/menu/menu.component.mjs +6 -3
- package/esm2020/components/menu/menu.module.mjs +5 -1
- package/esm2020/components/paginator/paginator-advanced/paginator-advanced.component.mjs +1 -1
- package/esm2020/components/paginator/paginator.component.mjs +1 -1
- package/esm2020/components/phone-input/phone-input.component.mjs +2 -2
- package/esm2020/components/popover/popover-panel/popover-panel.component.mjs +2 -2
- package/esm2020/components/section-heading/back-button/back-button.component.mjs +1 -1
- package/esm2020/components/section-heading/section-heading.component.mjs +1 -1
- package/esm2020/components/section-heading/subsection-heading/subsection-heading.component.mjs +1 -1
- package/esm2020/components/select-menu/multi-select-menu/multi-select-menu.component.mjs +1 -1
- package/esm2020/components/select-menu/select-menu.component.mjs +47 -27
- package/esm2020/components/snackbar/snackbar/snackbar.component.mjs +2 -2
- package/esm2020/components/stepper/step.component.mjs +1 -1
- package/esm2020/components/tabs/tab/tab.component.mjs +1 -1
- package/esm2020/components/text-input/text-input.component.mjs +24 -5
- package/esm2020/components/textarea-input/textarea-input.component.mjs +86 -0
- package/esm2020/components/textarea-input/textarea-input.module.mjs +39 -0
- package/esm2020/public-api.mjs +8 -1
- package/fesm2015/flywheel-io-vision.mjs +510 -198
- package/fesm2015/flywheel-io-vision.mjs.map +1 -1
- package/fesm2020/flywheel-io-vision.mjs +510 -198
- package/fesm2020/flywheel-io-vision.mjs.map +1 -1
- package/global.scss +1 -2
- package/package.json +1 -1
- package/public-api.d.ts +7 -0
- package/public-api.scss +1 -0
- package/scss/config/overlay.scss +93 -0
- package/scss/config/shadows.scss +0 -4
- package/scss/config/typography.scss +53 -0
- package/scss/icons/_icon-glyphs.scss +6 -0
- package/styles.css +175 -5
|
@@ -12,7 +12,7 @@ export class FwAlertComponent {
|
|
|
12
12
|
}
|
|
13
13
|
}
|
|
14
14
|
FwAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
-
FwAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAlertComponent, selector: "fw-alert", inputs: { description: "description", icon: "icon", severity: "severity", title: "title", variant: "variant", showClose: "showClose" }, outputs: { close: "close" }, ngImport: i0, template: "<div [ngClass]=\"['alert', variant, severity]\">\n <fw-icon *ngIf=\"icon\" class=\"alert-icon\">{{ icon }}</fw-icon>\n <div class=\"alert-text\">\n <h4 *ngIf=\"title\">{{ title }}</h4>\n <p *ngIf=\"description\">{{ description }}</p>\n <p>\n <ng-content></ng-content>\n </p>\n </div>\n <div *ngIf=\"showClose\" class=\"close-icon\">\n <ng-content select=\"fw-button\"></ng-content>\n <fw-icon-button\n *ngIf=\"showClose\"\n icon=\"close\" size=\"small\"\n [color]=\"variant==='filled'?'overlay':severity\"\n (click)=\"close?close.emit():undefined\">\n </fw-icon-button>\n </div>\n</div>\n", styles: [".alert{border-radius:8px;padding:6px 16px;display:flex;box-sizing:border-box;min-height:48px}.alert .alert-icon{padding:7px 12px 7px 0;align-items:flex-start;font-size:22px}.alert .alert-text{padding:6px 0;flex:1;display:flex;flex-direction:column;justify-items:center}.alert h4{margin:3px 0;color:var(--typography-contrast)}.alert p{margin:3px 0 0;color:inherit;font-size:12px;font-weight:400;line-height:16.8px}.alert .close-icon{display:flex;align-items:flex-start;margin-left:16px;gap:16px;margin-top:4px;height:30px}.alert.standard.info{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.alert.standard.info h4{color:var(--primary-base)}.alert.standard.warning{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.alert.standard.warning h4{color:var(--orange-base)}.alert.standard.success{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.alert.standard.success h4{color:var(--green-base)}.alert.standard.error{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}.alert.standard.error h4{color:var(--red-base)}.alert.outlined.info{color:var(--primary-base);border:1px solid var(--primary-base)}.alert.outlined.info h4{color:var(--primary-base)}.alert.outlined.warning{color:var(--orange-base);border:1px solid var(--orange-base)}.alert.outlined.warning h4{color:var(--orange-base)}.alert.outlined.success{color:var(--green-base);border:1px solid var(--green-base)}.alert.outlined.success h4{color:var(--green-base)}.alert.outlined.error{color:var(--red-base);border:1px solid var(--red-base)}.alert.outlined.error h4{color:var(--red-base)}.alert.filled.info{color:var(--typography-contrast);background-color:var(--primary-base)}.alert.filled.warning{color:var(--typography-contrast);background-color:var(--orange-base)}.alert.filled.success{color:var(--typography-contrast);background-color:var(--green-base)}.alert.filled.error{color:var(--typography-contrast);background-color:var(--red-base)}\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" }, { kind: "component", type: i3.FwIconButtonComponent, selector: "fw-icon-button", inputs: ["color", "icon", "size", "disabled", "selected"] }] });
|
|
15
|
+
FwAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAlertComponent, selector: "fw-alert", inputs: { description: "description", icon: "icon", severity: "severity", title: "title", variant: "variant", showClose: "showClose" }, outputs: { close: "close" }, ngImport: i0, template: "<div [ngClass]=\"['alert', variant, severity]\">\n <fw-icon *ngIf=\"icon\" class=\"alert-icon\">{{ icon }}</fw-icon>\n <div class=\"alert-text\">\n <h4 *ngIf=\"title\">{{ title }}</h4>\n <p *ngIf=\"description\">{{ description }}</p>\n <p>\n <ng-content></ng-content>\n </p>\n </div>\n <div *ngIf=\"showClose\" class=\"close-icon\">\n <ng-content select=\"fw-button\"></ng-content>\n <fw-icon-button\n *ngIf=\"showClose\"\n icon=\"close\" size=\"small\"\n [color]=\"variant==='filled'?'overlay':severity\"\n (click)=\"close?close.emit():undefined\">\n </fw-icon-button>\n </div>\n</div>\n", styles: [".alert{border-radius:8px;padding:6px 16px;display:flex;box-sizing:border-box;min-height:48px}.alert .alert-icon{padding:7px 12px 7px 0;align-items:flex-start;font-size:22px}.alert .alert-text{padding:6px 0;flex:1;display:flex;flex-direction:column;justify-items:center}.alert h4{margin:3px 0;color:var(--typography-contrast)}.alert p{margin:3px 0 0;color:inherit;font-size:12px;font-weight:400;line-height:16.8px}.alert .close-icon{display:flex;align-items:flex-start;margin-left:16px;gap:16px;margin-top:4px;height:30px}.alert.standard.info{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.alert.standard.info h4{color:var(--primary-base)}.alert.standard.warning{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.alert.standard.warning h4{color:var(--orange-base)}.alert.standard.success{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.alert.standard.success h4{color:var(--green-base)}.alert.standard.error{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}.alert.standard.error h4{color:var(--red-base)}.alert.outlined.info{color:var(--primary-base);border:1px solid var(--primary-base)}.alert.outlined.info h4{color:var(--primary-base)}.alert.outlined.warning{color:var(--orange-base);border:1px solid var(--orange-base)}.alert.outlined.warning h4{color:var(--orange-base)}.alert.outlined.success{color:var(--green-base);border:1px solid var(--green-base)}.alert.outlined.success h4{color:var(--green-base)}.alert.outlined.error{color:var(--red-base);border:1px solid var(--red-base)}.alert.outlined.error h4{color:var(--red-base)}.alert.filled.info{color:var(--typography-contrast);background-color:var(--primary-base)}.alert.filled.warning{color:var(--typography-contrast);background-color:var(--orange-base)}.alert.filled.success{color:var(--typography-contrast);background-color:var(--green-base)}.alert.filled.error{color:var(--typography-contrast);background-color:var(--red-base)}\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"] }, { kind: "component", type: i3.FwIconButtonComponent, selector: "fw-icon-button", inputs: ["color", "icon", "size", "disabled", "selected"] }] });
|
|
16
16
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAlertComponent, decorators: [{
|
|
17
17
|
type: Component,
|
|
18
18
|
args: [{ selector: 'fw-alert', template: "<div [ngClass]=\"['alert', variant, severity]\">\n <fw-icon *ngIf=\"icon\" class=\"alert-icon\">{{ icon }}</fw-icon>\n <div class=\"alert-text\">\n <h4 *ngIf=\"title\">{{ title }}</h4>\n <p *ngIf=\"description\">{{ description }}</p>\n <p>\n <ng-content></ng-content>\n </p>\n </div>\n <div *ngIf=\"showClose\" class=\"close-icon\">\n <ng-content select=\"fw-button\"></ng-content>\n <fw-icon-button\n *ngIf=\"showClose\"\n icon=\"close\" size=\"small\"\n [color]=\"variant==='filled'?'overlay':severity\"\n (click)=\"close?close.emit():undefined\">\n </fw-icon-button>\n </div>\n</div>\n", styles: [".alert{border-radius:8px;padding:6px 16px;display:flex;box-sizing:border-box;min-height:48px}.alert .alert-icon{padding:7px 12px 7px 0;align-items:flex-start;font-size:22px}.alert .alert-text{padding:6px 0;flex:1;display:flex;flex-direction:column;justify-items:center}.alert h4{margin:3px 0;color:var(--typography-contrast)}.alert p{margin:3px 0 0;color:inherit;font-size:12px;font-weight:400;line-height:16.8px}.alert .close-icon{display:flex;align-items:flex-start;margin-left:16px;gap:16px;margin-top:4px;height:30px}.alert.standard.info{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.alert.standard.info h4{color:var(--primary-base)}.alert.standard.warning{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.alert.standard.warning h4{color:var(--orange-base)}.alert.standard.success{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.alert.standard.success h4{color:var(--green-base)}.alert.standard.error{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}.alert.standard.error h4{color:var(--red-base)}.alert.outlined.info{color:var(--primary-base);border:1px solid var(--primary-base)}.alert.outlined.info h4{color:var(--primary-base)}.alert.outlined.warning{color:var(--orange-base);border:1px solid var(--orange-base)}.alert.outlined.warning h4{color:var(--orange-base)}.alert.outlined.success{color:var(--green-base);border:1px solid var(--green-base)}.alert.outlined.success h4{color:var(--green-base)}.alert.outlined.error{color:var(--red-base);border:1px solid var(--red-base)}.alert.outlined.error h4{color:var(--red-base)}.alert.filled.info{color:var(--typography-contrast);background-color:var(--primary-base)}.alert.filled.warning{color:var(--typography-contrast);background-color:var(--orange-base)}.alert.filled.success{color:var(--typography-contrast);background-color:var(--green-base)}.alert.filled.error{color:var(--typography-contrast);background-color:var(--red-base)}\n"] }]
|
|
@@ -18,10 +18,10 @@ export class FwAppIconComponent {
|
|
|
18
18
|
}
|
|
19
19
|
}
|
|
20
20
|
FwAppIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAppIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21
|
-
FwAppIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAppIconComponent, selector: "fw-app-icon", inputs: { title: "title", icon: "icon", imageUrl: "imageUrl", color: "color", fontColor: "fontColor", size: "size", variant: "variant", badge: "badge", tabindex: "tabindex", locked: "locked", animated: "animated" }, host: { properties: { "tabindex": "this.tabindex", "class.locked": "this.locked", "class.animated": "this.animated", "role": "this.role", "class": "this.cssClass" } }, ngImport: i0, template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\"><span>{{ badge }}</span></div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <img *ngIf=\"imageUrl\" [src]=\"imageUrl\" alt=\"App Icon\">\n <fw-icon *ngIf=\"icon\" [ngClass]=\"fontColor\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"title\">{{ title }}</p>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium,:host .app-locked{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host .app-badge{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}
|
|
21
|
+
FwAppIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAppIconComponent, selector: "fw-app-icon", inputs: { title: "title", icon: "icon", imageUrl: "imageUrl", color: "color", fontColor: "fontColor", size: "size", variant: "variant", badge: "badge", tabindex: "tabindex", locked: "locked", animated: "animated" }, host: { properties: { "tabindex": "this.tabindex", "class.locked": "this.locked", "class.animated": "this.animated", "role": "this.role", "class": "this.cssClass" } }, ngImport: i0, template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\"><span>{{ badge }}</span></div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <img *ngIf=\"imageUrl\" [src]=\"imageUrl\" alt=\"App Icon\">\n <fw-icon *ngIf=\"icon\" [ngClass]=\"fontColor\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"title\">{{ title }}</p>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium,:host .app-locked{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host .app-badge{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin:6px}:host p{margin:0;line-height:16.8px;-webkit-user-select:none;user-select:none;display:inline-block;color:var(--typography-muted);text-align:center}:host .app-badge{min-width:18px;height:18px;border-radius:64px;background:var(--red-base);font-family:Inter,sans-serif;font-size:10px;font-weight:500;line-height:180%;letter-spacing:0;text-align:center;color:var(--typography-contrast);display:inline-flex;align-items:flex-start;justify-content:center;position:absolute;top:-8px;right:-8px;padding:0 6px;box-sizing:border-box;overflow:hidden;white-space:nowrap}:host .app-locked{width:21px;height:21px;border-radius:64px;background:var(--slate-base);font-size:15px;color:var(--typography-contrast);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap}:host.primary .icon-wrapper{background-color:var(--primary-base)}:host.primary .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.primary .icon-wrapper>fw-icon.base{color:var(--typography-base)}:host.primary .icon-wrapper>fw-icon.transparent{color:transparent}:host.dark .icon-wrapper{background-color:var(--primary-dark)}:host.dark .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.dark .icon-wrapper>fw-icon.base{color:var(--typography-base)}:host.gradient .icon-wrapper{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%)}:host.gradient .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.gradient .icon-wrapper>fw-icon.base{color:var(--typography-base)}:host.light .icon-wrapper{background-color:var(--page-light);outline:1px solid var(--separations-base)}:host.light .icon-wrapper>fw-icon{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%);background-clip:text;-webkit-text-fill-color:transparent}:host.transparent .icon-wrapper{background-color:transparent;outline:1px solid transparent}:host.small .icon-highlight{border-radius:12px;width:24px;height:24px}:host.small .icon-wrapper{display:inline-flex;width:24px;height:24px;border-radius:6px;align-items:center;justify-content:center}:host.small .icon-wrapper>fw-icon{font-size:16px}:host.small .icon-wrapper img{height:24px;width:24px}:host.small .app-badge{min-width:8px;padding:0;width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px}:host.medium .icon-highlight{border-radius:14px;width:32px;height:32px}:host.medium .icon-wrapper{display:inline-flex;width:32px;height:32px;border-radius:8px;align-items:center;justify-content:center}:host.medium .icon-wrapper>fw-icon{font-size:20px}:host.medium .icon-wrapper img{height:32px;width:32px}:host.medium .app-badge{min-width:8px;padding:0;width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px}:host.large .icon-highlight{border-radius:18px;width:48px;height:48px}:host.large .icon-wrapper{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center}:host.large .icon-wrapper>fw-icon{font-size:32px}:host.large .icon-wrapper img{height:48px;width:48px}:host.extra-large .icon-highlight{border-radius:22px;width:64px;height:64px}:host.extra-large .icon-wrapper{display:inline-flex;width:64px;height:64px;border-radius:16px;align-items:center;justify-content:center}:host.extra-large .icon-wrapper>fw-icon{font-size:48px}:host.extra-large .icon-wrapper img{height:64px;width:64px}:host.extra-large p{max-width:64px}:host.interactive .icon-highlight{border:4px solid transparent}:host.hover .icon-highlight,:host:hover .icon-highlight{border:4px solid var(--primary-border)}@keyframes rubber-band{0%{transform:scale(.95)}20%{transform:scale(1.05)}32%{transform:scale(.95)}48%{transform:scale(1)}}:host.animated.hover .icon-highlight,:host.animated:hover .icon-highlight{animation:rubber-band .5s linear forwards;border:4px solid var(--primary-border)}:host.focused .icon-highlight,:host:focus .icon-highlight,:host.animated:focus .icon-highlight{border:4px solid var(--primary-base)}:host.focused p,:host:focus p,:host.animated:focus p{color:var(--typography-base)}:host.static .icon-highlight,:host.static:hover .icon-highlight,:host.static.animated:hover .icon-highlight{border:4px solid transparent}:host.locked{pointer-events:none}\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"] }] });
|
|
22
22
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAppIconComponent, decorators: [{
|
|
23
23
|
type: Component,
|
|
24
|
-
args: [{ selector: 'fw-app-icon', template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\"><span>{{ badge }}</span></div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <img *ngIf=\"imageUrl\" [src]=\"imageUrl\" alt=\"App Icon\">\n <fw-icon *ngIf=\"icon\" [ngClass]=\"fontColor\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"title\">{{ title }}</p>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium,:host .app-locked{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host .app-badge{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}
|
|
24
|
+
args: [{ selector: 'fw-app-icon', template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\"><span>{{ badge }}</span></div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <img *ngIf=\"imageUrl\" [src]=\"imageUrl\" alt=\"App Icon\">\n <fw-icon *ngIf=\"icon\" [ngClass]=\"fontColor\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"title\">{{ title }}</p>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium,:host .app-locked{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host .app-badge{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin:6px}:host p{margin:0;line-height:16.8px;-webkit-user-select:none;user-select:none;display:inline-block;color:var(--typography-muted);text-align:center}:host .app-badge{min-width:18px;height:18px;border-radius:64px;background:var(--red-base);font-family:Inter,sans-serif;font-size:10px;font-weight:500;line-height:180%;letter-spacing:0;text-align:center;color:var(--typography-contrast);display:inline-flex;align-items:flex-start;justify-content:center;position:absolute;top:-8px;right:-8px;padding:0 6px;box-sizing:border-box;overflow:hidden;white-space:nowrap}:host .app-locked{width:21px;height:21px;border-radius:64px;background:var(--slate-base);font-size:15px;color:var(--typography-contrast);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap}:host.primary .icon-wrapper{background-color:var(--primary-base)}:host.primary .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.primary .icon-wrapper>fw-icon.base{color:var(--typography-base)}:host.primary .icon-wrapper>fw-icon.transparent{color:transparent}:host.dark .icon-wrapper{background-color:var(--primary-dark)}:host.dark .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.dark .icon-wrapper>fw-icon.base{color:var(--typography-base)}:host.gradient .icon-wrapper{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%)}:host.gradient .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.gradient .icon-wrapper>fw-icon.base{color:var(--typography-base)}:host.light .icon-wrapper{background-color:var(--page-light);outline:1px solid var(--separations-base)}:host.light .icon-wrapper>fw-icon{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%);background-clip:text;-webkit-text-fill-color:transparent}:host.transparent .icon-wrapper{background-color:transparent;outline:1px solid transparent}:host.small .icon-highlight{border-radius:12px;width:24px;height:24px}:host.small .icon-wrapper{display:inline-flex;width:24px;height:24px;border-radius:6px;align-items:center;justify-content:center}:host.small .icon-wrapper>fw-icon{font-size:16px}:host.small .icon-wrapper img{height:24px;width:24px}:host.small .app-badge{min-width:8px;padding:0;width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px}:host.medium .icon-highlight{border-radius:14px;width:32px;height:32px}:host.medium .icon-wrapper{display:inline-flex;width:32px;height:32px;border-radius:8px;align-items:center;justify-content:center}:host.medium .icon-wrapper>fw-icon{font-size:20px}:host.medium .icon-wrapper img{height:32px;width:32px}:host.medium .app-badge{min-width:8px;padding:0;width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px}:host.large .icon-highlight{border-radius:18px;width:48px;height:48px}:host.large .icon-wrapper{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center}:host.large .icon-wrapper>fw-icon{font-size:32px}:host.large .icon-wrapper img{height:48px;width:48px}:host.extra-large .icon-highlight{border-radius:22px;width:64px;height:64px}:host.extra-large .icon-wrapper{display:inline-flex;width:64px;height:64px;border-radius:16px;align-items:center;justify-content:center}:host.extra-large .icon-wrapper>fw-icon{font-size:48px}:host.extra-large .icon-wrapper img{height:64px;width:64px}:host.extra-large p{max-width:64px}:host.interactive .icon-highlight{border:4px solid transparent}:host.hover .icon-highlight,:host:hover .icon-highlight{border:4px solid var(--primary-border)}@keyframes rubber-band{0%{transform:scale(.95)}20%{transform:scale(1.05)}32%{transform:scale(.95)}48%{transform:scale(1)}}:host.animated.hover .icon-highlight,:host.animated:hover .icon-highlight{animation:rubber-band .5s linear forwards;border:4px solid var(--primary-border)}:host.focused .icon-highlight,:host:focus .icon-highlight,:host.animated:focus .icon-highlight{border:4px solid var(--primary-base)}:host.focused p,:host:focus p,:host.animated:focus p{color:var(--typography-base)}:host.static .icon-highlight,:host.static:hover .icon-highlight,:host.static.animated:hover .icon-highlight{border:4px solid transparent}:host.locked{pointer-events:none}\n"] }]
|
|
25
25
|
}], propDecorators: { title: [{
|
|
26
26
|
type: Input
|
|
27
27
|
}], icon: [{
|
|
@@ -26,10 +26,10 @@ export class FwAvatarComponent {
|
|
|
26
26
|
}
|
|
27
27
|
}
|
|
28
28
|
FwAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
-
FwAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAvatarComponent, selector: "fw-avatar", inputs: { color: "color", variant: "variant", content: "content", size: "size", initial: "initial", imageUrl: "imageUrl", imageAltText: "imageAltText", icon: "icon" }, host: { properties: { "attr.class": "this.classes" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"content\">\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"['avatar', 'avatar-' + color]\">\n <img\n *ngIf=\"!isImageBroken else displayInitial\"\n [src]=\"imageUrl\"\n [alt]=\"imageAltText\"\n (load)=\"loadImage()\"\n (error)=\"errorImage()\">\n </div>\n <div *ngSwitchCase=\"'icon'\" [ngClass]=\"['avatar', 'avatar-' +color]\">\n <ng-container *ngTemplateOutlet=\"displayIcon\"></ng-container>\n </div>\n <div *ngSwitchCase=\"'initial'\" [ngClass]=\"['avatar','avatar-' + color]\">\n <ng-container *ngTemplateOutlet=\"displayInitial\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #displayInitial>\n <span class=\"initial\" *ngIf=\"initial else displayIcon\">{{ initial }}</span>\n</ng-template>\n\n<ng-template #displayIcon>\n <fw-icon>{{ icon }}</fw-icon>\n</ng-template>\n", styles: [":host{display:block}:host .avatar{display:flex;flex-direction:row;justify-content:center;align-items:center;width:inherit;height:inherit;border-radius:inherit;font-size:inherit}:host .avatar fw-icon{color:var(--typography-contrast);font-size:inherit}:host .avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}:host .avatar .initial{font-family:Inter,sans-serif;font-style:normal;font-weight:500;color:var(--typography-contrast);font-size:inherit}:host.small{width:16px;height:16px;font-size:8px}:host.small .avatar fw-icon{font-size:12px}:host.medium{width:32px;height:32px;font-size:14px}:host.medium .avatar fw-icon{font-size:18px}:host.large{width:40px;height:40px;font-size:14px}:host.large .avatar fw-icon{font-size:24px}:host.x-large{width:108px;height:108px;font-size:36px}:host.x-large .avatar fw-icon{font-size:64px}:host.rounded{border-radius:12px}:host.circular{border-radius:64px}.avatar-primary{background:var(--primary-base)}.avatar-slate{background:var(--slate-medium)}.avatar-red{background:var(--red-base)}.avatar-light-slate{background:var(--slate-light)}.avatar-secondary{background:var(--secondary-base)}.avatar-warning{background:var(--orange-base)}.avatar-success{background:var(--green-base)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon" }] });
|
|
29
|
+
FwAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAvatarComponent, selector: "fw-avatar", inputs: { color: "color", variant: "variant", content: "content", size: "size", initial: "initial", imageUrl: "imageUrl", imageAltText: "imageAltText", icon: "icon" }, host: { properties: { "attr.class": "this.classes" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"content\">\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"['avatar', 'avatar-' + color]\">\n <img\n *ngIf=\"!isImageBroken else displayInitial\"\n [src]=\"imageUrl\"\n [alt]=\"imageAltText\"\n (load)=\"loadImage()\"\n (error)=\"errorImage()\">\n </div>\n <div *ngSwitchCase=\"'icon'\" [ngClass]=\"['avatar', 'avatar-' +color]\">\n <ng-container *ngTemplateOutlet=\"displayIcon\"></ng-container>\n </div>\n <div *ngSwitchCase=\"'initial'\" [ngClass]=\"['avatar','avatar-' + color]\">\n <ng-container *ngTemplateOutlet=\"displayInitial\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #displayInitial>\n <span class=\"initial\" *ngIf=\"initial else displayIcon\">{{ initial }}</span>\n</ng-template>\n\n<ng-template #displayIcon>\n <fw-icon>{{ icon }}</fw-icon>\n</ng-template>\n", styles: [":host{display:block}:host .avatar{display:flex;flex-direction:row;justify-content:center;align-items:center;width:inherit;height:inherit;border-radius:inherit;font-size:inherit}:host .avatar fw-icon{color:var(--typography-contrast);font-size:inherit}:host .avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}:host .avatar .initial{font-family:Inter,sans-serif;font-style:normal;font-weight:500;color:var(--typography-contrast);font-size:inherit}:host.small{width:16px;height:16px;font-size:8px}:host.small .avatar fw-icon{font-size:12px}:host.medium{width:32px;height:32px;font-size:14px}:host.medium .avatar fw-icon{font-size:18px}:host.large{width:40px;height:40px;font-size:14px}:host.large .avatar fw-icon{font-size:24px}:host.x-large{width:108px;height:108px;font-size:36px}:host.x-large .avatar fw-icon{font-size:64px}:host.rounded.small{border-radius:4px}:host.rounded.medium{border-radius:8px}:host.rounded.large{border-radius:12px}:host.rounded.x-large{border-radius:16px}:host.circular{border-radius:64px}.avatar-primary{background:var(--primary-base)}.avatar-slate{background:var(--slate-medium)}.avatar-red{background:var(--red-base)}.avatar-light-slate{background:var(--slate-light)}.avatar-secondary{background:var(--secondary-base)}.avatar-warning{background:var(--orange-base)}.avatar-success{background:var(--green-base)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] });
|
|
30
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAvatarComponent, decorators: [{
|
|
31
31
|
type: Component,
|
|
32
|
-
args: [{ selector: 'fw-avatar', template: "<ng-container [ngSwitch]=\"content\">\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"['avatar', 'avatar-' + color]\">\n <img\n *ngIf=\"!isImageBroken else displayInitial\"\n [src]=\"imageUrl\"\n [alt]=\"imageAltText\"\n (load)=\"loadImage()\"\n (error)=\"errorImage()\">\n </div>\n <div *ngSwitchCase=\"'icon'\" [ngClass]=\"['avatar', 'avatar-' +color]\">\n <ng-container *ngTemplateOutlet=\"displayIcon\"></ng-container>\n </div>\n <div *ngSwitchCase=\"'initial'\" [ngClass]=\"['avatar','avatar-' + color]\">\n <ng-container *ngTemplateOutlet=\"displayInitial\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #displayInitial>\n <span class=\"initial\" *ngIf=\"initial else displayIcon\">{{ initial }}</span>\n</ng-template>\n\n<ng-template #displayIcon>\n <fw-icon>{{ icon }}</fw-icon>\n</ng-template>\n", styles: [":host{display:block}:host .avatar{display:flex;flex-direction:row;justify-content:center;align-items:center;width:inherit;height:inherit;border-radius:inherit;font-size:inherit}:host .avatar fw-icon{color:var(--typography-contrast);font-size:inherit}:host .avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}:host .avatar .initial{font-family:Inter,sans-serif;font-style:normal;font-weight:500;color:var(--typography-contrast);font-size:inherit}:host.small{width:16px;height:16px;font-size:8px}:host.small .avatar fw-icon{font-size:12px}:host.medium{width:32px;height:32px;font-size:14px}:host.medium .avatar fw-icon{font-size:18px}:host.large{width:40px;height:40px;font-size:14px}:host.large .avatar fw-icon{font-size:24px}:host.x-large{width:108px;height:108px;font-size:36px}:host.x-large .avatar fw-icon{font-size:64px}:host.rounded{border-radius:12px}:host.circular{border-radius:64px}.avatar-primary{background:var(--primary-base)}.avatar-slate{background:var(--slate-medium)}.avatar-red{background:var(--red-base)}.avatar-light-slate{background:var(--slate-light)}.avatar-secondary{background:var(--secondary-base)}.avatar-warning{background:var(--orange-base)}.avatar-success{background:var(--green-base)}\n"] }]
|
|
32
|
+
args: [{ selector: 'fw-avatar', template: "<ng-container [ngSwitch]=\"content\">\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"['avatar', 'avatar-' + color]\">\n <img\n *ngIf=\"!isImageBroken else displayInitial\"\n [src]=\"imageUrl\"\n [alt]=\"imageAltText\"\n (load)=\"loadImage()\"\n (error)=\"errorImage()\">\n </div>\n <div *ngSwitchCase=\"'icon'\" [ngClass]=\"['avatar', 'avatar-' +color]\">\n <ng-container *ngTemplateOutlet=\"displayIcon\"></ng-container>\n </div>\n <div *ngSwitchCase=\"'initial'\" [ngClass]=\"['avatar','avatar-' + color]\">\n <ng-container *ngTemplateOutlet=\"displayInitial\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #displayInitial>\n <span class=\"initial\" *ngIf=\"initial else displayIcon\">{{ initial }}</span>\n</ng-template>\n\n<ng-template #displayIcon>\n <fw-icon>{{ icon }}</fw-icon>\n</ng-template>\n", styles: [":host{display:block}:host .avatar{display:flex;flex-direction:row;justify-content:center;align-items:center;width:inherit;height:inherit;border-radius:inherit;font-size:inherit}:host .avatar fw-icon{color:var(--typography-contrast);font-size:inherit}:host .avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}:host .avatar .initial{font-family:Inter,sans-serif;font-style:normal;font-weight:500;color:var(--typography-contrast);font-size:inherit}:host.small{width:16px;height:16px;font-size:8px}:host.small .avatar fw-icon{font-size:12px}:host.medium{width:32px;height:32px;font-size:14px}:host.medium .avatar fw-icon{font-size:18px}:host.large{width:40px;height:40px;font-size:14px}:host.large .avatar fw-icon{font-size:24px}:host.x-large{width:108px;height:108px;font-size:36px}:host.x-large .avatar fw-icon{font-size:64px}:host.rounded.small{border-radius:4px}:host.rounded.medium{border-radius:8px}:host.rounded.large{border-radius:12px}:host.rounded.x-large{border-radius:16px}:host.circular{border-radius:64px}.avatar-primary{background:var(--primary-base)}.avatar-slate{background:var(--slate-medium)}.avatar-red{background:var(--red-base)}.avatar-light-slate{background:var(--slate-light)}.avatar-secondary{background:var(--secondary-base)}.avatar-warning{background:var(--orange-base)}.avatar-success{background:var(--green-base)}\n"] }]
|
|
33
33
|
}], propDecorators: { classes: [{
|
|
34
34
|
type: HostBinding,
|
|
35
35
|
args: ['attr.class']
|
|
@@ -24,10 +24,10 @@ export class FwBadgeComponent {
|
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
FwBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
27
|
-
FwBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwBadgeComponent, selector: "fw-badge", inputs: { color: "color", variant: "variant", value: "value", hideZero: "hideZero", hideEmpty: "hideEmpty" }, host: { properties: { "class": "this.cssClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n<div class=\"badge-content vision-p4\" *ngIf=\"showBadge()\">\n {{ value }}\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host.standard .badge-content,:host.static .badge-content{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}
|
|
27
|
+
FwBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwBadgeComponent, selector: "fw-badge", inputs: { color: "color", variant: "variant", value: "value", hideZero: "hideZero", hideEmpty: "hideEmpty" }, host: { properties: { "class": "this.cssClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n<div class=\"badge-content vision-p4\" *ngIf=\"showBadge()\">\n {{ value }}\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host.standard .badge-content,:host.static .badge-content{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{position:relative;display:inline-flex;width:-moz-fit-content;width:fit-content}:host .badge-content{z-index:99;position:absolute;display:flex;align-items:center;justify-content:center;font-weight:500;color:var(--typography-contrast);overflow:hidden;box-sizing:border-box}:host.dot .badge-content{width:8px;height:8px;border-radius:8px;content-visibility:hidden;right:-3px;top:-3px}:host.standard .badge-content{padding:6px;min-width:22px;height:22px;border-radius:64px;right:-11px;top:-11px}:host.static{align-items:center}:host.static .badge-content{padding:6px;min-width:22px;height:22px;border-radius:64px;position:relative}:host.default .badge-content{background:var(--slate-light);color:var(--typography-base)}:host.primary .badge-content{background:var(--primary-base)}:host.secondary .badge-content{background:var(--secondary-base)}:host.error .badge-content{background:var(--red-base)}:host.warning .badge-content{background:var(--orange-base)}:host.success .badge-content{background:var(--green-base)}:host.slate .badge-content{background:var(--slate-base)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
28
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwBadgeComponent, decorators: [{
|
|
29
29
|
type: Component,
|
|
30
|
-
args: [{ selector: 'fw-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n<div class=\"badge-content vision-p4\" *ngIf=\"showBadge()\">\n {{ value }}\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host.standard .badge-content,:host.static .badge-content{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}
|
|
30
|
+
args: [{ selector: 'fw-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n<div class=\"badge-content vision-p4\" *ngIf=\"showBadge()\">\n {{ value }}\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large{box-shadow:0 5px 15px #0000001a}.vision-shadow-medium{box-shadow:0 2px 5px #0000001a}.vision-shadow-small,:host.standard .badge-content,:host.static .badge-content{box-shadow:0 1px 2px #0000000d}.vision-shadow-inner{box-shadow:0 2px 4px #00000014 inset}:host{position:relative;display:inline-flex;width:-moz-fit-content;width:fit-content}:host .badge-content{z-index:99;position:absolute;display:flex;align-items:center;justify-content:center;font-weight:500;color:var(--typography-contrast);overflow:hidden;box-sizing:border-box}:host.dot .badge-content{width:8px;height:8px;border-radius:8px;content-visibility:hidden;right:-3px;top:-3px}:host.standard .badge-content{padding:6px;min-width:22px;height:22px;border-radius:64px;right:-11px;top:-11px}:host.static{align-items:center}:host.static .badge-content{padding:6px;min-width:22px;height:22px;border-radius:64px;position:relative}:host.default .badge-content{background:var(--slate-light);color:var(--typography-base)}:host.primary .badge-content{background:var(--primary-base)}:host.secondary .badge-content{background:var(--secondary-base)}:host.error .badge-content{background:var(--red-base)}:host.warning .badge-content{background:var(--orange-base)}:host.success .badge-content{background:var(--green-base)}:host.slate .badge-content{background:var(--slate-base)}\n"] }]
|
|
31
31
|
}], propDecorators: { color: [{
|
|
32
32
|
type: Input
|
|
33
33
|
}], variant: [{
|
|
@@ -16,7 +16,7 @@ export class FwCrumbComponent {
|
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
18
|
FwCrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
19
|
-
FwCrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCrumbComponent, selector: "fw-crumb", inputs: { title: "title", description: "description", href: "href", last: "last" }, outputs: { click: "click" }, ngImport: i0, template: "<div (click)=\"handleClick($event)\">\n <h3>{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<fw-icon *ngIf=\"!last\">chevron-forward</fw-icon>\n", styles: [":host{display:flex;align-items:center}:host>div{cursor:pointer}:host h3{margin:0;color:var(--typography-base)}:host p{margin:0;color:var(--typography-muted)}:host fw-icon{font-size:20px;margin:0 10px;color:var(--typography-light)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon" }] });
|
|
19
|
+
FwCrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCrumbComponent, selector: "fw-crumb", inputs: { title: "title", description: "description", href: "href", last: "last" }, outputs: { click: "click" }, ngImport: i0, template: "<div (click)=\"handleClick($event)\">\n <h3>{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<fw-icon *ngIf=\"!last\">chevron-forward</fw-icon>\n", styles: [":host{display:flex;align-items:center}:host>div{cursor:pointer}:host h3{margin:0;color:var(--typography-base)}:host p{margin:0;color:var(--typography-muted)}:host fw-icon{font-size:20px;margin:0 10px;color:var(--typography-light)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] });
|
|
20
20
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCrumbComponent, decorators: [{
|
|
21
21
|
type: Component,
|
|
22
22
|
args: [{ selector: 'fw-crumb', template: "<div (click)=\"handleClick($event)\">\n <h3>{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<fw-icon *ngIf=\"!last\">chevron-forward</fw-icon>\n", styles: [":host{display:flex;align-items:center}:host>div{cursor:pointer}:host h3{margin:0;color:var(--typography-base)}:host p{margin:0;color:var(--typography-muted)}:host fw-icon{font-size:20px;margin:0 10px;color:var(--typography-light)}\n"] }]
|
|
@@ -17,7 +17,7 @@ export class FwButtonComponent {
|
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
FwButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
20
|
-
FwButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwButtonComponent, selector: "fw-button", inputs: { color: "color", size: "size", variant: "variant", disabled: "disabled", fullWidth: "fullWidth", leftIcon: "leftIcon", rightIcon: "rightIcon" }, host: { properties: { "attr.class": "this.classes" } }, ngImport: i0, template: "<button [class]=\"[color + '-' + variant, size]\" [disabled]=\"disabled\">\n <fw-icon *ngIf=\"!!leftIcon\">{{ leftIcon }}</fw-icon>\n <div class=\"spacer\" *ngIf=\"!leftIcon\"></div>\n <span><ng-content></ng-content></span>\n <fw-icon *ngIf=\"!!rightIcon\">{{ rightIcon }}</fw-icon>\n</button>\n", styles: [":host.full-width{flex:1;display:flex}:host.full-width button{flex:1}button{cursor:pointer;font-family:Inter,sans-serif;font-size:14px;line-height:14px;font-style:normal;font-weight:500;display:inline-flex;height:36px;padding:12px;justify-content:center;align-items:center;gap:8px;flex-shrink:0;border:1px solid transparent;border-radius:8px}button .spacer{height:18px;width:0;margin-left:-8px}button fw-icon{height:18px;font-size:20px}button:disabled{opacity:.4;cursor:not-allowed}.large{font-size:16px;height:40px;padding:12px 14px}.large fw-icon{font-size:24px}.small{height:30px;padding:12px 10px}.primary-solid{background-color:var(--primary-base);color:var(--typography-contrast)}.primary-solid:hover{background-color:var(--primary-medium)}.primary-solid:active{background-color:var(--primary-dark)}.primary-ghost{background-color:transparent;color:var(--primary-base)}.primary-ghost:hover{background-color:var(--primary-hover)}.primary-ghost:active{background-color:var(--primary-focus)}.primary-outline{background-color:transparent;color:var(--primary-base);border:1px solid var(--separations-base)}.primary-outline:hover{background-color:var(--primary-hover)}.primary-outline:active{background-color:var(--primary-focus)}.secondary-solid{background-color:var(--secondary-base);color:var(--typography-contrast)}.secondary-solid:hover{background-color:var(--secondary-medium)}.secondary-solid:active{background-color:var(--secondary-dark)}.secondary-ghost{background-color:transparent;color:var(--secondary-base)}.secondary-ghost:hover{background-color:var(--secondary-hover)}.secondary-ghost:active{background-color:var(--secondary-focus)}.secondary-outline{background-color:transparent;color:var(--secondary-base);border:1px solid var(--separations-base)}.secondary-outline:hover{background-color:var(--secondary-hover)}.secondary-outline:active{background-color:var(--secondary-focus)}.slate-solid{background-color:var(--slate-base);color:var(--typography-contrast)}.slate-solid:hover{background-color:var(--slate-medium)}.slate-solid:active{background-color:var(--slate-dark)}.slate-ghost{background-color:transparent;color:var(--slate-base)}.slate-ghost:hover{background-color:var(--slate-hover)}.slate-ghost:active{background-color:var(--slate-focus)}.slate-outline{background-color:transparent;color:var(--slate-base);border:1px solid var(--separations-base)}.slate-outline:hover{background-color:var(--slate-hover)}.slate-outline:active{background-color:var(--slate-focus)}.danger-solid{background-color:var(--red-base);color:var(--typography-contrast)}.danger-solid:hover{background-color:var(--red-medium)}.danger-solid:active{background-color:var(--red-dark)}.danger-ghost{background-color:transparent;color:var(--red-base)}.danger-ghost:hover{background-color:var(--red-hover)}.danger-ghost:active{background-color:var(--red-focus)}.danger-outline{background-color:transparent;color:var(--red-base);border:1px solid var(--separations-base)}.danger-outline:hover{background-color:var(--red-hover)}.danger-outline:active{background-color:var(--red-focus)}.skeleton-solid{background-color:var(---base);color:var(--typography-contrast)}.skeleton-solid:hover{background-color:var(---medium)}.skeleton-solid:active{background-color:var(---dark)}.skeleton-ghost{background-color:transparent;color:var(---base)}.skeleton-ghost:hover{background-color:var(---hover)}.skeleton-ghost:active{background-color:var(---focus)}.skeleton-outline{background-color:transparent;color:var(---base);border:1px solid var(--separations-base)}.skeleton-outline:hover{background-color:var(---hover)}.skeleton-outline:active{background-color:var(---focus)}.warning-solid{background-color:var(--orange-base);color:var(--typography-contrast)}.warning-solid:hover{background-color:var(--orange-medium)}.warning-solid:active{background-color:var(--orange-dark)}.warning-ghost{background-color:transparent;color:var(--orange-base)}.warning-ghost:hover{background-color:var(--orange-hover)}.warning-ghost:active{background-color:var(--orange-focus)}.warning-outline{background-color:transparent;color:var(--orange-base);border:1px solid var(--separations-base)}.warning-outline:hover{background-color:var(--orange-hover)}.warning-outline:active{background-color:var(--orange-focus)}.success-solid{background-color:var(--green-base);color:var(--typography-contrast)}.success-solid:hover{background-color:var(--green-medium)}.success-solid:active{background-color:var(--green-dark)}.success-ghost{background-color:transparent;color:var(--green-base)}.success-ghost:hover{background-color:var(--green-hover)}.success-ghost:active{background-color:var(--green-focus)}.success-outline{background-color:transparent;color:var(--green-base);border:1px solid var(--separations-base)}.success-outline:hover{background-color:var(--green-hover)}.success-outline:active{background-color:var(--green-focus)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon" }] });
|
|
20
|
+
FwButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwButtonComponent, selector: "fw-button", inputs: { color: "color", size: "size", variant: "variant", disabled: "disabled", fullWidth: "fullWidth", leftIcon: "leftIcon", rightIcon: "rightIcon" }, host: { properties: { "attr.class": "this.classes" } }, ngImport: i0, template: "<button [class]=\"[color + '-' + variant, size]\" [disabled]=\"disabled\">\n <fw-icon *ngIf=\"!!leftIcon\">{{ leftIcon }}</fw-icon>\n <div class=\"spacer\" *ngIf=\"!leftIcon\"></div>\n <span><ng-content></ng-content></span>\n <fw-icon *ngIf=\"!!rightIcon\">{{ rightIcon }}</fw-icon>\n</button>\n", styles: [":host.full-width{flex:1;display:flex}:host.full-width button{flex:1}button{cursor:pointer;font-family:Inter,sans-serif;font-size:14px;line-height:14px;font-style:normal;font-weight:500;display:inline-flex;height:36px;padding:12px;justify-content:center;align-items:center;gap:8px;flex-shrink:0;border:1px solid transparent;border-radius:8px}button .spacer{height:18px;width:0;margin-left:-8px}button fw-icon{height:18px;font-size:20px}button:disabled{opacity:.4;cursor:not-allowed}.large{font-size:16px;height:40px;padding:12px 14px}.large fw-icon{font-size:24px}.small{height:30px;padding:12px 10px}.primary-solid{background-color:var(--primary-base);color:var(--typography-contrast)}.primary-solid:hover{background-color:var(--primary-medium)}.primary-solid:active{background-color:var(--primary-dark)}.primary-ghost{background-color:transparent;color:var(--primary-base)}.primary-ghost:hover{background-color:var(--primary-hover)}.primary-ghost:active{background-color:var(--primary-focus)}.primary-outline{background-color:transparent;color:var(--primary-base);border:1px solid var(--separations-base)}.primary-outline:hover{background-color:var(--primary-hover)}.primary-outline:active{background-color:var(--primary-focus)}.secondary-solid{background-color:var(--secondary-base);color:var(--typography-contrast)}.secondary-solid:hover{background-color:var(--secondary-medium)}.secondary-solid:active{background-color:var(--secondary-dark)}.secondary-ghost{background-color:transparent;color:var(--secondary-base)}.secondary-ghost:hover{background-color:var(--secondary-hover)}.secondary-ghost:active{background-color:var(--secondary-focus)}.secondary-outline{background-color:transparent;color:var(--secondary-base);border:1px solid var(--separations-base)}.secondary-outline:hover{background-color:var(--secondary-hover)}.secondary-outline:active{background-color:var(--secondary-focus)}.slate-solid{background-color:var(--slate-base);color:var(--typography-contrast)}.slate-solid:hover{background-color:var(--slate-medium)}.slate-solid:active{background-color:var(--slate-dark)}.slate-ghost{background-color:transparent;color:var(--slate-base)}.slate-ghost:hover{background-color:var(--slate-hover)}.slate-ghost:active{background-color:var(--slate-focus)}.slate-outline{background-color:transparent;color:var(--slate-base);border:1px solid var(--separations-base)}.slate-outline:hover{background-color:var(--slate-hover)}.slate-outline:active{background-color:var(--slate-focus)}.danger-solid{background-color:var(--red-base);color:var(--typography-contrast)}.danger-solid:hover{background-color:var(--red-medium)}.danger-solid:active{background-color:var(--red-dark)}.danger-ghost{background-color:transparent;color:var(--red-base)}.danger-ghost:hover{background-color:var(--red-hover)}.danger-ghost:active{background-color:var(--red-focus)}.danger-outline{background-color:transparent;color:var(--red-base);border:1px solid var(--separations-base)}.danger-outline:hover{background-color:var(--red-hover)}.danger-outline:active{background-color:var(--red-focus)}.skeleton-solid{background-color:var(---base);color:var(--typography-contrast)}.skeleton-solid:hover{background-color:var(---medium)}.skeleton-solid:active{background-color:var(---dark)}.skeleton-ghost{background-color:transparent;color:var(---base)}.skeleton-ghost:hover{background-color:var(---hover)}.skeleton-ghost:active{background-color:var(---focus)}.skeleton-outline{background-color:transparent;color:var(---base);border:1px solid var(--separations-base)}.skeleton-outline:hover{background-color:var(---hover)}.skeleton-outline:active{background-color:var(---focus)}.warning-solid{background-color:var(--orange-base);color:var(--typography-contrast)}.warning-solid:hover{background-color:var(--orange-medium)}.warning-solid:active{background-color:var(--orange-dark)}.warning-ghost{background-color:transparent;color:var(--orange-base)}.warning-ghost:hover{background-color:var(--orange-hover)}.warning-ghost:active{background-color:var(--orange-focus)}.warning-outline{background-color:transparent;color:var(--orange-base);border:1px solid var(--separations-base)}.warning-outline:hover{background-color:var(--orange-hover)}.warning-outline:active{background-color:var(--orange-focus)}.success-solid{background-color:var(--green-base);color:var(--typography-contrast)}.success-solid:hover{background-color:var(--green-medium)}.success-solid:active{background-color:var(--green-dark)}.success-ghost{background-color:transparent;color:var(--green-base)}.success-ghost:hover{background-color:var(--green-hover)}.success-ghost:active{background-color:var(--green-focus)}.success-outline{background-color:transparent;color:var(--green-base);border:1px solid var(--separations-base)}.success-outline:hover{background-color:var(--green-hover)}.success-outline:active{background-color:var(--green-focus)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] });
|
|
21
21
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwButtonComponent, decorators: [{
|
|
22
22
|
type: Component,
|
|
23
23
|
args: [{ selector: 'fw-button', template: "<button [class]=\"[color + '-' + variant, size]\" [disabled]=\"disabled\">\n <fw-icon *ngIf=\"!!leftIcon\">{{ leftIcon }}</fw-icon>\n <div class=\"spacer\" *ngIf=\"!leftIcon\"></div>\n <span><ng-content></ng-content></span>\n <fw-icon *ngIf=\"!!rightIcon\">{{ rightIcon }}</fw-icon>\n</button>\n", styles: [":host.full-width{flex:1;display:flex}:host.full-width button{flex:1}button{cursor:pointer;font-family:Inter,sans-serif;font-size:14px;line-height:14px;font-style:normal;font-weight:500;display:inline-flex;height:36px;padding:12px;justify-content:center;align-items:center;gap:8px;flex-shrink:0;border:1px solid transparent;border-radius:8px}button .spacer{height:18px;width:0;margin-left:-8px}button fw-icon{height:18px;font-size:20px}button:disabled{opacity:.4;cursor:not-allowed}.large{font-size:16px;height:40px;padding:12px 14px}.large fw-icon{font-size:24px}.small{height:30px;padding:12px 10px}.primary-solid{background-color:var(--primary-base);color:var(--typography-contrast)}.primary-solid:hover{background-color:var(--primary-medium)}.primary-solid:active{background-color:var(--primary-dark)}.primary-ghost{background-color:transparent;color:var(--primary-base)}.primary-ghost:hover{background-color:var(--primary-hover)}.primary-ghost:active{background-color:var(--primary-focus)}.primary-outline{background-color:transparent;color:var(--primary-base);border:1px solid var(--separations-base)}.primary-outline:hover{background-color:var(--primary-hover)}.primary-outline:active{background-color:var(--primary-focus)}.secondary-solid{background-color:var(--secondary-base);color:var(--typography-contrast)}.secondary-solid:hover{background-color:var(--secondary-medium)}.secondary-solid:active{background-color:var(--secondary-dark)}.secondary-ghost{background-color:transparent;color:var(--secondary-base)}.secondary-ghost:hover{background-color:var(--secondary-hover)}.secondary-ghost:active{background-color:var(--secondary-focus)}.secondary-outline{background-color:transparent;color:var(--secondary-base);border:1px solid var(--separations-base)}.secondary-outline:hover{background-color:var(--secondary-hover)}.secondary-outline:active{background-color:var(--secondary-focus)}.slate-solid{background-color:var(--slate-base);color:var(--typography-contrast)}.slate-solid:hover{background-color:var(--slate-medium)}.slate-solid:active{background-color:var(--slate-dark)}.slate-ghost{background-color:transparent;color:var(--slate-base)}.slate-ghost:hover{background-color:var(--slate-hover)}.slate-ghost:active{background-color:var(--slate-focus)}.slate-outline{background-color:transparent;color:var(--slate-base);border:1px solid var(--separations-base)}.slate-outline:hover{background-color:var(--slate-hover)}.slate-outline:active{background-color:var(--slate-focus)}.danger-solid{background-color:var(--red-base);color:var(--typography-contrast)}.danger-solid:hover{background-color:var(--red-medium)}.danger-solid:active{background-color:var(--red-dark)}.danger-ghost{background-color:transparent;color:var(--red-base)}.danger-ghost:hover{background-color:var(--red-hover)}.danger-ghost:active{background-color:var(--red-focus)}.danger-outline{background-color:transparent;color:var(--red-base);border:1px solid var(--separations-base)}.danger-outline:hover{background-color:var(--red-hover)}.danger-outline:active{background-color:var(--red-focus)}.skeleton-solid{background-color:var(---base);color:var(--typography-contrast)}.skeleton-solid:hover{background-color:var(---medium)}.skeleton-solid:active{background-color:var(---dark)}.skeleton-ghost{background-color:transparent;color:var(---base)}.skeleton-ghost:hover{background-color:var(---hover)}.skeleton-ghost:active{background-color:var(---focus)}.skeleton-outline{background-color:transparent;color:var(---base);border:1px solid var(--separations-base)}.skeleton-outline:hover{background-color:var(---hover)}.skeleton-outline:active{background-color:var(---focus)}.warning-solid{background-color:var(--orange-base);color:var(--typography-contrast)}.warning-solid:hover{background-color:var(--orange-medium)}.warning-solid:active{background-color:var(--orange-dark)}.warning-ghost{background-color:transparent;color:var(--orange-base)}.warning-ghost:hover{background-color:var(--orange-hover)}.warning-ghost:active{background-color:var(--orange-focus)}.warning-outline{background-color:transparent;color:var(--orange-base);border:1px solid var(--separations-base)}.warning-outline:hover{background-color:var(--orange-hover)}.warning-outline:active{background-color:var(--orange-focus)}.success-solid{background-color:var(--green-base);color:var(--typography-contrast)}.success-solid:hover{background-color:var(--green-medium)}.success-solid:active{background-color:var(--green-dark)}.success-ghost{background-color:transparent;color:var(--green-base)}.success-ghost:hover{background-color:var(--green-hover)}.success-ghost:active{background-color:var(--green-focus)}.success-outline{background-color:transparent;color:var(--green-base);border:1px solid var(--separations-base)}.success-outline:hover{background-color:var(--green-hover)}.success-outline:active{background-color:var(--green-focus)}\n"] }]
|
|
@@ -5,7 +5,7 @@ import * as i2 from "../../icon/icon.component";
|
|
|
5
5
|
export class FwCardAttributeComponent {
|
|
6
6
|
}
|
|
7
7
|
FwCardAttributeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardAttributeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8
|
-
FwCardAttributeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardAttributeComponent, selector: "fw-card-attr", inputs: { icon: "icon", title: "title" }, ngImport: i0, template: "<fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n<h5 *ngIf=\"title\">{{ title }}</h5>\n<ng-content></ng-content>\n", styles: [":host{display:flex;align-items:center;font-size:12px;font-style:normal;font-weight:500;line-height:120%;color:var(--typography-base)}:host fw-icon{color:var(--primary-base);font-size:18px;margin-right:4px}:host h5{margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon" }] });
|
|
8
|
+
FwCardAttributeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardAttributeComponent, selector: "fw-card-attr", inputs: { icon: "icon", title: "title" }, ngImport: i0, template: "<fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n<h5 *ngIf=\"title\">{{ title }}</h5>\n<ng-content></ng-content>\n", styles: [":host{display:flex;align-items:center;font-size:12px;font-style:normal;font-weight:500;line-height:120%;color:var(--typography-base)}:host fw-icon{color:var(--primary-base);font-size:18px;margin-right:4px}:host h5{margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] });
|
|
9
9
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardAttributeComponent, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
11
|
args: [{ selector: 'fw-card-attr', template: "<fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n<h5 *ngIf=\"title\">{{ title }}</h5>\n<ng-content></ng-content>\n", styles: [":host{display:flex;align-items:center;font-size:12px;font-style:normal;font-weight:500;line-height:120%;color:var(--typography-base)}:host fw-icon{color:var(--primary-base);font-size:18px;margin-right:4px}:host h5{margin:0}\n"] }]
|
|
@@ -3,9 +3,9 @@ import * as i0 from "@angular/core";
|
|
|
3
3
|
export class FwCardContentComponent {
|
|
4
4
|
}
|
|
5
5
|
FwCardContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6
|
-
FwCardContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardContentComponent, selector: "fw-card-content", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, 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,:host p{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}:host{overflow:hidden}:host h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}:host h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}:host h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}:host h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}:host h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}:host p{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}:host p{margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow-y:hidden;text-overflow:ellipsis;line-height:140%;color:var(--typography-muted)}:host img{max-width:100%;margin:auto;border-radius:4px;border:1px solid var(--separations-base, #1e3154)}\n"], encapsulation: i0.ViewEncapsulation.ShadowDom });
|
|
6
|
+
FwCardContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardContentComponent, selector: "fw-card-content", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, 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,:host p{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)}:host{overflow:hidden}:host h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}:host h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}:host h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}:host h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}:host h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}:host p{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}:host a{text-decoration:underline;color:var(--primary-base);cursor:pointer}:host a:hover{text-decoration:none}:host a:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}:host a:visited{color:var(--secondary-base)}:host p{margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow-y:hidden;text-overflow:ellipsis;line-height:140%;color:var(--typography-muted)}:host img{max-width:100%;margin:auto;border-radius:4px;border:1px solid var(--separations-base, #1e3154)}\n"], encapsulation: i0.ViewEncapsulation.ShadowDom });
|
|
7
7
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardContentComponent, decorators: [{
|
|
8
8
|
type: Component,
|
|
9
|
-
args: [{ selector: 'fw-card-content', template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.ShadowDom, 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,:host p{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}:host{overflow:hidden}:host h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}:host h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}:host h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}:host h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}:host h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}:host p{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}:host p{margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow-y:hidden;text-overflow:ellipsis;line-height:140%;color:var(--typography-muted)}:host img{max-width:100%;margin:auto;border-radius:4px;border:1px solid var(--separations-base, #1e3154)}\n"] }]
|
|
9
|
+
args: [{ selector: 'fw-card-content', template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.ShadowDom, 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,:host p{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)}:host{overflow:hidden}:host h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}:host h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}:host h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}:host h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}:host h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}:host p{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}:host a{text-decoration:underline;color:var(--primary-base);cursor:pointer}:host a:hover{text-decoration:none}:host a:active{text-decoration:none;outline:2px solid var(--primary-dark);border-radius:4px}:host a:visited{color:var(--secondary-base)}:host p{margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow-y:hidden;text-overflow:ellipsis;line-height:140%;color:var(--typography-muted)}:host img{max-width:100%;margin:auto;border-radius:4px;border:1px solid var(--separations-base, #1e3154)}\n"] }]
|
|
10
10
|
}] });
|
|
11
11
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FyZC1jb250ZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2NhcmQvY2FyZC1jb250ZW50L2NhcmQtY29udGVudC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFRN0QsTUFBTSxPQUFPLHNCQUFzQjs7bUhBQXRCLHNCQUFzQjt1R0FBdEIsc0JBQXNCLHVEQUp2QiwyQkFBMkI7MkZBSTFCLHNCQUFzQjtrQkFObEMsU0FBUzsrQkFDRSxpQkFBaUIsWUFDakIsMkJBQTJCLGlCQUV0QixpQkFBaUIsQ0FBQyxTQUFTIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmdy1jYXJkLWNvbnRlbnQnLFxuICB0ZW1wbGF0ZTogJzxuZy1jb250ZW50PjwvbmctY29udGVudD4nLFxuICBzdHlsZVVybHM6IFsnLi9jYXJkLWNvbnRlbnQuY29tcG9uZW50LnNjc3MnXSxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uU2hhZG93RG9tLFxufSlcbmV4cG9ydCBjbGFzcyBGd0NhcmRDb250ZW50Q29tcG9uZW50IHtcblxufVxuIl19
|
|
@@ -5,10 +5,10 @@ import * as i2 from "../../icon/icon.component";
|
|
|
5
5
|
export class FwCardHeaderComponent {
|
|
6
6
|
}
|
|
7
7
|
FwCardHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8
|
-
FwCardHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardHeaderComponent, selector: "fw-card-header", inputs: { title: "title", description: "description", leftIcon: "leftIcon" }, ngImport: i0, template: "<ng-content select=\"fw-app-icon\"></ng-content>\n<fw-icon *ngIf=\"leftIcon\">{{ leftIcon }}</fw-icon>\n<div class=\"card-header-title\">\n <h3 *ngIf=\"title\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<div class=\"card-header-key\">\n <ng-content></ng-content>\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,:host .card-header-key{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}:host{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:8px}:host fw-icon{color:var(--primary-base);font-size:22px}:host .card-header-title{flex:1}:host .card-header-title h3{flex:1;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-y:hidden;text-overflow:ellipsis}:host .card-header-title p{color:var(--typography-muted);margin:0}:host .card-header-key{display:flex;align-items:flex-start;color:var(--typography-muted);gap:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon" }] });
|
|
8
|
+
FwCardHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardHeaderComponent, selector: "fw-card-header", inputs: { title: "title", description: "description", leftIcon: "leftIcon" }, ngImport: i0, template: "<ng-content select=\"fw-app-icon\"></ng-content>\n<fw-icon *ngIf=\"leftIcon\">{{ leftIcon }}</fw-icon>\n<div class=\"card-header-title\">\n <h3 *ngIf=\"title\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<div class=\"card-header-key\">\n <ng-content></ng-content>\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,:host .card-header-key{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)}:host{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:8px}:host fw-icon{color:var(--primary-base);font-size:22px}:host .card-header-title{flex:1}:host .card-header-title h3{flex:1;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-y:hidden;text-overflow:ellipsis}:host .card-header-title p{color:var(--typography-muted);margin:0}:host .card-header-key{display:flex;align-items:flex-start;color:var(--typography-muted);gap:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }] });
|
|
9
9
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardHeaderComponent, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
|
-
args: [{ selector: 'fw-card-header', template: "<ng-content select=\"fw-app-icon\"></ng-content>\n<fw-icon *ngIf=\"leftIcon\">{{ leftIcon }}</fw-icon>\n<div class=\"card-header-title\">\n <h3 *ngIf=\"title\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<div class=\"card-header-key\">\n <ng-content></ng-content>\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,:host .card-header-key{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}:host{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:8px}:host fw-icon{color:var(--primary-base);font-size:22px}:host .card-header-title{flex:1}:host .card-header-title h3{flex:1;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-y:hidden;text-overflow:ellipsis}:host .card-header-title p{color:var(--typography-muted);margin:0}:host .card-header-key{display:flex;align-items:flex-start;color:var(--typography-muted);gap:8px}\n"] }]
|
|
11
|
+
args: [{ selector: 'fw-card-header', template: "<ng-content select=\"fw-app-icon\"></ng-content>\n<fw-icon *ngIf=\"leftIcon\">{{ leftIcon }}</fw-icon>\n<div class=\"card-header-title\">\n <h3 *ngIf=\"title\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"vision-p3\">{{ description }}</p>\n</div>\n<div class=\"card-header-key\">\n <ng-content></ng-content>\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,:host .card-header-key{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)}:host{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:8px}:host fw-icon{color:var(--primary-base);font-size:22px}:host .card-header-title{flex:1}:host .card-header-title h3{flex:1;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-y:hidden;text-overflow:ellipsis}:host .card-header-title p{color:var(--typography-muted);margin:0}:host .card-header-key{display:flex;align-items:flex-start;color:var(--typography-muted);gap:8px}\n"] }]
|
|
12
12
|
}], propDecorators: { title: [{
|
|
13
13
|
type: Input
|
|
14
14
|
}], description: [{
|
|
@@ -7,10 +7,10 @@ export class FwCardComponent {
|
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
FwCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10
|
-
FwCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardComponent, selector: "fw-card", inputs: { value: "value", disabled: "disabled", focused: "focused", constrained: "constrained", selectable: "selectable" }, outputs: { select: "select" }, ngImport: i0, template: "<div\n class=\"fw-card\"\n [class.focused]=\"focused\"\n [class.constrained]=\"constrained\"\n [class.selectable]=\"selectable\"\n [class.disabled]=\"disabled\"\n (click)=\"select && selectable && !disabled ? select.emit(value) : undefined\">\n <ng-content select=\"fw-card-header\"></ng-content>\n <ng-content select=\"fw-card-author\"></ng-content>\n <ng-content select=\"fw-card-content\"></ng-content>\n <ng-content select=\"fw-card-footer\"></ng-content>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,.fw-card.focused,.fw-card.selectable:hover:not(.disabled){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}.
|
|
10
|
+
FwCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwCardComponent, selector: "fw-card", inputs: { value: "value", disabled: "disabled", focused: "focused", constrained: "constrained", selectable: "selectable" }, outputs: { select: "select" }, ngImport: i0, template: "<div\n class=\"fw-card\"\n [class.focused]=\"focused\"\n [class.constrained]=\"constrained\"\n [class.selectable]=\"selectable\"\n [class.disabled]=\"disabled\"\n (click)=\"select && selectable && !disabled ? select.emit(value) : undefined\">\n <ng-content select=\"fw-card-header\"></ng-content>\n <ng-content select=\"fw-card-author\"></ng-content>\n <ng-content select=\"fw-card-content\"></ng-content>\n <ng-content select=\"fw-card-footer\"></ng-content>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,.fw-card.focused,.fw-card.selectable:hover:not(.disabled){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-card{display:flex;padding:16px;flex-direction:column;align-items:flex-start;gap:16px;flex:1 0 0;align-self:stretch;border-radius:8px;border:1px solid var(--separations-base, #e3e6ea);background:var(--card-background, #ffffff)}.fw-card.focused{border:1px solid var(--primary-border, rgba(27, 105, 250, .4));background:var(--primary-hover, rgba(27, 105, 250, .05))}.fw-card.constrained{max-width:320px;max-height:320px}.fw-card.selectable{cursor:pointer}.fw-card.selectable:hover:not(.disabled){border:1px solid var(--primary-border, rgba(27, 105, 250, .4));background:var(--primary-hover, rgba(27, 105, 250, .05))}.fw-card.disabled{opacity:.4;cursor:not-allowed}\n"] });
|
|
11
11
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwCardComponent, decorators: [{
|
|
12
12
|
type: Component,
|
|
13
|
-
args: [{ selector: 'fw-card', template: "<div\n class=\"fw-card\"\n [class.focused]=\"focused\"\n [class.constrained]=\"constrained\"\n [class.selectable]=\"selectable\"\n [class.disabled]=\"disabled\"\n (click)=\"select && selectable && !disabled ? select.emit(value) : undefined\">\n <ng-content select=\"fw-card-header\"></ng-content>\n <ng-content select=\"fw-card-author\"></ng-content>\n <ng-content select=\"fw-card-content\"></ng-content>\n <ng-content select=\"fw-card-footer\"></ng-content>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,.fw-card.focused,.fw-card.selectable:hover:not(.disabled){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}.
|
|
13
|
+
args: [{ selector: 'fw-card', template: "<div\n class=\"fw-card\"\n [class.focused]=\"focused\"\n [class.constrained]=\"constrained\"\n [class.selectable]=\"selectable\"\n [class.disabled]=\"disabled\"\n (click)=\"select && selectable && !disabled ? select.emit(value) : undefined\">\n <ng-content select=\"fw-card-header\"></ng-content>\n <ng-content select=\"fw-card-author\"></ng-content>\n <ng-content select=\"fw-card-content\"></ng-content>\n <ng-content select=\"fw-card-footer\"></ng-content>\n</div>\n", styles: [".vision-shadow-extra-large{box-shadow:0 8px 25px #0000001a}.vision-shadow-large,.fw-card.focused,.fw-card.selectable:hover:not(.disabled){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-card{display:flex;padding:16px;flex-direction:column;align-items:flex-start;gap:16px;flex:1 0 0;align-self:stretch;border-radius:8px;border:1px solid var(--separations-base, #e3e6ea);background:var(--card-background, #ffffff)}.fw-card.focused{border:1px solid var(--primary-border, rgba(27, 105, 250, .4));background:var(--primary-hover, rgba(27, 105, 250, .05))}.fw-card.constrained{max-width:320px;max-height:320px}.fw-card.selectable{cursor:pointer}.fw-card.selectable:hover:not(.disabled){border:1px solid var(--primary-border, rgba(27, 105, 250, .4));background:var(--primary-hover, rgba(27, 105, 250, .05))}.fw-card.disabled{opacity:.4;cursor:not-allowed}\n"] }]
|
|
14
14
|
}], propDecorators: { value: [{
|
|
15
15
|
type: Input
|
|
16
16
|
}], disabled: [{
|
|
@@ -20,10 +20,10 @@ export class FwChipComponent {
|
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
FwChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
23
|
-
FwChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwChipComponent, selector: "fw-chip", inputs: { value: "value", variant: "variant", color: "color", icon: "icon", title: "title", description: "description", showClose: "showClose", disabled: "disabled", selected: "selected", selectable: "selectable" }, outputs: { close: "close", select: "select" }, ngImport: i0, template: "<div [ngClass]=\"['chip', variant, 'chip-'+color]\" [class.disabled]=\"disabled\" [class.focused]=\"selected\"\n [class.selectable]=\"selectable\" (click)=\"selectable ? select.emit(value) : undefined\">\n <fw-icon *ngIf=\"icon\" class=\"chip-icon\">{{ icon }}</fw-icon>\n <ng-content select=\"fw-avatar\"></ng-content>\n <div class=\"chip-text\" *ngIf=\"title\">\n <span>{{ title }}</span>\n <span *ngIf=\"description\" class=\"description\">{{ description }}</span>\n </div>\n <fw-icon class=\"close-icon\" *ngIf=\"showClose\" (click)=\"handleClose($event)\">\n close\n </fw-icon>\n</div>\n", styles: [":host{min-height:24px;display:inline-flex}.chip{box-sizing:border-box;border-radius:16px;padding:2px 4px;display:inline-flex;min-height:24px;align-items:center;font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:600;line-height:16px}.chip .chip-icon{align-items:flex-start;font-size:16px}.chip .chip-text{display:flex;align-items:center;margin:0 6px;min-height:16px;white-space:wrap}.chip .chip-text .description{margin-left:4px;font-weight:400;color:var(--typography-light)}.chip .close-icon{font-size:12px;font-weight:700;cursor:pointer;border-width:1px;border-style:solid;border-radius:16px;width:12px;height:12px;display:inline-flex;align-items:center;justify-content:center}.chip .close-icon:hover{color:var(--typography-contrast);border-radius:16px}.chip.selectable{cursor:pointer}.chip.enabled.chip-slate{color:var(--slate-base);border:1px solid var(--slate-border)}.chip.enabled.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.enabled.chip-primary{color:var(--primary-base);border:1px solid var(--primary-border)}.chip.enabled.chip-primary .close-icon{border-color:var(--primary-base)}.chip.enabled.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.enabled.chip-secondary{color:var(--secondary-base);border:1px solid var(--secondary-border)}.chip.enabled.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.enabled.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.enabled.chip-orange{color:var(--orange-base);border:1px solid var(--orange-border)}.chip.enabled.chip-orange .close-icon{border-color:var(--orange-base)}.chip.enabled.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.enabled.chip-green{color:var(--green-base);border:1px solid var(--green-border)}.chip.enabled.chip-green .close-icon{border-color:var(--green-base)}.chip.enabled.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.enabled.chip-red{color:var(--red-base);border:1px solid var(--red-border)}.chip.enabled.chip-red .close-icon{border-color:var(--red-base)}.chip.enabled.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.hovered.chip-slate,.chip.selectable:not(.focused):hover.chip-slate{color:var(--slate-base)!important;background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.hovered.chip-slate .close-icon:hover,.chip.selectable:not(.focused):hover.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.hovered.chip-primary,.chip.selectable:not(.focused):hover.chip-primary{color:var(--primary-base)!important;background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.hovered.chip-primary .close-icon,.chip.selectable:not(.focused):hover.chip-primary .close-icon{border-color:var(--primary-base)}.chip.hovered.chip-primary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.hovered.chip-secondary,.chip.selectable:not(.focused):hover.chip-secondary{color:var(--secondary-base)!important;background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.hovered.chip-secondary .close-icon,.chip.selectable:not(.focused):hover.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.hovered.chip-secondary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.hovered.chip-orange,.chip.selectable:not(.focused):hover.chip-orange{color:var(--orange-base)!important;background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.hovered.chip-orange .close-icon,.chip.selectable:not(.focused):hover.chip-orange .close-icon{border-color:var(--orange-base)}.chip.hovered.chip-orange .close-icon:hover,.chip.selectable:not(.focused):hover.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.hovered.chip-green,.chip.selectable:not(.focused):hover.chip-green{color:var(--green-base)!important;background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.hovered.chip-green .close-icon,.chip.selectable:not(.focused):hover.chip-green .close-icon{border-color:var(--green-base)}.chip.hovered.chip-green .close-icon:hover,.chip.selectable:not(.focused):hover.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.hovered.chip-red,.chip.selectable:not(.focused):hover.chip-red{color:var(--red-base)!important;background-color:var(--red-hover);border:1px solid var(--red-border)}.chip.hovered.chip-red .close-icon,.chip.selectable:not(.focused):hover.chip-red .close-icon{border-color:var(--red-base)}.chip.hovered.chip-red .close-icon:hover,.chip.selectable:not(.focused):hover.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.focused{color:var(--typography-contrast)!important}.chip.focused .close-icon{border-color:var(--typography-contrast)}.chip.focused .close-icon:hover{background-color:var(--typography-contrast);border-radius:16px}.chip.focused.chip-slate{background-color:var(--slate-focus);color:var(--typography-base)!important}.chip.focused.chip-slate .close-icon{border-color:var(--typography-base)}.chip.focused.chip-slate .close-icon:hover{color:var(--slate-base)}.chip.focused.chip-primary{background-color:var(--primary-base)}.chip.focused.chip-primary .close-icon:hover{color:var(--primary-base)}.chip.focused.chip-secondary{background-color:var(--secondary-base)}.chip.focused.chip-secondary .close-icon:hover{color:var(--secondary-base)}.chip.focused.chip-orange{background-color:var(--orange-base)}.chip.focused.chip-orange .close-icon:hover{color:var(--orange-base)}.chip.focused.chip-green{background-color:var(--green-base)}.chip.focused.chip-green .close-icon:hover{color:var(--green-base)}.chip.focused.chip-red{background-color:var(--red-base)}.chip.focused.chip-red .close-icon:hover{color:var(--red-base)}.chip.disabled{opacity:38%}.chip.disabled .close-icon{cursor:not-allowed;color:inherit}.chip.disabled .close-icon:hover{background-color:transparent!important}.chip.disabled.chip-slate{color:var(--slate-base);background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.disabled.chip-primary{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.disabled.chip-secondary{color:var(--secondary-base);background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.disabled.chip-orange{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.disabled.chip-green{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.disabled.chip-red{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}\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" }] });
|
|
23
|
+
FwChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwChipComponent, selector: "fw-chip", inputs: { value: "value", variant: "variant", color: "color", icon: "icon", title: "title", description: "description", showClose: "showClose", disabled: "disabled", selected: "selected", selectable: "selectable" }, outputs: { close: "close", select: "select" }, ngImport: i0, template: "<div [ngClass]=\"['chip', variant, 'chip-'+color]\" [class.disabled]=\"disabled\" [class.focused]=\"selected\"\n [class.selectable]=\"selectable\" (click)=\"selectable ? select.emit(value) : undefined\">\n <fw-icon *ngIf=\"icon\" class=\"chip-icon\">{{ icon }}</fw-icon>\n <ng-content select=\"fw-avatar\"></ng-content>\n <div class=\"chip-text\" *ngIf=\"title\">\n <span>{{ title }}</span>\n <span *ngIf=\"description\" class=\"description\">{{ description }}</span>\n </div>\n <fw-icon class=\"close-icon\" *ngIf=\"showClose\" (click)=\"handleClose($event)\">\n close\n </fw-icon>\n</div>\n", styles: [":host{min-height:24px;display:inline-flex}.chip{box-sizing:border-box;border-radius:16px;padding:2px 4px;display:inline-flex;min-height:24px;align-items:center;font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:600;line-height:16px}.chip .chip-icon{align-items:flex-start;font-size:16px}.chip .chip-text{display:flex;align-items:center;margin:0 6px;min-height:16px;white-space:wrap}.chip .chip-text .description{margin-left:4px;font-weight:400;color:var(--typography-light)}.chip .close-icon{font-size:12px;font-weight:700;cursor:pointer;border-width:1px;border-style:solid;border-radius:16px;width:12px;height:12px;display:inline-flex;align-items:center;justify-content:center}.chip .close-icon:hover{color:var(--typography-contrast);border-radius:16px}.chip:not(.selectable){cursor:default}.chip.selectable{cursor:pointer}.chip.enabled.chip-slate{color:var(--slate-base);border:1px solid var(--slate-border)}.chip.enabled.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.enabled.chip-primary{color:var(--primary-base);border:1px solid var(--primary-border)}.chip.enabled.chip-primary .close-icon{border-color:var(--primary-base)}.chip.enabled.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.enabled.chip-secondary{color:var(--secondary-base);border:1px solid var(--secondary-border)}.chip.enabled.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.enabled.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.enabled.chip-orange{color:var(--orange-base);border:1px solid var(--orange-border)}.chip.enabled.chip-orange .close-icon{border-color:var(--orange-base)}.chip.enabled.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.enabled.chip-green{color:var(--green-base);border:1px solid var(--green-border)}.chip.enabled.chip-green .close-icon{border-color:var(--green-base)}.chip.enabled.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.enabled.chip-red{color:var(--red-base);border:1px solid var(--red-border)}.chip.enabled.chip-red .close-icon{border-color:var(--red-base)}.chip.enabled.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.hovered.chip-slate,.chip.selectable:not(.focused):hover.chip-slate{color:var(--slate-base)!important;background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.hovered.chip-slate .close-icon:hover,.chip.selectable:not(.focused):hover.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.hovered.chip-primary,.chip.selectable:not(.focused):hover.chip-primary{color:var(--primary-base)!important;background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.hovered.chip-primary .close-icon,.chip.selectable:not(.focused):hover.chip-primary .close-icon{border-color:var(--primary-base)}.chip.hovered.chip-primary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.hovered.chip-secondary,.chip.selectable:not(.focused):hover.chip-secondary{color:var(--secondary-base)!important;background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.hovered.chip-secondary .close-icon,.chip.selectable:not(.focused):hover.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.hovered.chip-secondary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.hovered.chip-orange,.chip.selectable:not(.focused):hover.chip-orange{color:var(--orange-base)!important;background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.hovered.chip-orange .close-icon,.chip.selectable:not(.focused):hover.chip-orange .close-icon{border-color:var(--orange-base)}.chip.hovered.chip-orange .close-icon:hover,.chip.selectable:not(.focused):hover.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.hovered.chip-green,.chip.selectable:not(.focused):hover.chip-green{color:var(--green-base)!important;background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.hovered.chip-green .close-icon,.chip.selectable:not(.focused):hover.chip-green .close-icon{border-color:var(--green-base)}.chip.hovered.chip-green .close-icon:hover,.chip.selectable:not(.focused):hover.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.hovered.chip-red,.chip.selectable:not(.focused):hover.chip-red{color:var(--red-base)!important;background-color:var(--red-hover);border:1px solid var(--red-border)}.chip.hovered.chip-red .close-icon,.chip.selectable:not(.focused):hover.chip-red .close-icon{border-color:var(--red-base)}.chip.hovered.chip-red .close-icon:hover,.chip.selectable:not(.focused):hover.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.focused{color:var(--typography-contrast)!important}.chip.focused .close-icon{border-color:var(--typography-contrast)}.chip.focused .close-icon:hover{background-color:var(--typography-contrast);border-radius:16px}.chip.focused.chip-slate{background-color:var(--slate-focus);color:var(--typography-base)!important}.chip.focused.chip-slate .close-icon{border-color:var(--typography-base)}.chip.focused.chip-slate .close-icon:hover{color:var(--slate-base)}.chip.focused.chip-primary{background-color:var(--primary-base)}.chip.focused.chip-primary .close-icon:hover{color:var(--primary-base)}.chip.focused.chip-secondary{background-color:var(--secondary-base)}.chip.focused.chip-secondary .close-icon:hover{color:var(--secondary-base)}.chip.focused.chip-orange{background-color:var(--orange-base)}.chip.focused.chip-orange .close-icon:hover{color:var(--orange-base)}.chip.focused.chip-green{background-color:var(--green-base)}.chip.focused.chip-green .close-icon:hover{color:var(--green-base)}.chip.focused.chip-red{background-color:var(--red-base)}.chip.focused.chip-red .close-icon:hover{color:var(--red-base)}.chip.disabled{opacity:38%}.chip.disabled .close-icon{cursor:not-allowed;color:inherit}.chip.disabled .close-icon:hover{background-color:transparent!important}.chip.disabled.chip-slate{color:var(--slate-base);background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.disabled.chip-primary{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.disabled.chip-secondary{color:var(--secondary-base);background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.disabled.chip-orange{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.disabled.chip-green{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.disabled.chip-red{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}\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"] }] });
|
|
24
24
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwChipComponent, decorators: [{
|
|
25
25
|
type: Component,
|
|
26
|
-
args: [{ selector: 'fw-chip', template: "<div [ngClass]=\"['chip', variant, 'chip-'+color]\" [class.disabled]=\"disabled\" [class.focused]=\"selected\"\n [class.selectable]=\"selectable\" (click)=\"selectable ? select.emit(value) : undefined\">\n <fw-icon *ngIf=\"icon\" class=\"chip-icon\">{{ icon }}</fw-icon>\n <ng-content select=\"fw-avatar\"></ng-content>\n <div class=\"chip-text\" *ngIf=\"title\">\n <span>{{ title }}</span>\n <span *ngIf=\"description\" class=\"description\">{{ description }}</span>\n </div>\n <fw-icon class=\"close-icon\" *ngIf=\"showClose\" (click)=\"handleClose($event)\">\n close\n </fw-icon>\n</div>\n", styles: [":host{min-height:24px;display:inline-flex}.chip{box-sizing:border-box;border-radius:16px;padding:2px 4px;display:inline-flex;min-height:24px;align-items:center;font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:600;line-height:16px}.chip .chip-icon{align-items:flex-start;font-size:16px}.chip .chip-text{display:flex;align-items:center;margin:0 6px;min-height:16px;white-space:wrap}.chip .chip-text .description{margin-left:4px;font-weight:400;color:var(--typography-light)}.chip .close-icon{font-size:12px;font-weight:700;cursor:pointer;border-width:1px;border-style:solid;border-radius:16px;width:12px;height:12px;display:inline-flex;align-items:center;justify-content:center}.chip .close-icon:hover{color:var(--typography-contrast);border-radius:16px}.chip.selectable{cursor:pointer}.chip.enabled.chip-slate{color:var(--slate-base);border:1px solid var(--slate-border)}.chip.enabled.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.enabled.chip-primary{color:var(--primary-base);border:1px solid var(--primary-border)}.chip.enabled.chip-primary .close-icon{border-color:var(--primary-base)}.chip.enabled.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.enabled.chip-secondary{color:var(--secondary-base);border:1px solid var(--secondary-border)}.chip.enabled.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.enabled.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.enabled.chip-orange{color:var(--orange-base);border:1px solid var(--orange-border)}.chip.enabled.chip-orange .close-icon{border-color:var(--orange-base)}.chip.enabled.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.enabled.chip-green{color:var(--green-base);border:1px solid var(--green-border)}.chip.enabled.chip-green .close-icon{border-color:var(--green-base)}.chip.enabled.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.enabled.chip-red{color:var(--red-base);border:1px solid var(--red-border)}.chip.enabled.chip-red .close-icon{border-color:var(--red-base)}.chip.enabled.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.hovered.chip-slate,.chip.selectable:not(.focused):hover.chip-slate{color:var(--slate-base)!important;background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.hovered.chip-slate .close-icon:hover,.chip.selectable:not(.focused):hover.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.hovered.chip-primary,.chip.selectable:not(.focused):hover.chip-primary{color:var(--primary-base)!important;background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.hovered.chip-primary .close-icon,.chip.selectable:not(.focused):hover.chip-primary .close-icon{border-color:var(--primary-base)}.chip.hovered.chip-primary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.hovered.chip-secondary,.chip.selectable:not(.focused):hover.chip-secondary{color:var(--secondary-base)!important;background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.hovered.chip-secondary .close-icon,.chip.selectable:not(.focused):hover.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.hovered.chip-secondary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.hovered.chip-orange,.chip.selectable:not(.focused):hover.chip-orange{color:var(--orange-base)!important;background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.hovered.chip-orange .close-icon,.chip.selectable:not(.focused):hover.chip-orange .close-icon{border-color:var(--orange-base)}.chip.hovered.chip-orange .close-icon:hover,.chip.selectable:not(.focused):hover.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.hovered.chip-green,.chip.selectable:not(.focused):hover.chip-green{color:var(--green-base)!important;background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.hovered.chip-green .close-icon,.chip.selectable:not(.focused):hover.chip-green .close-icon{border-color:var(--green-base)}.chip.hovered.chip-green .close-icon:hover,.chip.selectable:not(.focused):hover.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.hovered.chip-red,.chip.selectable:not(.focused):hover.chip-red{color:var(--red-base)!important;background-color:var(--red-hover);border:1px solid var(--red-border)}.chip.hovered.chip-red .close-icon,.chip.selectable:not(.focused):hover.chip-red .close-icon{border-color:var(--red-base)}.chip.hovered.chip-red .close-icon:hover,.chip.selectable:not(.focused):hover.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.focused{color:var(--typography-contrast)!important}.chip.focused .close-icon{border-color:var(--typography-contrast)}.chip.focused .close-icon:hover{background-color:var(--typography-contrast);border-radius:16px}.chip.focused.chip-slate{background-color:var(--slate-focus);color:var(--typography-base)!important}.chip.focused.chip-slate .close-icon{border-color:var(--typography-base)}.chip.focused.chip-slate .close-icon:hover{color:var(--slate-base)}.chip.focused.chip-primary{background-color:var(--primary-base)}.chip.focused.chip-primary .close-icon:hover{color:var(--primary-base)}.chip.focused.chip-secondary{background-color:var(--secondary-base)}.chip.focused.chip-secondary .close-icon:hover{color:var(--secondary-base)}.chip.focused.chip-orange{background-color:var(--orange-base)}.chip.focused.chip-orange .close-icon:hover{color:var(--orange-base)}.chip.focused.chip-green{background-color:var(--green-base)}.chip.focused.chip-green .close-icon:hover{color:var(--green-base)}.chip.focused.chip-red{background-color:var(--red-base)}.chip.focused.chip-red .close-icon:hover{color:var(--red-base)}.chip.disabled{opacity:38%}.chip.disabled .close-icon{cursor:not-allowed;color:inherit}.chip.disabled .close-icon:hover{background-color:transparent!important}.chip.disabled.chip-slate{color:var(--slate-base);background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.disabled.chip-primary{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.disabled.chip-secondary{color:var(--secondary-base);background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.disabled.chip-orange{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.disabled.chip-green{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.disabled.chip-red{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}\n"] }]
|
|
26
|
+
args: [{ selector: 'fw-chip', template: "<div [ngClass]=\"['chip', variant, 'chip-'+color]\" [class.disabled]=\"disabled\" [class.focused]=\"selected\"\n [class.selectable]=\"selectable\" (click)=\"selectable ? select.emit(value) : undefined\">\n <fw-icon *ngIf=\"icon\" class=\"chip-icon\">{{ icon }}</fw-icon>\n <ng-content select=\"fw-avatar\"></ng-content>\n <div class=\"chip-text\" *ngIf=\"title\">\n <span>{{ title }}</span>\n <span *ngIf=\"description\" class=\"description\">{{ description }}</span>\n </div>\n <fw-icon class=\"close-icon\" *ngIf=\"showClose\" (click)=\"handleClose($event)\">\n close\n </fw-icon>\n</div>\n", styles: [":host{min-height:24px;display:inline-flex}.chip{box-sizing:border-box;border-radius:16px;padding:2px 4px;display:inline-flex;min-height:24px;align-items:center;font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:600;line-height:16px}.chip .chip-icon{align-items:flex-start;font-size:16px}.chip .chip-text{display:flex;align-items:center;margin:0 6px;min-height:16px;white-space:wrap}.chip .chip-text .description{margin-left:4px;font-weight:400;color:var(--typography-light)}.chip .close-icon{font-size:12px;font-weight:700;cursor:pointer;border-width:1px;border-style:solid;border-radius:16px;width:12px;height:12px;display:inline-flex;align-items:center;justify-content:center}.chip .close-icon:hover{color:var(--typography-contrast);border-radius:16px}.chip:not(.selectable){cursor:default}.chip.selectable{cursor:pointer}.chip.enabled.chip-slate{color:var(--slate-base);border:1px solid var(--slate-border)}.chip.enabled.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.enabled.chip-primary{color:var(--primary-base);border:1px solid var(--primary-border)}.chip.enabled.chip-primary .close-icon{border-color:var(--primary-base)}.chip.enabled.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.enabled.chip-secondary{color:var(--secondary-base);border:1px solid var(--secondary-border)}.chip.enabled.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.enabled.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.enabled.chip-orange{color:var(--orange-base);border:1px solid var(--orange-border)}.chip.enabled.chip-orange .close-icon{border-color:var(--orange-base)}.chip.enabled.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.enabled.chip-green{color:var(--green-base);border:1px solid var(--green-border)}.chip.enabled.chip-green .close-icon{border-color:var(--green-base)}.chip.enabled.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.enabled.chip-red{color:var(--red-base);border:1px solid var(--red-border)}.chip.enabled.chip-red .close-icon{border-color:var(--red-base)}.chip.enabled.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.hovered.chip-slate,.chip.selectable:not(.focused):hover.chip-slate{color:var(--slate-base)!important;background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.hovered.chip-slate .close-icon:hover,.chip.selectable:not(.focused):hover.chip-slate .close-icon:hover{background-color:var(--slate-base)}.chip.hovered.chip-primary,.chip.selectable:not(.focused):hover.chip-primary{color:var(--primary-base)!important;background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.hovered.chip-primary .close-icon,.chip.selectable:not(.focused):hover.chip-primary .close-icon{border-color:var(--primary-base)}.chip.hovered.chip-primary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-primary .close-icon:hover{background-color:var(--primary-base)}.chip.hovered.chip-secondary,.chip.selectable:not(.focused):hover.chip-secondary{color:var(--secondary-base)!important;background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.hovered.chip-secondary .close-icon,.chip.selectable:not(.focused):hover.chip-secondary .close-icon{border-color:var(--secondary-base)}.chip.hovered.chip-secondary .close-icon:hover,.chip.selectable:not(.focused):hover.chip-secondary .close-icon:hover{background-color:var(--secondary-base)}.chip.hovered.chip-orange,.chip.selectable:not(.focused):hover.chip-orange{color:var(--orange-base)!important;background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.hovered.chip-orange .close-icon,.chip.selectable:not(.focused):hover.chip-orange .close-icon{border-color:var(--orange-base)}.chip.hovered.chip-orange .close-icon:hover,.chip.selectable:not(.focused):hover.chip-orange .close-icon:hover{background-color:var(--orange-base)}.chip.hovered.chip-green,.chip.selectable:not(.focused):hover.chip-green{color:var(--green-base)!important;background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.hovered.chip-green .close-icon,.chip.selectable:not(.focused):hover.chip-green .close-icon{border-color:var(--green-base)}.chip.hovered.chip-green .close-icon:hover,.chip.selectable:not(.focused):hover.chip-green .close-icon:hover{background-color:var(--green-base)}.chip.hovered.chip-red,.chip.selectable:not(.focused):hover.chip-red{color:var(--red-base)!important;background-color:var(--red-hover);border:1px solid var(--red-border)}.chip.hovered.chip-red .close-icon,.chip.selectable:not(.focused):hover.chip-red .close-icon{border-color:var(--red-base)}.chip.hovered.chip-red .close-icon:hover,.chip.selectable:not(.focused):hover.chip-red .close-icon:hover{background-color:var(--red-base)}.chip.focused{color:var(--typography-contrast)!important}.chip.focused .close-icon{border-color:var(--typography-contrast)}.chip.focused .close-icon:hover{background-color:var(--typography-contrast);border-radius:16px}.chip.focused.chip-slate{background-color:var(--slate-focus);color:var(--typography-base)!important}.chip.focused.chip-slate .close-icon{border-color:var(--typography-base)}.chip.focused.chip-slate .close-icon:hover{color:var(--slate-base)}.chip.focused.chip-primary{background-color:var(--primary-base)}.chip.focused.chip-primary .close-icon:hover{color:var(--primary-base)}.chip.focused.chip-secondary{background-color:var(--secondary-base)}.chip.focused.chip-secondary .close-icon:hover{color:var(--secondary-base)}.chip.focused.chip-orange{background-color:var(--orange-base)}.chip.focused.chip-orange .close-icon:hover{color:var(--orange-base)}.chip.focused.chip-green{background-color:var(--green-base)}.chip.focused.chip-green .close-icon:hover{color:var(--green-base)}.chip.focused.chip-red{background-color:var(--red-base)}.chip.focused.chip-red .close-icon:hover{color:var(--red-base)}.chip.disabled{opacity:38%}.chip.disabled .close-icon{cursor:not-allowed;color:inherit}.chip.disabled .close-icon:hover{background-color:transparent!important}.chip.disabled.chip-slate{color:var(--slate-base);background-color:var(--slate-hover);border:1px solid var(--slate-border)}.chip.disabled.chip-primary{color:var(--primary-base);background-color:var(--primary-hover);border:1px solid var(--primary-border)}.chip.disabled.chip-secondary{color:var(--secondary-base);background-color:var(--secondary-hover);border:1px solid var(--secondary-border)}.chip.disabled.chip-orange{color:var(--orange-base);background-color:var(--orange-hover);border:1px solid var(--orange-border)}.chip.disabled.chip-green{color:var(--green-base);background-color:var(--green-hover);border:1px solid var(--green-border)}.chip.disabled.chip-red{color:var(--red-base);background-color:var(--red-hover);border:1px solid var(--red-border)}\n"] }]
|
|
27
27
|
}], propDecorators: { value: [{
|
|
28
28
|
type: Input
|
|
29
29
|
}], variant: [{
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { Component, HostBinding } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/platform-browser";
|
|
4
|
+
export class FwDialogActionsComponent {
|
|
5
|
+
constructor(sanitizer) {
|
|
6
|
+
this.sanitizer = sanitizer;
|
|
7
|
+
}
|
|
8
|
+
get style() {
|
|
9
|
+
return this.sanitizer.bypassSecurityTrustStyle(`
|
|
10
|
+
display: flex;
|
|
11
|
+
flex-direction: row;
|
|
12
|
+
align-items: center;
|
|
13
|
+
justify-content: flex-end;
|
|
14
|
+
gap: 16px;
|
|
15
|
+
`);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
FwDialogActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwDialogActionsComponent, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
19
|
+
FwDialogActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwDialogActionsComponent, selector: "fw-dialog-actions", host: { properties: { "style": "this.style" } }, ngImport: i0, template: `
|
|
20
|
+
<ng-content></ng-content>`, isInline: true });
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwDialogActionsComponent, decorators: [{
|
|
22
|
+
type: Component,
|
|
23
|
+
args: [{
|
|
24
|
+
template: `
|
|
25
|
+
<ng-content></ng-content>`,
|
|
26
|
+
selector: 'fw-dialog-actions',
|
|
27
|
+
}]
|
|
28
|
+
}], ctorParameters: function () { return [{ type: i1.DomSanitizer }]; }, propDecorators: { style: [{
|
|
29
|
+
type: HostBinding,
|
|
30
|
+
args: ['style']
|
|
31
|
+
}] } });
|
|
32
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLWFjdGlvbnMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvZGlhbG9nL2RpYWxvZy1hY3Rpb25zLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUXZELE1BQU0sT0FBTyx3QkFBd0I7SUFXbkMsWUFBb0IsU0FBdUI7UUFBdkIsY0FBUyxHQUFULFNBQVMsQ0FBYztJQUMzQyxDQUFDO0lBWEQsSUFBMEIsS0FBSztRQUM3QixPQUFPLElBQUksQ0FBQyxTQUFTLENBQUMsd0JBQXdCLENBQUM7Ozs7OztHQU1oRCxDQUFDLENBQUM7SUFDSCxDQUFDOztxSEFUVSx3QkFBd0I7eUdBQXhCLHdCQUF3QiwwR0FKekI7OEJBQ2tCOzJGQUdqQix3QkFBd0I7a0JBTHBDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFOzhCQUNrQjtvQkFDNUIsUUFBUSxFQUFFLG1CQUFtQjtpQkFDOUI7bUdBRTJCLEtBQUs7c0JBQTlCLFdBQVc7dUJBQUMsT0FBTyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSG9zdEJpbmRpbmcgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IERvbVNhbml0aXplciwgU2FmZVN0eWxlIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5cbkBDb21wb25lbnQoe1xuICB0ZW1wbGF0ZTogYFxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5gLFxuICBzZWxlY3RvcjogJ2Z3LWRpYWxvZy1hY3Rpb25zJyxcbn0pXG5leHBvcnQgY2xhc3MgRndEaWFsb2dBY3Rpb25zQ29tcG9uZW50IHtcbiAgQEhvc3RCaW5kaW5nKCdzdHlsZScpIGdldCBzdHlsZSgpOiBTYWZlU3R5bGUge1xuICAgIHJldHVybiB0aGlzLnNhbml0aXplci5ieXBhc3NTZWN1cml0eVRydXN0U3R5bGUoYFxuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xuICAgICAgICBnYXA6IDE2cHg7XG4gIGApO1xuICB9XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBzYW5pdGl6ZXI6IERvbVNhbml0aXplcikge1xuICB9XG59XG4iXX0=
|
|
@@ -5,11 +5,14 @@ import * as i1 from "@angular/cdk/dialog";
|
|
|
5
5
|
import * as i2 from "@angular/common";
|
|
6
6
|
import * as i3 from "../button/button.component";
|
|
7
7
|
import * as i4 from "../icon/icon.component";
|
|
8
|
-
import * as i5 from "./dialog.component";
|
|
8
|
+
import * as i5 from "./dialog-actions.component";
|
|
9
|
+
import * as i6 from "./dialog.component";
|
|
10
|
+
import * as i7 from "./dialog-content.component";
|
|
9
11
|
export class FwDialogConfirmComponent {
|
|
10
12
|
constructor(dialogRef) {
|
|
11
13
|
this.dialogRef = dialogRef;
|
|
12
14
|
this.title = 'Confirm';
|
|
15
|
+
this.iconColor = 'primary';
|
|
13
16
|
this.confirmColor = 'primary';
|
|
14
17
|
this.confirmButtonText = 'Confirm';
|
|
15
18
|
this.confirmButtonIcon = 'done-check';
|
|
@@ -26,14 +29,18 @@ export class FwDialogConfirmComponent {
|
|
|
26
29
|
}
|
|
27
30
|
}
|
|
28
31
|
FwDialogConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwDialogConfirmComponent, deps: [{ token: i1.DialogRef, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
-
FwDialogConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwDialogConfirmComponent, selector: "fw-dialog-confirm", inputs: { title: "title", confirmColor: "confirmColor", confirmButtonText: "confirmButtonText", confirmButtonIcon: "confirmButtonIcon", cancelButtonText: "cancelButtonText", contentIcon: "contentIcon", contentTitle: "contentTitle", contentText: "contentText" }, outputs: { close: "close", confirm: "confirm" }, ngImport: i0, template: "<fw-dialog
|
|
32
|
+
FwDialogConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwDialogConfirmComponent, selector: "fw-dialog-confirm", inputs: { title: "title", icon: "icon", iconColor: "iconColor", confirmColor: "confirmColor", confirmButtonText: "confirmButtonText", confirmButtonIcon: "confirmButtonIcon", cancelButtonText: "cancelButtonText", contentIcon: "contentIcon", contentTitle: "contentTitle", contentText: "contentText" }, outputs: { close: "close", confirm: "confirm" }, ngImport: i0, template: "<fw-dialog\n [width]=\"DialogWidth.ExtraSmall\"\n [title]=\"title\"\n [icon]=\"icon\"\n [iconColor]=\"iconColor\"\n [showClose]=\"false\">\n <fw-dialog-content>\n <div class=\"dialog-content-confirm\">\n <fw-icon class=\"content-icon\" [ngClass]=\"confirmColor\" *ngIf=\"contentIcon\">\n {{ contentIcon }}\n </fw-icon>\n <p class=\"content-title\" *ngIf=\"contentTitle\">\n {{ contentTitle }}\n </p>\n <p class=\"content-text\" *ngIf=\"contentText\">\n {{ contentText }}\n </p>\n </div>\n </fw-dialog-content>\n <fw-dialog-actions>\n <fw-button\n variant=\"outline\"\n *ngIf=\"cancelButtonText\"\n color=\"slate\"\n (click)=\"handleCloseButton()\">\n {{ cancelButtonText }}\n </fw-button>\n <fw-button\n variant=\"solid\"\n *ngIf=\"confirmButtonText\"\n [color]=\"confirmColor\"\n [leftIcon]=\"confirmButtonIcon\"\n (click)=\"confirm.emit()\">\n {{ confirmButtonText }}\n </fw-button>\n </fw-dialog-actions>\n</fw-dialog>\n", styles: [":host{box-sizing:border-box}.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: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.FwButtonComponent, selector: "fw-button", inputs: ["color", "size", "variant", "disabled", "fullWidth", "leftIcon", "rightIcon"] }, { kind: "component", type: i4.FwIconComponent, selector: "fw-icon", inputs: ["size", "color"] }, { kind: "component", type: i5.FwDialogActionsComponent, selector: "fw-dialog-actions" }, { kind: "component", type: i6.FwDialogComponent, selector: "fw-dialog", inputs: ["width", "title", "icon", "iconColor", "showClose"], outputs: ["close"] }, { kind: "component", type: i7.FwDialogContentComponent, selector: "fw-dialog-content", inputs: ["padded"] }] });
|
|
30
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwDialogConfirmComponent, decorators: [{
|
|
31
34
|
type: Component,
|
|
32
|
-
args: [{ selector: 'fw-dialog-confirm', template: "<fw-dialog
|
|
35
|
+
args: [{ selector: 'fw-dialog-confirm', template: "<fw-dialog\n [width]=\"DialogWidth.ExtraSmall\"\n [title]=\"title\"\n [icon]=\"icon\"\n [iconColor]=\"iconColor\"\n [showClose]=\"false\">\n <fw-dialog-content>\n <div class=\"dialog-content-confirm\">\n <fw-icon class=\"content-icon\" [ngClass]=\"confirmColor\" *ngIf=\"contentIcon\">\n {{ contentIcon }}\n </fw-icon>\n <p class=\"content-title\" *ngIf=\"contentTitle\">\n {{ contentTitle }}\n </p>\n <p class=\"content-text\" *ngIf=\"contentText\">\n {{ contentText }}\n </p>\n </div>\n </fw-dialog-content>\n <fw-dialog-actions>\n <fw-button\n variant=\"outline\"\n *ngIf=\"cancelButtonText\"\n color=\"slate\"\n (click)=\"handleCloseButton()\">\n {{ cancelButtonText }}\n </fw-button>\n <fw-button\n variant=\"solid\"\n *ngIf=\"confirmButtonText\"\n [color]=\"confirmColor\"\n [leftIcon]=\"confirmButtonIcon\"\n (click)=\"confirm.emit()\">\n {{ confirmButtonText }}\n </fw-button>\n </fw-dialog-actions>\n</fw-dialog>\n", styles: [":host{box-sizing:border-box}.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"] }]
|
|
33
36
|
}], ctorParameters: function () { return [{ type: i1.DialogRef, decorators: [{
|
|
34
37
|
type: Optional
|
|
35
38
|
}] }]; }, propDecorators: { title: [{
|
|
36
39
|
type: Input
|
|
40
|
+
}], icon: [{
|
|
41
|
+
type: Input
|
|
42
|
+
}], iconColor: [{
|
|
43
|
+
type: Input
|
|
37
44
|
}], confirmColor: [{
|
|
38
45
|
type: Input
|
|
39
46
|
}], confirmButtonText: [{
|
|
@@ -53,4 +60,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
53
60
|
}], confirm: [{
|
|
54
61
|
type: Output
|
|
55
62
|
}] } });
|
|
56
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
63
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLWNvbmZpcm0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvZGlhbG9nL2RpYWxvZy1jb25maXJtLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2RpYWxvZy9kaWFsb2ctY29uZmlybS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFDQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUVqRixPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7Ozs7Ozs7OztBQU9qRCxNQUFNLE9BQU8sd0JBQXdCO0lBZ0JuQyxZQUErQixTQUFvQjtRQUFwQixjQUFTLEdBQVQsU0FBUyxDQUFXO1FBZjFDLFVBQUssR0FBWSxTQUFTLENBQUM7UUFFM0IsY0FBUyxHQUFvRSxTQUFTLENBQUM7UUFDdkYsaUJBQVksR0FBMEUsU0FBUyxDQUFDO1FBQ2hHLHNCQUFpQixHQUFZLFNBQVMsQ0FBQztRQUN2QyxzQkFBaUIsR0FBWSxZQUFZLENBQUM7UUFDMUMscUJBQWdCLEdBQVksUUFBUSxDQUFDO1FBRXJDLGlCQUFZLEdBQVksZUFBZSxDQUFDO1FBRWpELDREQUE0RDtRQUNsRCxVQUFLLEdBQXVCLElBQUksWUFBWSxFQUFRLENBQUM7UUFDckQsWUFBTyxHQUF1QixJQUFJLFlBQVksRUFBUSxDQUFDO1FBQzlDLGdCQUFXLEdBQUcsV0FBVyxDQUFDO0lBRzdDLENBQUM7SUFFRCxpQkFBaUI7UUFDZixJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDcEIsQ0FBQzs7cUhBdEJVLHdCQUF3Qjt5R0FBeEIsd0JBQXdCLHNaQ1ZyQyxraUNBcUNBOzJGRDNCYSx3QkFBd0I7a0JBTHBDLFNBQVM7K0JBQ0UsbUJBQW1COzswQkFvQmhCLFFBQVE7NENBZlosS0FBSztzQkFBYixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csaUJBQWlCO3NCQUF6QixLQUFLO2dCQUNHLGlCQUFpQjtzQkFBekIsS0FBSztnQkFDRyxnQkFBZ0I7c0JBQXhCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBRUksS0FBSztzQkFBZCxNQUFNO2dCQUNHLE9BQU87c0JBQWhCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaWFsb2dSZWYgfSBmcm9tICdAYW5ndWxhci9jZGsvZGlhbG9nJztcbmltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3B0aW9uYWwsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBEaWFsb2dXaWR0aCB9IGZyb20gJy4vZGlhbG9nLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2Z3LWRpYWxvZy1jb25maXJtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2RpYWxvZy1jb25maXJtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZGlhbG9nLWNvbmZpcm0uY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgRndEaWFsb2dDb25maXJtQ29tcG9uZW50IHtcbiAgQElucHV0KCkgdGl0bGU/OiBzdHJpbmcgPSAnQ29uZmlybSc7XG4gIEBJbnB1dCgpIGljb24/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGljb25Db2xvcj86ICdwcmltYXJ5JyB8ICdzZWNvbmRhcnknIHwgJ3JlZCcgfCAnb3JhbmdlJyB8ICdncmVlbicgfCAnc2xhdGUnID0gJ3ByaW1hcnknO1xuICBASW5wdXQoKSBjb25maXJtQ29sb3I/OiAncHJpbWFyeScgfCAnc2Vjb25kYXJ5JyB8ICdkYW5nZXInIHwgJ3NsYXRlJyB8ICd3YXJuaW5nJyB8ICdzdWNjZXNzJyA9ICdwcmltYXJ5JztcbiAgQElucHV0KCkgY29uZmlybUJ1dHRvblRleHQ/OiBzdHJpbmcgPSAnQ29uZmlybSc7XG4gIEBJbnB1dCgpIGNvbmZpcm1CdXR0b25JY29uPzogc3RyaW5nID0gJ2RvbmUtY2hlY2snO1xuICBASW5wdXQoKSBjYW5jZWxCdXR0b25UZXh0Pzogc3RyaW5nID0gJ0NhbmNlbCc7XG4gIEBJbnB1dCgpIGNvbnRlbnRJY29uPzogc3RyaW5nO1xuICBASW5wdXQoKSBjb250ZW50VGl0bGU/OiBzdHJpbmcgPSAnQXJlIHlvdSBzdXJlPyc7XG4gIEBJbnB1dCgpIGNvbnRlbnRUZXh0Pzogc3RyaW5nO1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L25vLW91dHB1dC1uYXRpdmVcbiAgQE91dHB1dCgpIGNsb3NlOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG4gIEBPdXRwdXQoKSBjb25maXJtOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG4gIHByb3RlY3RlZCByZWFkb25seSBEaWFsb2dXaWR0aCA9IERpYWxvZ1dpZHRoO1xuXG4gIGNvbnN0cnVjdG9yKEBPcHRpb25hbCgpIHB1YmxpYyBkaWFsb2dSZWY6IERpYWxvZ1JlZikge1xuICB9XG5cbiAgaGFuZGxlQ2xvc2VCdXR0b24oKTogdm9pZCB7XG4gICAgdGhpcy5kaWFsb2dSZWYuY2xvc2UoKTtcbiAgICB0aGlzLmNsb3NlLmVtaXQoKTtcbiAgfVxufVxuIiwiPGZ3LWRpYWxvZ1xuICBbd2lkdGhdPVwiRGlhbG9nV2lkdGguRXh0cmFTbWFsbFwiXG4gIFt0aXRsZV09XCJ0aXRsZVwiXG4gIFtpY29uXT1cImljb25cIlxuICBbaWNvbkNvbG9yXT1cImljb25Db2xvclwiXG4gIFtzaG93Q2xvc2VdPVwiZmFsc2VcIj5cbiAgPGZ3LWRpYWxvZy1jb250ZW50PlxuICAgIDxkaXYgY2xhc3M9XCJkaWFsb2ctY29udGVudC1jb25maXJtXCI+XG4gICAgICA8ZnctaWNvbiBjbGFzcz1cImNvbnRlbnQtaWNvblwiIFtuZ0NsYXNzXT1cImNvbmZpcm1Db2xvclwiICpuZ0lmPVwiY29udGVudEljb25cIj5cbiAgICAgICAge3sgY29udGVudEljb24gfX1cbiAgICAgIDwvZnctaWNvbj5cbiAgICAgIDxwIGNsYXNzPVwiY29udGVudC10aXRsZVwiICpuZ0lmPVwiY29udGVudFRpdGxlXCI+XG4gICAgICAgIHt7IGNvbnRlbnRUaXRsZSB9fVxuICAgICAgPC9wPlxuICAgICAgPHAgY2xhc3M9XCJjb250ZW50LXRleHRcIiAqbmdJZj1cImNvbnRlbnRUZXh0XCI+XG4gICAgICAgIHt7IGNvbnRlbnRUZXh0IH19XG4gICAgICA8L3A+XG4gICAgPC9kaXY+XG4gIDwvZnctZGlhbG9nLWNvbnRlbnQ+XG4gIDxmdy1kaWFsb2ctYWN0aW9ucz5cbiAgICA8ZnctYnV0dG9uXG4gICAgICB2YXJpYW50PVwib3V0bGluZVwiXG4gICAgICAqbmdJZj1cImNhbmNlbEJ1dHRvblRleHRcIlxuICAgICAgY29sb3I9XCJzbGF0ZVwiXG4gICAgICAoY2xpY2spPVwiaGFuZGxlQ2xvc2VCdXR0b24oKVwiPlxuICAgICAge3sgY2FuY2VsQnV0dG9uVGV4dCB9fVxuICAgIDwvZnctYnV0dG9uPlxuICAgIDxmdy1idXR0b25cbiAgICAgIHZhcmlhbnQ9XCJzb2xpZFwiXG4gICAgICAqbmdJZj1cImNvbmZpcm1CdXR0b25UZXh0XCJcbiAgICAgIFtjb2xvcl09XCJjb25maXJtQ29sb3JcIlxuICAgICAgW2xlZnRJY29uXT1cImNvbmZpcm1CdXR0b25JY29uXCJcbiAgICAgIChjbGljayk9XCJjb25maXJtLmVtaXQoKVwiPlxuICAgICAge3sgY29uZmlybUJ1dHRvblRleHQgfX1cbiAgICA8L2Z3LWJ1dHRvbj5cbiAgPC9mdy1kaWFsb2ctYWN0aW9ucz5cbjwvZnctZGlhbG9nPlxuIl19
|