@flywheel-io/vision 1.7.0 → 1.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/date-input/date-input.component.d.ts +1 -1
- package/components/layouts/panel/panel.component.d.ts +3 -1
- package/components/layouts/sidebar/sidebar.component.d.ts +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/date-input/date-input.component.mjs +3 -3
- package/esm2020/components/layouts/panel/panel.component.mjs +9 -3
- package/esm2020/components/layouts/sidebar/sidebar.component.mjs +4 -4
- package/fesm2015/flywheel-io-vision.mjs +17 -11
- package/fesm2015/flywheel-io-vision.mjs.map +1 -1
- package/fesm2020/flywheel-io-vision.mjs +17 -11
- package/fesm2020/flywheel-io-vision.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -28,7 +28,7 @@ export declare class FwDateInputComponent implements ControlValueAccessor {
|
|
|
28
28
|
registerOnChange(fn: any): void;
|
|
29
29
|
registerOnTouched(fn: any): void;
|
|
30
30
|
setDisabledState(isDisabled: boolean): void;
|
|
31
|
-
changeHandler(event:
|
|
31
|
+
changeHandler(event: Event): void;
|
|
32
32
|
blurHandler(): void;
|
|
33
33
|
onLeftIconClick(): void;
|
|
34
34
|
static ɵfac: i0.ɵɵFactoryDeclaration<FwDateInputComponent, never>;
|
|
@@ -4,6 +4,8 @@ export declare class FwLayoutPanelComponent {
|
|
|
4
4
|
fitted?: boolean;
|
|
5
5
|
border?: 'all' | 'left' | 'right' | 'none';
|
|
6
6
|
rounded?: boolean;
|
|
7
|
+
margin?: boolean;
|
|
8
|
+
padded?: boolean;
|
|
7
9
|
static ɵfac: i0.ɵɵFactoryDeclaration<FwLayoutPanelComponent, never>;
|
|
8
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<FwLayoutPanelComponent, "fw-layout-panel", never, { "height": "height"; "fitted": "fitted"; "border": "border"; "rounded": "rounded"; }, {}, never, ["header", "*", "footer"], false>;
|
|
10
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<FwLayoutPanelComponent, "fw-layout-panel", never, { "height": "height"; "fitted": "fitted"; "border": "border"; "rounded": "rounded"; "margin": "margin"; "padded": "padded"; }, {}, never, ["header", "*", "footer"], false>;
|
|
9
11
|
}
|
|
@@ -2,7 +2,7 @@ import * as i0 from "@angular/core";
|
|
|
2
2
|
export declare class FwLayoutSidebarComponent {
|
|
3
3
|
outlined: boolean;
|
|
4
4
|
rounded: boolean;
|
|
5
|
-
width?:
|
|
5
|
+
width?: string;
|
|
6
6
|
direction?: 'row' | 'row-reverse';
|
|
7
7
|
static ɵfac: i0.ɵɵFactoryDeclaration<FwLayoutSidebarComponent, never>;
|
|
8
8
|
static ɵcmp: i0.ɵɵComponentDeclaration<FwLayoutSidebarComponent, "fw-layout-sidebar", never, { "outlined": "outlined"; "rounded": "rounded"; "width": "width"; "direction": "direction"; }, {}, never, ["*", "aside"], false>;
|
|
@@ -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}: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"] }] });
|
|
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-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}: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"] }]
|
|
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-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:
|
|
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:24px}:host.large{width:48px;height:48px;font-size:22px}:host.large .avatar fw-icon{font-size:32px}:host.x-large{width:96px;height:96px;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:
|
|
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:24px}:host.large{width:48px;height:48px;font-size:22px}:host.large .avatar fw-icon{font-size:32px}:host.x-large{width:96px;height:96px;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']
|
|
@@ -51,14 +51,14 @@ FwDateInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
|
|
|
51
51
|
provide: NG_VALUE_ACCESSOR,
|
|
52
52
|
useExisting: FwDateInputComponent,
|
|
53
53
|
multi: true,
|
|
54
|
-
}], ngImport: i0, template: "<div class=\"full-container\">\n <div class=\"input-container\" [class]=\"size\">\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">\n {{ leftIcon }}\n </fw-icon>\n <p class=\"context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n <input\n [type]=\"type\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n [value]=\"value\"\n [max]=\"max\"\n [min]=\"min\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\">\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n </div>\n <p class=\"helper-text\" *ngIf=\"!!helperText\">{{ helperText }}</p>\n <p class=\"error-text\" *ngIf=\"!!errorText\">{{ errorText }}</p>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4,.full-container .helper-text,.full-container .error-text{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)}/*! Sass Fairy v1 | (c) roydukkey | https://sass-fairy.com/license */.full-container{display:flex;flex-direction:column;line-height:21px}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-family:Inter,sans-serif;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input::-webkit-datetime-edit-fields-wrapper{font-family:Inter,sans-serif}.full-container .input-container input::-webkit-datetime-edit-text{color:var(--typography-light)}.full-container .input-container input::-webkit-datetime-edit-year-field:hover,.full-container .input-container input::-webkit-datetime-edit-year-field:active,.full-container .input-container input::-webkit-datetime-edit-year-field:focus,.full-container .input-container input::-webkit-datetime-edit-month-field:hover,.full-container .input-container input::-webkit-datetime-edit-month-field:active,.full-container .input-container input::-webkit-datetime-edit-month-field:focus,.full-container .input-container input::-webkit-datetime-edit-week-field:hover,.full-container .input-container input::-webkit-datetime-edit-week-field:active,.full-container .input-container input::-webkit-datetime-edit-week-field:focus,.full-container .input-container input::-webkit-datetime-edit-day-field:hover,.full-container .input-container input::-webkit-datetime-edit-day-field:active,.full-container .input-container input::-webkit-datetime-edit-day-field:focus,.full-container .input-container input::-webkit-datetime-edit-hour-field:hover,.full-container .input-container input::-webkit-datetime-edit-hour-field:active,.full-container .input-container input::-webkit-datetime-edit-hour-field:focus,.full-container .input-container input::-webkit-datetime-edit-minute-field:hover,.full-container .input-container input::-webkit-datetime-edit-minute-field:active,.full-container .input-container input::-webkit-datetime-edit-minute-field:focus,.full-container .input-container input::-webkit-datetime-edit-second-field:hover,.full-container .input-container input::-webkit-datetime-edit-second-field:active,.full-container .input-container input::-webkit-datetime-edit-second-field:focus,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:hover,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:active,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:focus,.full-container .input-container input::-webkit-datetime-edit-ampm-field:hover,.full-container .input-container input::-webkit-datetime-edit-ampm-field:active,.full-container .input-container input::-webkit-datetime-edit-ampm-field:focus{background-color:var(--primary-focus);color:var(--typography-base)}.full-container .input-container input::-webkit-calendar-picker-indicator{color:#0000;opacity:1;width:22px;height:22px;cursor:pointer;margin-left:.5rem;margin-right:-1px;outline-width:1px;border-radius:6px}.full-container .input-container input[type=date]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=datetime-local]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=time]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg fill=\"none\" height=\"1024\" viewBox=\"0 0 1024 1024\" width=\"1024\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M981.333 512c0-129.579-52.565-246.997-137.472-331.861s-202.283-137.472-331.861-137.472-246.997 52.565-331.861 137.472-137.472 202.283-137.472 331.861 52.565 246.997 137.472 331.861 202.283 137.472 331.861 137.472 246.997-52.565 331.861-137.472 137.472-202.283 137.472-331.861zM896 512c0 106.069-42.923 201.984-112.469 271.531s-165.461 112.469-271.531 112.469-201.984-42.923-271.531-112.469-112.469-165.461-112.469-271.531 42.923-201.984 112.469-271.531 165.461-112.469 271.531-112.469 201.984 42.923 271.531 112.469 112.469 165.461 112.469 271.531zM469.333 256v256c0 16.597 9.472 31.019 23.595 38.144l170.667 85.333c21.077 10.539 46.72 2.005 57.259-19.072s2.005-46.72-19.072-57.259l-147.115-73.515v-229.632c0-23.552-19.115-42.667-42.667-42.667s-42.667 19.115-42.667 42.667z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px}.medium{height:36px}.medium>fw-icon{font-size:20px}.large{height:40px}.large>fw-icon{font-size:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}\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"] }] });
|
|
54
|
+
}], ngImport: i0, template: "<div class=\"full-container\">\n <div class=\"input-container\" [class]=\"size\">\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">\n {{ leftIcon }}\n </fw-icon>\n <p class=\"context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n <input\n [type]=\"type\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n (change)=\"changeHandler($event)\"\n [value]=\"value\"\n [max]=\"max\"\n [min]=\"min\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\">\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n </div>\n <p class=\"helper-text\" *ngIf=\"!!helperText\">{{ helperText }}</p>\n <p class=\"error-text\" *ngIf=\"!!errorText\">{{ errorText }}</p>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4,.full-container .helper-text,.full-container .error-text{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)}/*! Sass Fairy v1 | (c) roydukkey | https://sass-fairy.com/license */.full-container{display:flex;flex-direction:column;line-height:21px}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-family:Inter,sans-serif;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input::-webkit-datetime-edit-fields-wrapper{font-family:Inter,sans-serif}.full-container .input-container input::-webkit-datetime-edit-text{color:var(--typography-light)}.full-container .input-container input::-webkit-datetime-edit-year-field:hover,.full-container .input-container input::-webkit-datetime-edit-year-field:active,.full-container .input-container input::-webkit-datetime-edit-year-field:focus,.full-container .input-container input::-webkit-datetime-edit-month-field:hover,.full-container .input-container input::-webkit-datetime-edit-month-field:active,.full-container .input-container input::-webkit-datetime-edit-month-field:focus,.full-container .input-container input::-webkit-datetime-edit-week-field:hover,.full-container .input-container input::-webkit-datetime-edit-week-field:active,.full-container .input-container input::-webkit-datetime-edit-week-field:focus,.full-container .input-container input::-webkit-datetime-edit-day-field:hover,.full-container .input-container input::-webkit-datetime-edit-day-field:active,.full-container .input-container input::-webkit-datetime-edit-day-field:focus,.full-container .input-container input::-webkit-datetime-edit-hour-field:hover,.full-container .input-container input::-webkit-datetime-edit-hour-field:active,.full-container .input-container input::-webkit-datetime-edit-hour-field:focus,.full-container .input-container input::-webkit-datetime-edit-minute-field:hover,.full-container .input-container input::-webkit-datetime-edit-minute-field:active,.full-container .input-container input::-webkit-datetime-edit-minute-field:focus,.full-container .input-container input::-webkit-datetime-edit-second-field:hover,.full-container .input-container input::-webkit-datetime-edit-second-field:active,.full-container .input-container input::-webkit-datetime-edit-second-field:focus,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:hover,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:active,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:focus,.full-container .input-container input::-webkit-datetime-edit-ampm-field:hover,.full-container .input-container input::-webkit-datetime-edit-ampm-field:active,.full-container .input-container input::-webkit-datetime-edit-ampm-field:focus{background-color:var(--primary-focus);color:var(--typography-base)}.full-container .input-container input::-webkit-calendar-picker-indicator{color:#0000;opacity:1;width:22px;height:22px;cursor:pointer;margin-left:.5rem;margin-right:-1px;outline-width:1px;border-radius:6px}.full-container .input-container input[type=date]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=datetime-local]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=time]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg fill=\"none\" height=\"1024\" viewBox=\"0 0 1024 1024\" width=\"1024\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M981.333 512c0-129.579-52.565-246.997-137.472-331.861s-202.283-137.472-331.861-137.472-246.997 52.565-331.861 137.472-137.472 202.283-137.472 331.861 52.565 246.997 137.472 331.861 202.283 137.472 331.861 137.472 246.997-52.565 331.861-137.472 137.472-202.283 137.472-331.861zM896 512c0 106.069-42.923 201.984-112.469 271.531s-165.461 112.469-271.531 112.469-201.984-42.923-271.531-112.469-112.469-165.461-112.469-271.531 42.923-201.984 112.469-271.531 165.461-112.469 271.531-112.469 201.984 42.923 271.531 112.469 112.469 165.461 112.469 271.531zM469.333 256v256c0 16.597 9.472 31.019 23.595 38.144l170.667 85.333c21.077 10.539 46.72 2.005 57.259-19.072s2.005-46.72-19.072-57.259l-147.115-73.515v-229.632c0-23.552-19.115-42.667-42.667-42.667s-42.667 19.115-42.667 42.667z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px}.medium{height:36px}.medium>fw-icon{font-size:20px}.large{height:40px}.large>fw-icon{font-size:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}\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"] }] });
|
|
55
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwDateInputComponent, decorators: [{
|
|
56
56
|
type: Component,
|
|
57
57
|
args: [{ selector: 'fw-date-input', providers: [{
|
|
58
58
|
provide: NG_VALUE_ACCESSOR,
|
|
59
59
|
useExisting: FwDateInputComponent,
|
|
60
60
|
multi: true,
|
|
61
|
-
}], template: "<div class=\"full-container\">\n <div class=\"input-container\" [class]=\"size\">\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">\n {{ leftIcon }}\n </fw-icon>\n <p class=\"context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n <input\n [type]=\"type\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n [value]=\"value\"\n [max]=\"max\"\n [min]=\"min\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\">\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n </div>\n <p class=\"helper-text\" *ngIf=\"!!helperText\">{{ helperText }}</p>\n <p class=\"error-text\" *ngIf=\"!!errorText\">{{ errorText }}</p>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4,.full-container .helper-text,.full-container .error-text{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)}/*! Sass Fairy v1 | (c) roydukkey | https://sass-fairy.com/license */.full-container{display:flex;flex-direction:column;line-height:21px}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-family:Inter,sans-serif;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input::-webkit-datetime-edit-fields-wrapper{font-family:Inter,sans-serif}.full-container .input-container input::-webkit-datetime-edit-text{color:var(--typography-light)}.full-container .input-container input::-webkit-datetime-edit-year-field:hover,.full-container .input-container input::-webkit-datetime-edit-year-field:active,.full-container .input-container input::-webkit-datetime-edit-year-field:focus,.full-container .input-container input::-webkit-datetime-edit-month-field:hover,.full-container .input-container input::-webkit-datetime-edit-month-field:active,.full-container .input-container input::-webkit-datetime-edit-month-field:focus,.full-container .input-container input::-webkit-datetime-edit-week-field:hover,.full-container .input-container input::-webkit-datetime-edit-week-field:active,.full-container .input-container input::-webkit-datetime-edit-week-field:focus,.full-container .input-container input::-webkit-datetime-edit-day-field:hover,.full-container .input-container input::-webkit-datetime-edit-day-field:active,.full-container .input-container input::-webkit-datetime-edit-day-field:focus,.full-container .input-container input::-webkit-datetime-edit-hour-field:hover,.full-container .input-container input::-webkit-datetime-edit-hour-field:active,.full-container .input-container input::-webkit-datetime-edit-hour-field:focus,.full-container .input-container input::-webkit-datetime-edit-minute-field:hover,.full-container .input-container input::-webkit-datetime-edit-minute-field:active,.full-container .input-container input::-webkit-datetime-edit-minute-field:focus,.full-container .input-container input::-webkit-datetime-edit-second-field:hover,.full-container .input-container input::-webkit-datetime-edit-second-field:active,.full-container .input-container input::-webkit-datetime-edit-second-field:focus,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:hover,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:active,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:focus,.full-container .input-container input::-webkit-datetime-edit-ampm-field:hover,.full-container .input-container input::-webkit-datetime-edit-ampm-field:active,.full-container .input-container input::-webkit-datetime-edit-ampm-field:focus{background-color:var(--primary-focus);color:var(--typography-base)}.full-container .input-container input::-webkit-calendar-picker-indicator{color:#0000;opacity:1;width:22px;height:22px;cursor:pointer;margin-left:.5rem;margin-right:-1px;outline-width:1px;border-radius:6px}.full-container .input-container input[type=date]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=datetime-local]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=time]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg fill=\"none\" height=\"1024\" viewBox=\"0 0 1024 1024\" width=\"1024\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M981.333 512c0-129.579-52.565-246.997-137.472-331.861s-202.283-137.472-331.861-137.472-246.997 52.565-331.861 137.472-137.472 202.283-137.472 331.861 52.565 246.997 137.472 331.861 202.283 137.472 331.861 137.472 246.997-52.565 331.861-137.472 137.472-202.283 137.472-331.861zM896 512c0 106.069-42.923 201.984-112.469 271.531s-165.461 112.469-271.531 112.469-201.984-42.923-271.531-112.469-112.469-165.461-112.469-271.531 42.923-201.984 112.469-271.531 165.461-112.469 271.531-112.469 201.984 42.923 271.531 112.469 112.469 165.461 112.469 271.531zM469.333 256v256c0 16.597 9.472 31.019 23.595 38.144l170.667 85.333c21.077 10.539 46.72 2.005 57.259-19.072s2.005-46.72-19.072-57.259l-147.115-73.515v-229.632c0-23.552-19.115-42.667-42.667-42.667s-42.667 19.115-42.667 42.667z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px}.medium{height:36px}.medium>fw-icon{font-size:20px}.large{height:40px}.large>fw-icon{font-size:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}\n"] }]
|
|
61
|
+
}], template: "<div class=\"full-container\">\n <div class=\"input-container\" [class]=\"size\">\n <fw-icon\n *ngIf=\"!!leftIcon\"\n (click)=\"useActionableIcons?onLeftIconClick():null\"\n [ngClass]=\"useActionableIcons?'actionable':''\">\n {{ leftIcon }}\n </fw-icon>\n <p class=\"context\" *ngIf=\"!!prefix\">{{ prefix }}</p>\n <input\n [type]=\"type\"\n (keyup)=\"changeHandler($event)\"\n (blur)=\"blurHandler()\"\n (change)=\"changeHandler($event)\"\n [value]=\"value\"\n [max]=\"max\"\n [min]=\"min\"\n [step]=\"step\"\n [placeholder]=\"placeholder || ''\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\">\n <fw-icon class=\"error-icon\">warning-circle</fw-icon>\n </div>\n <p class=\"helper-text\" *ngIf=\"!!helperText\">{{ helperText }}</p>\n <p class=\"error-text\" *ngIf=\"!!errorText\">{{ errorText }}</p>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700\";.vision-h1{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:22px}.vision-h2{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:18px}.vision-h3{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:16px}.vision-h4{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:14px}.vision-h5{font-family:Inter,sans-serif;color:var(--typography-base);font-weight:500;font-size:12px;line-height:130%}.vision-p1{font-size:18px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p2{font-size:14px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p3{font-size:12px;font-family:Inter,sans-serif;color:var(--typography-base);font-weight:400}.vision-p4,.full-container .helper-text,.full-container .error-text{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)}/*! Sass Fairy v1 | (c) roydukkey | https://sass-fairy.com/license */.full-container{display:flex;flex-direction:column;line-height:21px}.full-container .input-container{box-sizing:border-box;color:var(--typography-light);background:var(--page-light);display:flex;padding:8px;align-items:center;gap:5px;border-radius:6px;border:1px solid var(--separations-input);font-family:Inter,sans-serif}.full-container .input-container:focus-within{border:1px solid var(--primary-base)}.full-container .input-container input{min-width:0;font-family:Inter,sans-serif;font-size:14px;flex-grow:1;color:var(--typography-base);background:var(--page-light);border:none}.full-container .input-container input:focus{outline:none;border:none}.full-container .input-container input::-webkit-datetime-edit-fields-wrapper{font-family:Inter,sans-serif}.full-container .input-container input::-webkit-datetime-edit-text{color:var(--typography-light)}.full-container .input-container input::-webkit-datetime-edit-year-field:hover,.full-container .input-container input::-webkit-datetime-edit-year-field:active,.full-container .input-container input::-webkit-datetime-edit-year-field:focus,.full-container .input-container input::-webkit-datetime-edit-month-field:hover,.full-container .input-container input::-webkit-datetime-edit-month-field:active,.full-container .input-container input::-webkit-datetime-edit-month-field:focus,.full-container .input-container input::-webkit-datetime-edit-week-field:hover,.full-container .input-container input::-webkit-datetime-edit-week-field:active,.full-container .input-container input::-webkit-datetime-edit-week-field:focus,.full-container .input-container input::-webkit-datetime-edit-day-field:hover,.full-container .input-container input::-webkit-datetime-edit-day-field:active,.full-container .input-container input::-webkit-datetime-edit-day-field:focus,.full-container .input-container input::-webkit-datetime-edit-hour-field:hover,.full-container .input-container input::-webkit-datetime-edit-hour-field:active,.full-container .input-container input::-webkit-datetime-edit-hour-field:focus,.full-container .input-container input::-webkit-datetime-edit-minute-field:hover,.full-container .input-container input::-webkit-datetime-edit-minute-field:active,.full-container .input-container input::-webkit-datetime-edit-minute-field:focus,.full-container .input-container input::-webkit-datetime-edit-second-field:hover,.full-container .input-container input::-webkit-datetime-edit-second-field:active,.full-container .input-container input::-webkit-datetime-edit-second-field:focus,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:hover,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:active,.full-container .input-container input::-webkit-datetime-edit-millisecond-field:focus,.full-container .input-container input::-webkit-datetime-edit-ampm-field:hover,.full-container .input-container input::-webkit-datetime-edit-ampm-field:active,.full-container .input-container input::-webkit-datetime-edit-ampm-field:focus{background-color:var(--primary-focus);color:var(--typography-base)}.full-container .input-container input::-webkit-calendar-picker-indicator{color:#0000;opacity:1;width:22px;height:22px;cursor:pointer;margin-left:.5rem;margin-right:-1px;outline-width:1px;border-radius:6px}.full-container .input-container input[type=date]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=datetime-local]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H19C20.5192 3.25 21.75 4.48079 21.75 6V9V19C21.75 20.5192 20.5192 21.75 19 21.75H5C3.48079 21.75 2.25 20.5192 2.25 19V9V6C2.25 4.48079 3.48079 3.25 5 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 6V4.75H5C4.30921 4.75 3.75 5.30921 3.75 6V8.25H20.25V6C20.25 5.30921 19.6908 4.75 19 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6ZM3.75 19V9.75H20.25V19C20.25 19.6908 19.6908 20.25 19 20.25H5C4.30921 20.25 3.75 19.6908 3.75 19ZM7 14C7.55228 14 8 13.5523 8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14ZM8 17C8 17.5523 7.55228 18 7 18C6.44772 18 6 17.5523 6 17C6 16.4477 6.44772 16 7 16C7.55228 16 8 16.4477 8 17ZM12 14C11.4477 14 11 13.5523 11 13C11 12.4477 11.4477 12 12 12C12.5523 12 13 12.4477 13 13C13 13.5523 12.5523 14 12 14ZM11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16C11.4477 16 11 16.4477 11 17ZM17 14C16.4477 14 16 13.5523 16 13C16 12.4477 16.4477 12 17 12C17.5523 12 18 12.4477 18 13C18 13.5523 17.5523 14 17 14Z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input[type=time]::-webkit-calendar-picker-indicator{background-image:url('data:image/svg+xml,<svg fill=\"none\" height=\"1024\" viewBox=\"0 0 1024 1024\" width=\"1024\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M981.333 512c0-129.579-52.565-246.997-137.472-331.861s-202.283-137.472-331.861-137.472-246.997 52.565-331.861 137.472-137.472 202.283-137.472 331.861 52.565 246.997 137.472 331.861 202.283 137.472 331.861 137.472 246.997-52.565 331.861-137.472 137.472-202.283 137.472-331.861zM896 512c0 106.069-42.923 201.984-112.469 271.531s-165.461 112.469-271.531 112.469-201.984-42.923-271.531-112.469-112.469-165.461-112.469-271.531 42.923-201.984 112.469-271.531 165.461-112.469 271.531-112.469 201.984 42.923 271.531 112.469 112.469 165.461 112.469 271.531zM469.333 256v256c0 16.597 9.472 31.019 23.595 38.144l170.667 85.333c21.077 10.539 46.72 2.005 57.259-19.072s2.005-46.72-19.072-57.259l-147.115-73.515v-229.632c0-23.552-19.115-42.667-42.667-42.667s-42.667 19.115-42.667 42.667z\" fill=\"%238996a9\"/></svg>')}.full-container .input-container input::placeholder{color:var(--typography-light)}.full-container .input-container .context{color:var(--typography-light)}.full-container .error-icon{display:none}.full-container .helper-text,.full-container .error-text{margin-top:4px;color:var(--typography-light);line-height:13px;margin-left:6px;margin-bottom:0}.full-container .error-text{text-align:left;color:var(--red-base);display:none}fw-icon.actionable{cursor:pointer}fw-icon.actionable:hover{color:var(--primary-base);background-color:var(--primary-hover);border-radius:50%}.small{height:30px}.small>fw-icon{font-size:18px}.medium{height:36px}.medium>fw-icon{font-size:20px}.large{height:40px}.large>fw-icon{font-size:24px}:host.errored .input-container,:host.ng-touched.ng-invalid .input-container{border:1px solid var(--red-base)}:host.errored .error-icon,:host.ng-touched.ng-invalid .error-icon{color:var(--red-base);display:inline!important}:host.errored .helper-text,:host.errored .full-container .error-text,:host.ng-touched.ng-invalid .helper-text,:host.ng-touched.ng-invalid .full-container .error-text{display:none}:host.errored .error-text,:host.ng-touched.ng-invalid .error-text{display:block!important}:disabled{opacity:.4;cursor:not-allowed}\n"] }]
|
|
62
62
|
}], propDecorators: { disabled: [{
|
|
63
63
|
type: Input
|
|
64
64
|
}], useActionableIcons: [{
|
|
@@ -99,4 +99,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
99
99
|
}], value: [{
|
|
100
100
|
type: Input
|
|
101
101
|
}] } });
|
|
102
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
102
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0ZS1pbnB1dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9kYXRlLWlucHV0L2RhdGUtaW5wdXQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvZGF0ZS1pbnB1dC9kYXRlLWlucHV0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3BGLE9BQU8sRUFBcUMsaUJBQWlCLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7OztBQWN0RixNQUFNLE9BQU8sb0JBQW9CO0lBVmpDO1FBWVcsYUFBUSxHQUFhLEtBQUssQ0FBQztRQUMzQix1QkFBa0IsR0FBYSxLQUFLLENBQUM7UUFFcEMsbUJBQWMsR0FBd0IsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUloRSxnQkFBVyxHQUFZLFlBQVksQ0FBQztRQUVwQyxTQUFJLEdBQWtDLFFBQVEsQ0FBQztRQUMvQyxTQUFJLEdBQXdDLE1BQU0sQ0FBQztRQU01RCxvRkFBb0Y7UUFDN0MsVUFBSyxHQUFhLEtBQUssQ0FBQztRQUcvRCxvQkFBZSxHQUFnQixJQUFJLENBQUM7UUFFN0IsWUFBTyxHQUFHLEdBQVMsRUFBRTtRQUM1QixDQUFDLENBQUM7UUFDRiw2REFBNkQ7UUFDdEQsYUFBUSxHQUFHLENBQUMsS0FBYSxFQUFRLEVBQUU7UUFDMUMsQ0FBQyxDQUFDO0tBa0NIO0lBaENDLFVBQVUsQ0FBQyxHQUFXO1FBQ3BCLElBQUksQ0FBQyxLQUFLLEdBQUcsR0FBRyxDQUFDO0lBQ25CLENBQUM7SUFFRCw4REFBOEQ7SUFDOUQsZ0JBQWdCLENBQUMsRUFBTztRQUN0QixJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsQ0FBQztJQUNyQixDQUFDO0lBRUQsOERBQThEO0lBQzlELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLE9BQU8sR0FBRyxFQUFFLENBQUM7SUFDcEIsQ0FBQztJQUVELGdCQUFnQixDQUFDLFVBQW1CO1FBQ2xDLElBQUksQ0FBQyxRQUFRLEdBQUcsVUFBVSxDQUFDO0lBQzdCLENBQUM7SUFFRCxhQUFhLENBQUMsS0FBWTtRQUN4QixJQUFJLENBQUMsS0FBSyxHQUFJLEtBQUssQ0FBQyxNQUEyQixDQUFDLEtBQUssQ0FBQztRQUN0RCxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUMxQixJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7SUFDakIsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7SUFDakIsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQzdCLENBQUM7O2lIQTVEVSxvQkFBb0I7cUdBQXBCLG9CQUFvQixnZ0JBTnBCLENBQUM7WUFDVixPQUFPLEVBQUUsaUJBQWlCO1lBQzFCLFdBQVcsRUFBRSxvQkFBb0I7WUFDakMsS0FBSyxFQUFFLElBQUk7U0FDWixDQUFDLDBCQ2JKLHU5QkE0QkE7MkZEYmEsb0JBQW9CO2tCQVZoQyxTQUFTOytCQUNFLGVBQWUsYUFHZCxDQUFDOzRCQUNWLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsc0JBQXNCOzRCQUNqQyxLQUFLLEVBQUUsSUFBSTt5QkFDWixDQUFDOzhCQUlPLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csa0JBQWtCO3NCQUExQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0ksY0FBYztzQkFBdkIsTUFBTTtnQkFDRSxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLEdBQUc7c0JBQVgsS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFFaUMsS0FBSztzQkFBM0MsV0FBVzt1QkFBQyxlQUFlOztzQkFBRyxLQUFLO2dCQUUzQixLQUFLO3NCQUFiLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSG9zdEJpbmRpbmcsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBGb3JtQ29udHJvbCwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbmltcG9ydCB7IEljb25UeXBlIH0gZnJvbSAnLi4vaWNvbi9pY29uLnR5cGVzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZnctZGF0ZS1pbnB1dCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9kYXRlLWlucHV0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZGF0ZS1pbnB1dC5jb21wb25lbnQuc2NzcyddLFxuICBwcm92aWRlcnM6IFt7XG4gICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgdXNlRXhpc3Rpbmc6IEZ3RGF0ZUlucHV0Q29tcG9uZW50LFxuICAgIG11bHRpOiB0cnVlLFxuICB9XSxcbn0pXG5leHBvcnQgY2xhc3MgRndEYXRlSW5wdXRDb21wb25lbnQgaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciB7XG5cbiAgQElucHV0KCkgZGlzYWJsZWQ/OiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHVzZUFjdGlvbmFibGVJY29ucz86IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgbGVmdEljb24/OiBJY29uVHlwZTtcbiAgQE91dHB1dCgpIGxlZnRJY29uQWN0aW9uPzogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuICBASW5wdXQoKSBwcmVmaXg/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGhlbHBlclRleHQ/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGVycm9yVGV4dD86IHN0cmluZztcbiAgQElucHV0KCkgcGxhY2Vob2xkZXI/OiBzdHJpbmcgPSAnbW0vZGQveXl5eSc7XG4gIEBJbnB1dCgpIHJlYWRPbmx5PzogYm9vbGVhbjtcbiAgQElucHV0KCkgc2l6ZT86ICdzbWFsbCcgfCAnbWVkaXVtJyB8ICdsYXJnZScgPSAnbWVkaXVtJztcbiAgQElucHV0KCkgdHlwZT86ICdkYXRlJyB8ICd0aW1lJyB8ICdkYXRldGltZS1sb2NhbCcgPSAnZGF0ZSc7XG4gIEBJbnB1dCgpIG1heD86IHN0cmluZztcbiAgQElucHV0KCkgbWluPzogc3RyaW5nO1xuICBASW5wdXQoKSBzdGVwPzogbnVtYmVyO1xuICBASW5wdXQoKSBhdXRvZm9jdXM/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGF1dG9jb21wbGV0ZT86IHN0cmluZztcbiAgLy8gd2UgYmluZCB0aGlzIHRvIGhvc3QgYmVjYXVzZSB0aGF0J3Mgd2hlcmUgYW5ndWxhciBmb3JtIGFwaXMgcHV0IHRoZSBlcnJvciBjbGFzc2VzXG4gIEBIb3N0QmluZGluZygnY2xhc3MuZXJyb3JlZCcpIEBJbnB1dCgpIGVycm9yPzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpIHZhbHVlOiBzdHJpbmc7XG4gIGV4dGVybmFsQ29udHJvbDogRm9ybUNvbnRyb2wgPSBudWxsO1xuXG4gIHB1YmxpYyBvblRvdWNoID0gKCk6IHZvaWQgPT4ge1xuICB9O1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLXVudXNlZC12YXJzXG4gIHB1YmxpYyBvbkNoYW5nZSA9ICh2YWx1ZTogc3RyaW5nKTogdm9pZCA9PiB7XG4gIH07XG5cbiAgd3JpdGVWYWx1ZShvYmo6IHN0cmluZyk6IHZvaWQge1xuICAgIHRoaXMudmFsdWUgPSBvYmo7XG4gIH1cblxuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueVxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLm9uQ2hhbmdlID0gZm47XG4gIH1cblxuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueVxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XG4gICAgdGhpcy5vblRvdWNoID0gZm47XG4gIH1cblxuICBzZXREaXNhYmxlZFN0YXRlKGlzRGlzYWJsZWQ6IGJvb2xlYW4pOiB2b2lkIHtcbiAgICB0aGlzLmRpc2FibGVkID0gaXNEaXNhYmxlZDtcbiAgfVxuXG4gIGNoYW5nZUhhbmRsZXIoZXZlbnQ6IEV2ZW50KTogdm9pZCB7XG4gICAgdGhpcy52YWx1ZSA9IChldmVudC50YXJnZXQgYXMgSFRNTElucHV0RWxlbWVudCkudmFsdWU7XG4gICAgdGhpcy5vbkNoYW5nZSh0aGlzLnZhbHVlKTtcbiAgICB0aGlzLm9uVG91Y2goKTtcbiAgfVxuXG4gIGJsdXJIYW5kbGVyKCk6IHZvaWQge1xuICAgIHRoaXMub25Ub3VjaCgpO1xuICB9XG5cbiAgb25MZWZ0SWNvbkNsaWNrKCk6IHZvaWQge1xuICAgIHRoaXMubGVmdEljb25BY3Rpb24uZW1pdCgpO1xuICB9XG5cbn1cbiIsIjxkaXYgY2xhc3M9XCJmdWxsLWNvbnRhaW5lclwiPlxuICA8ZGl2IGNsYXNzPVwiaW5wdXQtY29udGFpbmVyXCIgW2NsYXNzXT1cInNpemVcIj5cbiAgICA8ZnctaWNvblxuICAgICAgKm5nSWY9XCIhIWxlZnRJY29uXCJcbiAgICAgIChjbGljayk9XCJ1c2VBY3Rpb25hYmxlSWNvbnM/b25MZWZ0SWNvbkNsaWNrKCk6bnVsbFwiXG4gICAgICBbbmdDbGFzc109XCJ1c2VBY3Rpb25hYmxlSWNvbnM/J2FjdGlvbmFibGUnOicnXCI+XG4gICAgICB7eyBsZWZ0SWNvbiB9fVxuICAgIDwvZnctaWNvbj5cbiAgICA8cCBjbGFzcz1cImNvbnRleHRcIiAqbmdJZj1cIiEhcHJlZml4XCI+e3sgcHJlZml4IH19PC9wPlxuICAgIDxpbnB1dFxuICAgICAgW3R5cGVdPVwidHlwZVwiXG4gICAgICAoa2V5dXApPVwiY2hhbmdlSGFuZGxlcigkZXZlbnQpXCJcbiAgICAgIChibHVyKT1cImJsdXJIYW5kbGVyKClcIlxuICAgICAgKGNoYW5nZSk9XCJjaGFuZ2VIYW5kbGVyKCRldmVudClcIlxuICAgICAgW3ZhbHVlXT1cInZhbHVlXCJcbiAgICAgIFttYXhdPVwibWF4XCJcbiAgICAgIFttaW5dPVwibWluXCJcbiAgICAgIFtzdGVwXT1cInN0ZXBcIlxuICAgICAgW3BsYWNlaG9sZGVyXT1cInBsYWNlaG9sZGVyIHx8ICcnXCJcbiAgICAgIFtyZWFkT25seV09XCJyZWFkT25seVwiXG4gICAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICAgICAgW2F1dG9mb2N1c109XCJhdXRvZm9jdXNcIlxuICAgICAgW2F1dG9jb21wbGV0ZV09XCJhdXRvY29tcGxldGVcIj5cbiAgICA8ZnctaWNvbiBjbGFzcz1cImVycm9yLWljb25cIj53YXJuaW5nLWNpcmNsZTwvZnctaWNvbj5cbiAgPC9kaXY+XG4gIDxwIGNsYXNzPVwiaGVscGVyLXRleHRcIiAqbmdJZj1cIiEhaGVscGVyVGV4dFwiPnt7IGhlbHBlclRleHQgfX08L3A+XG4gIDxwIGNsYXNzPVwiZXJyb3ItdGV4dFwiICpuZ0lmPVwiISFlcnJvclRleHRcIj57eyBlcnJvclRleHQgfX08L3A+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -7,13 +7,15 @@ export class FwLayoutPanelComponent {
|
|
|
7
7
|
this.fitted = false;
|
|
8
8
|
this.border = 'none';
|
|
9
9
|
this.rounded = true;
|
|
10
|
+
this.margin = false;
|
|
11
|
+
this.padded = true;
|
|
10
12
|
}
|
|
11
13
|
}
|
|
12
14
|
FwLayoutPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwLayoutPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13
|
-
FwLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwLayoutPanelComponent, selector: "fw-layout-panel", inputs: { height: "height", fitted: "fitted", border: "border", rounded: "rounded" }, ngImport: i0, template: "<main\n [ngClass]=\"[fitted?'fitted':'', rounded?'rounded':'', 'border-'+border]\"\n [ngStyle]=\"{height: height}\">\n <ng-content select=\"header\"></ng-content>\n <article>\n <ng-content></ng-content>\n </article>\n <ng-content select=\"footer\"></ng-content>\n</main>\n", styles: ["main{display:flex;flex-direction:column;
|
|
15
|
+
FwLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwLayoutPanelComponent, selector: "fw-layout-panel", inputs: { height: "height", fitted: "fitted", border: "border", rounded: "rounded", margin: "margin", padded: "padded" }, ngImport: i0, template: "<main\n [ngClass]=\"[fitted?'fitted':'', margin?'margin':'', rounded?'rounded':'', 'border-'+border]\"\n [ngStyle]=\"{height: height}\">\n <ng-content select=\"header\"></ng-content>\n <article [ngClass]=\"[padded?'padded':'']\">\n <ng-content></ng-content>\n </article>\n <ng-content select=\"footer\"></ng-content>\n</main>\n", styles: ["main{flex:1;display:flex;flex-direction:column;overflow:auto;background-color:var(--card-background);position:relative}main.margin{margin:16px}main header{background-color:var(--card-header);display:flex;align-items:center;gap:16px;padding:8px 16px;height:52px;white-space:nowrap;box-sizing:border-box;border-bottom:1px var(--separations-divider) solid}main header :first-child{flex:1;margin:0;overflow:hidden}main article{overflow-x:auto;display:flex;flex-direction:column}main article.padded{padding:16px}main article hr{border:0;border-bottom:1px var(--separations-divider) solid;width:calc(100% + 32px);margin:16px -16px}main footer{background-color:var(--card-background);display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:16px;height:66px;white-space:nowrap;box-sizing:border-box;border-top:1px var(--separations-divider) solid;overflow:hidden}main footer h1,main footer h2,main footer h3,main footer h4,main footer h5,main footer h6,main footer p{margin:0}main.border-all{border:1px var(--separations-divider) solid}main.border-left{border-left:1px var(--separations-divider) solid}main.border-right{border-right:1px var(--separations-divider) solid}main.rounded{border-radius:10px}main.fitted{overflow:hidden}main.fitted header{position:absolute;top:0;left:0;right:0}main.fitted header~article{margin-top:52px}main.fitted article:has(+ footer){margin-bottom:66px}main.fitted footer{position:absolute;bottom:0;left:0;right:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
14
16
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwLayoutPanelComponent, decorators: [{
|
|
15
17
|
type: Component,
|
|
16
|
-
args: [{ selector: 'fw-layout-panel', encapsulation: ViewEncapsulation.None, template: "<main\n [ngClass]=\"[fitted?'fitted':'', rounded?'rounded':'', 'border-'+border]\"\n [ngStyle]=\"{height: height}\">\n <ng-content select=\"header\"></ng-content>\n <article>\n <ng-content></ng-content>\n </article>\n <ng-content select=\"footer\"></ng-content>\n</main>\n", styles: ["main{display:flex;flex-direction:column;
|
|
18
|
+
args: [{ selector: 'fw-layout-panel', encapsulation: ViewEncapsulation.None, template: "<main\n [ngClass]=\"[fitted?'fitted':'', margin?'margin':'', rounded?'rounded':'', 'border-'+border]\"\n [ngStyle]=\"{height: height}\">\n <ng-content select=\"header\"></ng-content>\n <article [ngClass]=\"[padded?'padded':'']\">\n <ng-content></ng-content>\n </article>\n <ng-content select=\"footer\"></ng-content>\n</main>\n", styles: ["main{flex:1;display:flex;flex-direction:column;overflow:auto;background-color:var(--card-background);position:relative}main.margin{margin:16px}main header{background-color:var(--card-header);display:flex;align-items:center;gap:16px;padding:8px 16px;height:52px;white-space:nowrap;box-sizing:border-box;border-bottom:1px var(--separations-divider) solid}main header :first-child{flex:1;margin:0;overflow:hidden}main article{overflow-x:auto;display:flex;flex-direction:column}main article.padded{padding:16px}main article hr{border:0;border-bottom:1px var(--separations-divider) solid;width:calc(100% + 32px);margin:16px -16px}main footer{background-color:var(--card-background);display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:16px;height:66px;white-space:nowrap;box-sizing:border-box;border-top:1px var(--separations-divider) solid;overflow:hidden}main footer h1,main footer h2,main footer h3,main footer h4,main footer h5,main footer h6,main footer p{margin:0}main.border-all{border:1px var(--separations-divider) solid}main.border-left{border-left:1px var(--separations-divider) solid}main.border-right{border-right:1px var(--separations-divider) solid}main.rounded{border-radius:10px}main.fitted{overflow:hidden}main.fitted header{position:absolute;top:0;left:0;right:0}main.fitted header~article{margin-top:52px}main.fitted article:has(+ footer){margin-bottom:66px}main.fitted footer{position:absolute;bottom:0;left:0;right:0}\n"] }]
|
|
17
19
|
}], propDecorators: { height: [{
|
|
18
20
|
type: Input
|
|
19
21
|
}], fitted: [{
|
|
@@ -22,5 +24,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
22
24
|
type: Input
|
|
23
25
|
}], rounded: [{
|
|
24
26
|
type: Input
|
|
27
|
+
}], margin: [{
|
|
28
|
+
type: Input
|
|
29
|
+
}], padded: [{
|
|
30
|
+
type: Input
|
|
25
31
|
}] } });
|
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
32
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFuZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvbGF5b3V0cy9wYW5lbC9wYW5lbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9sYXlvdXRzL3BhbmVsL3BhbmVsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFRcEUsTUFBTSxPQUFPLHNCQUFzQjtJQU5uQztRQU9XLFdBQU0sR0FBWSxNQUFNLENBQUM7UUFDekIsV0FBTSxHQUFhLEtBQUssQ0FBQztRQUN6QixXQUFNLEdBQXVDLE1BQU0sQ0FBQztRQUNwRCxZQUFPLEdBQWEsSUFBSSxDQUFDO1FBQ3pCLFdBQU0sR0FBYSxLQUFLLENBQUM7UUFDekIsV0FBTSxHQUFhLElBQUksQ0FBQztLQUNsQzs7bUhBUFksc0JBQXNCO3VHQUF0QixzQkFBc0IsaUxDUm5DLGtWQVNBOzJGRERhLHNCQUFzQjtrQkFObEMsU0FBUzsrQkFDRSxpQkFBaUIsaUJBR1osaUJBQWlCLENBQUMsSUFBSTs4QkFHNUIsTUFBTTtzQkFBZCxLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmdy1sYXlvdXQtcGFuZWwnLFxuICB0ZW1wbGF0ZVVybDogJy4vcGFuZWwuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9wYW5lbC5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxufSlcbmV4cG9ydCBjbGFzcyBGd0xheW91dFBhbmVsQ29tcG9uZW50IHtcbiAgQElucHV0KCkgaGVpZ2h0Pzogc3RyaW5nID0gJzEwMCUnO1xuICBASW5wdXQoKSBmaXR0ZWQ/OiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIGJvcmRlcj86ICdhbGwnIHwgJ2xlZnQnIHwgJ3JpZ2h0JyB8ICdub25lJyA9ICdub25lJztcbiAgQElucHV0KCkgcm91bmRlZD86IGJvb2xlYW4gPSB0cnVlO1xuICBASW5wdXQoKSBtYXJnaW4/OiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHBhZGRlZD86IGJvb2xlYW4gPSB0cnVlO1xufVxuIiwiPG1haW5cbiAgW25nQ2xhc3NdPVwiW2ZpdHRlZD8nZml0dGVkJzonJywgbWFyZ2luPydtYXJnaW4nOicnLCByb3VuZGVkPydyb3VuZGVkJzonJywgJ2JvcmRlci0nK2JvcmRlcl1cIlxuICBbbmdTdHlsZV09XCJ7aGVpZ2h0OiBoZWlnaHR9XCI+XG4gIDxuZy1jb250ZW50IHNlbGVjdD1cImhlYWRlclwiPjwvbmctY29udGVudD5cbiAgPGFydGljbGUgW25nQ2xhc3NdPVwiW3BhZGRlZD8ncGFkZGVkJzonJ11cIj5cbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvYXJ0aWNsZT5cbiAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiZm9vdGVyXCI+PC9uZy1jb250ZW50PlxuPC9tYWluPlxuIl19
|
|
@@ -5,15 +5,15 @@ export class FwLayoutSidebarComponent {
|
|
|
5
5
|
constructor() {
|
|
6
6
|
this.outlined = true;
|
|
7
7
|
this.rounded = true;
|
|
8
|
-
this.width = '
|
|
8
|
+
this.width = '65%';
|
|
9
9
|
this.direction = 'row';
|
|
10
10
|
}
|
|
11
11
|
}
|
|
12
12
|
FwLayoutSidebarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwLayoutSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13
|
-
FwLayoutSidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwLayoutSidebarComponent, selector: "fw-layout-sidebar", inputs: { outlined: "outlined", rounded: "rounded", width: "width", direction: "direction" }, ngImport: i0, template: "<div\n [ngClass]=\"[\n outlined?'outlined':'',\n rounded?'rounded':'',\n
|
|
13
|
+
FwLayoutSidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwLayoutSidebarComponent, selector: "fw-layout-sidebar", inputs: { outlined: "outlined", rounded: "rounded", width: "width", direction: "direction" }, ngImport: i0, template: "<div\n [ngClass]=\"[\n outlined?'outlined':'',\n rounded?'rounded':'',\n direction,\n 'container'\n ]\">\n <div class=\"main\" [ngStyle]=\"{width: 'calc( 100% - '+width+' )'}\">\n <ng-content></ng-content>\n </div>\n <div class=\"aside\" [ngStyle]=\"{width: width}\">\n <ng-content select=\"aside\"></ng-content>\n </div>\n</div>\n", styles: [".container{display:flex;width:100%;overflow:hidden;height:100%;flex-flow:row nowrap}.container .aside{display:flex;overflow:auto}.container .aside aside{flex:1}.container .main{overflow:auto}.container.outlined{border:1px var(--separations-divider) solid}.container.outlined .main{border-right:1px var(--separations-divider) solid}.container.row-reverse{flex-direction:row-reverse}.container.row-reverse.outlined .main{border-right:0;border-left:1px var(--separations-divider) solid}.container.rounded{border-radius:10px}.container.third .main{width:66.6%}.container.third .aside{width:33.3%}.container.half .main,.container.half .aside{width:50%}.container.fourth .main{width:75%}.container.fourth .aside{width:25%}.container.closed .main{width:100%;border-right:none}.container.closed .aside{width:0;padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
14
14
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwLayoutSidebarComponent, decorators: [{
|
|
15
15
|
type: Component,
|
|
16
|
-
args: [{ selector: 'fw-layout-sidebar', encapsulation: ViewEncapsulation.None, template: "<div\n [ngClass]=\"[\n outlined?'outlined':'',\n rounded?'rounded':'',\n
|
|
16
|
+
args: [{ selector: 'fw-layout-sidebar', encapsulation: ViewEncapsulation.None, template: "<div\n [ngClass]=\"[\n outlined?'outlined':'',\n rounded?'rounded':'',\n direction,\n 'container'\n ]\">\n <div class=\"main\" [ngStyle]=\"{width: 'calc( 100% - '+width+' )'}\">\n <ng-content></ng-content>\n </div>\n <div class=\"aside\" [ngStyle]=\"{width: width}\">\n <ng-content select=\"aside\"></ng-content>\n </div>\n</div>\n", styles: [".container{display:flex;width:100%;overflow:hidden;height:100%;flex-flow:row nowrap}.container .aside{display:flex;overflow:auto}.container .aside aside{flex:1}.container .main{overflow:auto}.container.outlined{border:1px var(--separations-divider) solid}.container.outlined .main{border-right:1px var(--separations-divider) solid}.container.row-reverse{flex-direction:row-reverse}.container.row-reverse.outlined .main{border-right:0;border-left:1px var(--separations-divider) solid}.container.rounded{border-radius:10px}.container.third .main{width:66.6%}.container.third .aside{width:33.3%}.container.half .main,.container.half .aside{width:50%}.container.fourth .main{width:75%}.container.fourth .aside{width:25%}.container.closed .main{width:100%;border-right:none}.container.closed .aside{width:0;padding:0}\n"] }]
|
|
17
17
|
}], propDecorators: { outlined: [{
|
|
18
18
|
type: Input
|
|
19
19
|
}], rounded: [{
|
|
@@ -23,4 +23,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
23
23
|
}], direction: [{
|
|
24
24
|
type: Input
|
|
25
25
|
}] } });
|
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9sYXlvdXRzL3NpZGViYXIvc2lkZWJhci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9sYXlvdXRzL3NpZGViYXIvc2lkZWJhci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUXBFLE1BQU0sT0FBTyx3QkFBd0I7SUFOckM7UUFPVyxhQUFRLEdBQVksSUFBSSxDQUFDO1FBQ3pCLFlBQU8sR0FBWSxJQUFJLENBQUM7UUFDeEIsVUFBSyxHQUFZLEtBQUssQ0FBQztRQUN2QixjQUFTLEdBQTJCLEtBQUssQ0FBQztLQUNwRDs7cUhBTFksd0JBQXdCO3lHQUF4Qix3QkFBd0IsdUpDUnJDLDJYQWNBOzJGRE5hLHdCQUF3QjtrQkFOcEMsU0FBUzsrQkFDRSxtQkFBbUIsaUJBR2QsaUJBQWlCLENBQUMsSUFBSTs4QkFHNUIsUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmdy1sYXlvdXQtc2lkZWJhcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9zaWRlYmFyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc2lkZWJhci5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxufSlcbmV4cG9ydCBjbGFzcyBGd0xheW91dFNpZGViYXJDb21wb25lbnQge1xuICBASW5wdXQoKSBvdXRsaW5lZDogYm9vbGVhbiA9IHRydWU7XG4gIEBJbnB1dCgpIHJvdW5kZWQ6IGJvb2xlYW4gPSB0cnVlO1xuICBASW5wdXQoKSB3aWR0aD86IHN0cmluZyA9ICc2NSUnO1xuICBASW5wdXQoKSBkaXJlY3Rpb24/OiAncm93JyB8ICdyb3ctcmV2ZXJzZScgPSAncm93Jztcbn1cbiIsIjxkaXZcbiAgW25nQ2xhc3NdPVwiW1xuICAgICAgICBvdXRsaW5lZD8nb3V0bGluZWQnOicnLFxuICAgICAgICByb3VuZGVkPydyb3VuZGVkJzonJyxcbiAgICAgICAgZGlyZWN0aW9uLFxuICAgICAgICAnY29udGFpbmVyJ1xuICAgICAgICBdXCI+XG4gIDxkaXYgY2xhc3M9XCJtYWluXCIgW25nU3R5bGVdPVwie3dpZHRoOiAnY2FsYyggMTAwJSAtICcrd2lkdGgrJyApJ31cIj5cbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvZGl2PlxuICA8ZGl2IGNsYXNzPVwiYXNpZGVcIiBbbmdTdHlsZV09XCJ7d2lkdGg6IHdpZHRofVwiPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImFzaWRlXCI+PC9uZy1jb250ZW50PlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
|