@design-system-rte/angular 0.12.0 → 0.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/badge/badge.component.mjs +8 -7
- package/esm2022/lib/components/badge/badge.directive.mjs +4 -4
- package/esm2022/lib/components/banner/banner.component.mjs +65 -0
- package/esm2022/lib/components/button/button.component.mjs +2 -2
- package/esm2022/lib/components/icon/icon.component.mjs +3 -3
- package/esm2022/lib/components/popover/popover.component.mjs +62 -0
- package/esm2022/lib/components/popover/popover.directive.mjs +147 -0
- package/esm2022/lib/components/segmented-control/segmented-control.component.mjs +6 -3
- package/esm2022/lib/components/tooltip/tooltip.component.mjs +2 -2
- package/esm2022/lib/components/tooltip/tooltip.directive.mjs +2 -2
- package/esm2022/lib/services/overlay.service.mjs +1 -9
- package/esm2022/public-api.mjs +3 -1
- package/fesm2022/design-system-rte-angular.mjs +278 -28
- package/fesm2022/design-system-rte-angular.mjs.map +1 -1
- package/lib/components/badge/badge.component.d.ts +5 -4
- package/lib/components/badge/badge.directive.d.ts +3 -3
- package/lib/components/banner/banner.component.d.ts +24 -0
- package/lib/components/divider/divider.component.d.ts +1 -1
- package/lib/components/popover/popover.component.d.ts +29 -0
- package/lib/components/popover/popover.directive.d.ts +41 -0
- package/lib/components/segmented-control/segmented-control.component.d.ts +2 -0
- package/lib/components/text-input/text-input.component.d.ts +1 -1
- package/lib/components/tooltip/tooltip.component.d.ts +3 -2
- package/package.json +2 -2
- package/public-api.d.ts +2 -0
|
@@ -9,18 +9,19 @@ export class BadgeComponent {
|
|
|
9
9
|
constructor() {
|
|
10
10
|
this.badgeType = input("brand");
|
|
11
11
|
this.badgeSize = input("m");
|
|
12
|
-
this.
|
|
12
|
+
this.badgeContent = input("number");
|
|
13
13
|
this.count = input();
|
|
14
14
|
this.icon = input("notification");
|
|
15
|
+
this.simpleBadge = input(false);
|
|
15
16
|
this.isValidIconName = computed(() => isValidIconName(this.icon()));
|
|
16
17
|
this.showIcon = computed(() => getShowIcon({
|
|
17
18
|
size: this.badgeSize(),
|
|
18
|
-
|
|
19
|
+
content: this.badgeContent(),
|
|
19
20
|
iconSize: this.iconSize(),
|
|
20
21
|
}));
|
|
21
22
|
this.showText = computed(() => getShowText({
|
|
22
23
|
size: this.badgeSize(),
|
|
23
|
-
|
|
24
|
+
content: this.badgeContent(),
|
|
24
25
|
count: this.count(),
|
|
25
26
|
}));
|
|
26
27
|
this.displayCount = computed(() => getDisplayCount(this.count()));
|
|
@@ -28,16 +29,16 @@ export class BadgeComponent {
|
|
|
28
29
|
this.iconSize = computed(() => getBadgeIconSize(this.badgeSize()));
|
|
29
30
|
this.showBadge = computed(() => getShowBadge({
|
|
30
31
|
size: this.badgeSize(),
|
|
31
|
-
|
|
32
|
+
content: this.badgeContent(),
|
|
32
33
|
count: this.count(),
|
|
33
34
|
iconSize: this.iconSize(),
|
|
34
35
|
}));
|
|
35
36
|
}
|
|
36
37
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
37
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: BadgeComponent, isStandalone: true, selector: "rte-badge", inputs: { badgeType: { classPropertyName: "badgeType", publicName: "badgeType", isSignal: true, isRequired: false, transformFunction: null }, badgeSize: { classPropertyName: "badgeSize", publicName: "badgeSize", isSignal: true, isRequired: false, transformFunction: null },
|
|
38
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: BadgeComponent, isStandalone: true, selector: "rte-badge", inputs: { badgeType: { classPropertyName: "badgeType", publicName: "badgeType", isSignal: true, isRequired: false, transformFunction: null }, badgeSize: { classPropertyName: "badgeSize", publicName: "badgeSize", isSignal: true, isRequired: false, transformFunction: null }, badgeContent: { classPropertyName: "badgeContent", publicName: "badgeContent", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, simpleBadge: { classPropertyName: "simpleBadge", publicName: "simpleBadge", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n class=\"badge size-{{ badgeSize() }} type-{{ badgeType() }}\"\n data-testid=\"badge\"\n [attr.data-simple-badge]=\"simpleBadge()\"\n [ngClass]=\"{ hidden: !showBadge(), 'count-overflow': countOverflow() }\"\n>\n <rte-icon\n *ngIf=\"showIcon()\"\n class=\"badge-icon\"\n [name]=\"icon()\"\n [size]=\"iconSize()!\"\n />\n <span *ngIf=\"showText()\" class=\"badge-text\">\n {{ displayCount() }}\n </span>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.badge{position:absolute;border-radius:999px;display:flex;align-items:center;justify-content:center;transition:opacity .15s ease-in-out;box-sizing:border-box}.badge.hidden{opacity:0}.badge.type-brand{box-shadow:0 2px 4px 0 var(--elevation-shadow-key-brand),0 0 2px 0 var(--elevation-shadow-ambient-brand);background:linear-gradient(0deg,var(--elevation-surface-shadow-2) 0%,var(--elevation-surface-shadow-2) 100%);background-color:var(--background-brand-default);color:var(--content-primary-inverse)}.badge.type-neutral{box-shadow:0 2px 4px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-2) 0%,var(--elevation-surface-shadow-2) 100%);background-color:var(--background-neutral-regular-default);color:var(--content-secondary)}.badge.type-indicator{box-shadow:0 2px 4px 0 var(--elevation-shadow-key-brand),0 0 2px 0 var(--elevation-shadow-ambient-brand);background:linear-gradient(0deg,var(--elevation-surface-shadow-2) 0%,var(--elevation-surface-shadow-2) 100%);background-color:var(--background-danger-default);color:var(--content-primary-inverse)}.badge.size-xs{width:6px;height:6px;box-shadow:none;top:0;right:0}.badge.size-s{width:12px;height:12px;top:-3px;right:-3px}.badge.size-m{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:700;font-size:12px;line-height:16px;letter-spacing:0px;min-width:16px;width:fit-content;height:16px;top:-4px;right:-4px;padding:0 2px}.badge.size-m.count-overflow{padding:0 4px}.badge.size-l{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:700;font-size:16px;line-height:24px;letter-spacing:0px;min-width:24px;width:fit-content;height:24px;top:-8px;right:-8px;padding:0 4px}.badge.size-l.count-overflow{padding:0 6px}.badge[data-simple-badge=true]{position:static;box-shadow:none}.badge .badge-text{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "rte-icon", inputs: ["name", "size", "color", "classes", "appearance"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
38
39
|
}
|
|
39
40
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
40
41
|
type: Component,
|
|
41
|
-
args: [{ selector: "rte-badge", imports: [CommonModule, IconComponent], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n
|
|
42
|
+
args: [{ selector: "rte-badge", imports: [CommonModule, IconComponent], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"badge size-{{ badgeSize() }} type-{{ badgeType() }}\"\n data-testid=\"badge\"\n [attr.data-simple-badge]=\"simpleBadge()\"\n [ngClass]=\"{ hidden: !showBadge(), 'count-overflow': countOverflow() }\"\n>\n <rte-icon\n *ngIf=\"showIcon()\"\n class=\"badge-icon\"\n [name]=\"icon()\"\n [size]=\"iconSize()!\"\n />\n <span *ngIf=\"showText()\" class=\"badge-text\">\n {{ displayCount() }}\n </span>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.badge{position:absolute;border-radius:999px;display:flex;align-items:center;justify-content:center;transition:opacity .15s ease-in-out;box-sizing:border-box}.badge.hidden{opacity:0}.badge.type-brand{box-shadow:0 2px 4px 0 var(--elevation-shadow-key-brand),0 0 2px 0 var(--elevation-shadow-ambient-brand);background:linear-gradient(0deg,var(--elevation-surface-shadow-2) 0%,var(--elevation-surface-shadow-2) 100%);background-color:var(--background-brand-default);color:var(--content-primary-inverse)}.badge.type-neutral{box-shadow:0 2px 4px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-2) 0%,var(--elevation-surface-shadow-2) 100%);background-color:var(--background-neutral-regular-default);color:var(--content-secondary)}.badge.type-indicator{box-shadow:0 2px 4px 0 var(--elevation-shadow-key-brand),0 0 2px 0 var(--elevation-shadow-ambient-brand);background:linear-gradient(0deg,var(--elevation-surface-shadow-2) 0%,var(--elevation-surface-shadow-2) 100%);background-color:var(--background-danger-default);color:var(--content-primary-inverse)}.badge.size-xs{width:6px;height:6px;box-shadow:none;top:0;right:0}.badge.size-s{width:12px;height:12px;top:-3px;right:-3px}.badge.size-m{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:700;font-size:12px;line-height:16px;letter-spacing:0px;min-width:16px;width:fit-content;height:16px;top:-4px;right:-4px;padding:0 2px}.badge.size-m.count-overflow{padding:0 4px}.badge.size-l{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:700;font-size:16px;line-height:24px;letter-spacing:0px;min-width:24px;width:fit-content;height:24px;top:-8px;right:-8px;padding:0 4px}.badge.size-l.count-overflow{padding:0 6px}.badge[data-simple-badge=true]{position:static;box-shadow:none}.badge .badge-text{margin:0}\n"] }]
|
|
42
43
|
}] });
|
|
43
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
44
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBRSx1QkFBdUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUVwRixPQUFPLEVBQ0wsZ0JBQWdCLEVBQ2hCLGVBQWUsRUFDZixZQUFZLEVBQ1osV0FBVyxFQUNYLFdBQVcsR0FDWixNQUFNLHNEQUFzRCxDQUFDO0FBRTlELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQztBQUNuRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7OztBQVV2RCxNQUFNLE9BQU8sY0FBYztJQVIzQjtRQVNXLGNBQVMsR0FBRyxLQUFLLENBQVksT0FBTyxDQUFDLENBQUM7UUFDdEMsY0FBUyxHQUFHLEtBQUssQ0FBWSxHQUFHLENBQUMsQ0FBQztRQUNsQyxpQkFBWSxHQUFHLEtBQUssQ0FBZSxRQUFRLENBQUMsQ0FBQztRQUM3QyxVQUFLLEdBQUcsS0FBSyxFQUFzQixDQUFDO1FBQ3BDLFNBQUksR0FBRyxLQUFLLENBQVMsY0FBYyxDQUFDLENBQUM7UUFDckMsZ0JBQVcsR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFFcEMsb0JBQWUsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFFL0QsYUFBUSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FDaEMsV0FBVyxDQUFDO1lBQ1YsSUFBSSxFQUFFLElBQUksQ0FBQyxTQUFTLEVBQUU7WUFDdEIsT0FBTyxFQUFFLElBQUksQ0FBQyxZQUFZLEVBQUU7WUFDNUIsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRLEVBQUU7U0FDMUIsQ0FBQyxDQUNILENBQUM7UUFFTyxhQUFRLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUNoQyxXQUFXLENBQUM7WUFDVixJQUFJLEVBQUUsSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUN0QixPQUFPLEVBQUUsSUFBSSxDQUFDLFlBQVksRUFBRTtZQUM1QixLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRTtTQUNwQixDQUFDLENBQ0gsQ0FBQztRQUVPLGlCQUFZLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBQzdELGtCQUFhLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsSUFBSSxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFDO1FBQ2xGLGFBQVEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUU5RCxjQUFTLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUNqQyxZQUFZLENBQUM7WUFDWCxJQUFJLEVBQUUsSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUN0QixPQUFPLEVBQUUsSUFBSSxDQUFDLFlBQVksRUFBRTtZQUM1QixLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNuQixRQUFRLEVBQUUsSUFBSSxDQUFDLFFBQVEsRUFBRTtTQUMxQixDQUFDLENBQ0gsQ0FBQztLQUNIOytHQXRDWSxjQUFjO21HQUFkLGNBQWMsNjFCQ3RCM0IsMmJBZ0JBLHlwRURBWSxZQUFZLGlPQUFFLGFBQWE7OzRGQU0xQixjQUFjO2tCQVIxQixTQUFTOytCQUNFLFdBQVcsV0FDWixDQUFDLFlBQVksRUFBRSxhQUFhLENBQUMsY0FDMUIsSUFBSSxtQkFHQyx1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBpbnB1dCwgY29tcHV0ZWQsIENoYW5nZURldGVjdGlvblN0cmF0ZWd5IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJhZGdlQ29udGVudCwgQmFkZ2VTaXplLCBCYWRnZVR5cGUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5pbnRlcmZhY2VcIjtcbmltcG9ydCB7XG4gIGdldEJhZGdlSWNvblNpemUsXG4gIGdldERpc3BsYXlDb3VudCxcbiAgZ2V0U2hvd0JhZGdlLFxuICBnZXRTaG93SWNvbixcbiAgZ2V0U2hvd1RleHQsXG59IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2JhZGdlL2JhZGdlLnV0aWxzXCI7XG5cbmltcG9ydCB7IGlzVmFsaWRJY29uTmFtZSB9IGZyb20gXCIuLi9pY29uL2ljb24tbWFwXCI7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5jb21wb25lbnRcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInJ0ZS1iYWRnZVwiLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJY29uQ29tcG9uZW50XSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9iYWRnZS5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybDogXCIuL2JhZGdlLmNvbXBvbmVudC5zY3NzXCIsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBCYWRnZUNvbXBvbmVudCB7XG4gIHJlYWRvbmx5IGJhZGdlVHlwZSA9IGlucHV0PEJhZGdlVHlwZT4oXCJicmFuZFwiKTtcbiAgcmVhZG9ubHkgYmFkZ2VTaXplID0gaW5wdXQ8QmFkZ2VTaXplPihcIm1cIik7XG4gIHJlYWRvbmx5IGJhZGdlQ29udGVudCA9IGlucHV0PEJhZGdlQ29udGVudD4oXCJudW1iZXJcIik7XG4gIHJlYWRvbmx5IGNvdW50ID0gaW5wdXQ8bnVtYmVyIHwgdW5kZWZpbmVkPigpO1xuICByZWFkb25seSBpY29uID0gaW5wdXQ8c3RyaW5nPihcIm5vdGlmaWNhdGlvblwiKTtcbiAgcmVhZG9ubHkgc2ltcGxlQmFkZ2UgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG5cbiAgcmVhZG9ubHkgaXNWYWxpZEljb25OYW1lID0gY29tcHV0ZWQoKCkgPT4gaXNWYWxpZEljb25OYW1lKHRoaXMuaWNvbigpKSk7XG5cbiAgcmVhZG9ubHkgc2hvd0ljb24gPSBjb21wdXRlZCgoKSA9PlxuICAgIGdldFNob3dJY29uKHtcbiAgICAgIHNpemU6IHRoaXMuYmFkZ2VTaXplKCksXG4gICAgICBjb250ZW50OiB0aGlzLmJhZGdlQ29udGVudCgpLFxuICAgICAgaWNvblNpemU6IHRoaXMuaWNvblNpemUoKSxcbiAgICB9KSxcbiAgKTtcblxuICByZWFkb25seSBzaG93VGV4dCA9IGNvbXB1dGVkKCgpID0+XG4gICAgZ2V0U2hvd1RleHQoe1xuICAgICAgc2l6ZTogdGhpcy5iYWRnZVNpemUoKSxcbiAgICAgIGNvbnRlbnQ6IHRoaXMuYmFkZ2VDb250ZW50KCksXG4gICAgICBjb3VudDogdGhpcy5jb3VudCgpLFxuICAgIH0pLFxuICApO1xuXG4gIHJlYWRvbmx5IGRpc3BsYXlDb3VudCA9IGNvbXB1dGVkKCgpID0+IGdldERpc3BsYXlDb3VudCh0aGlzLmNvdW50KCkpKTtcbiAgcmVhZG9ubHkgY291bnRPdmVyZmxvdyA9IGNvbXB1dGVkKCgpID0+IHRoaXMuc2hvd1RleHQoKSAmJiB0aGlzLmRpc3BsYXlDb3VudCgpLmxlbmd0aCA+IDIpO1xuICByZWFkb25seSBpY29uU2l6ZSA9IGNvbXB1dGVkKCgpID0+IGdldEJhZGdlSWNvblNpemUodGhpcy5iYWRnZVNpemUoKSkpO1xuXG4gIHJlYWRvbmx5IHNob3dCYWRnZSA9IGNvbXB1dGVkKCgpID0+XG4gICAgZ2V0U2hvd0JhZGdlKHtcbiAgICAgIHNpemU6IHRoaXMuYmFkZ2VTaXplKCksXG4gICAgICBjb250ZW50OiB0aGlzLmJhZGdlQ29udGVudCgpLFxuICAgICAgY291bnQ6IHRoaXMuY291bnQoKSxcbiAgICAgIGljb25TaXplOiB0aGlzLmljb25TaXplKCksXG4gICAgfSksXG4gICk7XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwiYmFkZ2Ugc2l6ZS17eyBiYWRnZVNpemUoKSB9fSB0eXBlLXt7IGJhZGdlVHlwZSgpIH19XCJcbiAgZGF0YS10ZXN0aWQ9XCJiYWRnZVwiXG4gIFthdHRyLmRhdGEtc2ltcGxlLWJhZGdlXT1cInNpbXBsZUJhZGdlKClcIlxuICBbbmdDbGFzc109XCJ7IGhpZGRlbjogIXNob3dCYWRnZSgpLCAnY291bnQtb3ZlcmZsb3cnOiBjb3VudE92ZXJmbG93KCkgfVwiXG4+XG4gIDxydGUtaWNvblxuICAgICpuZ0lmPVwic2hvd0ljb24oKVwiXG4gICAgY2xhc3M9XCJiYWRnZS1pY29uXCJcbiAgICBbbmFtZV09XCJpY29uKClcIlxuICAgIFtzaXplXT1cImljb25TaXplKCkhXCJcbiAgLz5cbiAgPHNwYW4gKm5nSWY9XCJzaG93VGV4dCgpXCIgY2xhc3M9XCJiYWRnZS10ZXh0XCI+XG4gICAge3sgZGlzcGxheUNvdW50KCkgfX1cbiAgPC9zcGFuPlxuPC9kaXY+XG4iXX0=
|
|
@@ -5,7 +5,7 @@ export class BadgeDirective {
|
|
|
5
5
|
constructor() {
|
|
6
6
|
this.rteBadgeType = input("brand");
|
|
7
7
|
this.rteBadgeSize = input("m");
|
|
8
|
-
this.
|
|
8
|
+
this.rteBadgeContent = input("number");
|
|
9
9
|
this.rteBadgeCount = input();
|
|
10
10
|
this.rteBadgeIcon = input("settings");
|
|
11
11
|
this.badgeComponentRef = null;
|
|
@@ -32,7 +32,7 @@ export class BadgeDirective {
|
|
|
32
32
|
if (this.badgeComponentRef) {
|
|
33
33
|
this.badgeComponentRef.setInput("badgeType", this.rteBadgeType());
|
|
34
34
|
this.badgeComponentRef.setInput("badgeSize", this.rteBadgeSize());
|
|
35
|
-
this.badgeComponentRef.setInput("
|
|
35
|
+
this.badgeComponentRef.setInput("badgeContent", this.rteBadgeContent());
|
|
36
36
|
this.badgeComponentRef.setInput("count", this.rteBadgeCount());
|
|
37
37
|
this.badgeComponentRef.setInput("icon", this.rteBadgeIcon());
|
|
38
38
|
}
|
|
@@ -43,7 +43,7 @@ export class BadgeDirective {
|
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
45
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
46
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.3.12", type: BadgeDirective, isStandalone: true, selector: "[rteBadge]", inputs: { rteBadgeType: { classPropertyName: "rteBadgeType", publicName: "rteBadgeType", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeSize: { classPropertyName: "rteBadgeSize", publicName: "rteBadgeSize", isSignal: true, isRequired: false, transformFunction: null },
|
|
46
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.3.12", type: BadgeDirective, isStandalone: true, selector: "[rteBadge]", inputs: { rteBadgeType: { classPropertyName: "rteBadgeType", publicName: "rteBadgeType", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeSize: { classPropertyName: "rteBadgeSize", publicName: "rteBadgeSize", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeContent: { classPropertyName: "rteBadgeContent", publicName: "rteBadgeContent", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeCount: { classPropertyName: "rteBadgeCount", publicName: "rteBadgeCount", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeIcon: { classPropertyName: "rteBadgeIcon", publicName: "rteBadgeIcon", isSignal: true, isRequired: false, transformFunction: null } }, usesOnChanges: true, ngImport: i0 }); }
|
|
47
47
|
}
|
|
48
48
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeDirective, decorators: [{
|
|
49
49
|
type: Directive,
|
|
@@ -52,4 +52,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
52
52
|
standalone: true,
|
|
53
53
|
}]
|
|
54
54
|
}], ctorParameters: () => [] });
|
|
55
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
55
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUdMLGdCQUFnQixFQUVoQixNQUFNLEVBQ04sVUFBVSxFQUNWLFNBQVMsR0FFVixNQUFNLGVBQWUsQ0FBQztBQUt2QixPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sbUJBQW1CLENBQUM7O0FBTW5ELE1BQU0sT0FBTyxjQUFjO0lBY3pCO1FBYlMsaUJBQVksR0FBRyxLQUFLLENBQVksT0FBTyxDQUFDLENBQUM7UUFDekMsaUJBQVksR0FBRyxLQUFLLENBQVksR0FBRyxDQUFDLENBQUM7UUFDckMsb0JBQWUsR0FBRyxLQUFLLENBQWUsUUFBUSxDQUFDLENBQUM7UUFDaEQsa0JBQWEsR0FBRyxLQUFLLEVBQXNCLENBQUM7UUFDNUMsaUJBQVksR0FBRyxLQUFLLENBQXdDLFVBQVUsQ0FBQyxDQUFDO1FBRXpFLHNCQUFpQixHQUF3QyxJQUFJLENBQUM7UUFHckQsa0JBQWEsR0FBRyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUN6QyxlQUFVLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBQ2hDLGFBQVEsR0FBRyxNQUFNLENBQUMsU0FBUyxDQUFDLENBQUM7UUFHNUMsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQztJQUNuRCxDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxpQkFBaUIsR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDLGVBQWUsQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUM1RSxJQUFJLENBQUMsMEJBQTBCLEVBQUUsQ0FBQztRQUNsQyxJQUFJLENBQUMscUJBQXFCLEVBQUUsQ0FBQztRQUM3QixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsV0FBVyxFQUFFLFVBQVUsRUFBRSxVQUFVLENBQUMsQ0FBQztJQUNuRSxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQywwQkFBMEIsRUFBRSxDQUFDO0lBQ3BDLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxJQUFJLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztZQUMzQixJQUFJLENBQUMsaUJBQWlCLENBQUMsT0FBTyxFQUFFLENBQUM7UUFDbkMsQ0FBQztJQUNILENBQUM7SUFFTywwQkFBMEI7UUFDaEMsSUFBSSxJQUFJLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztZQUMzQixJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLFdBQVcsRUFBRSxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUMsQ0FBQztZQUNsRSxJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLFdBQVcsRUFBRSxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUMsQ0FBQztZQUNsRSxJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLGNBQWMsRUFBRSxJQUFJLENBQUMsZUFBZSxFQUFFLENBQUMsQ0FBQztZQUN4RSxJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsYUFBYSxFQUFFLENBQUMsQ0FBQztZQUMvRCxJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUMsQ0FBQztRQUMvRCxDQUFDO0lBQ0gsQ0FBQztJQUVPLHFCQUFxQjtRQUMzQixJQUFJLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxDQUFDO1lBQzNCLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxRQUFRLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDMUcsQ0FBQztJQUNILENBQUM7K0dBakRVLGNBQWM7bUdBQWQsY0FBYzs7NEZBQWQsY0FBYztrQkFKMUIsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsWUFBWTtvQkFDdEIsVUFBVSxFQUFFLElBQUk7aUJBQ2pCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgRGlyZWN0aXZlLFxuICBpbnB1dCxcbiAgT25DaGFuZ2VzLFxuICBPbkRlc3Ryb3ksXG4gIFZpZXdDb250YWluZXJSZWYsXG4gIENvbXBvbmVudFJlZixcbiAgaW5qZWN0LFxuICBFbGVtZW50UmVmLFxuICBSZW5kZXJlcjIsXG4gIE9uSW5pdCxcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJhZGdlVHlwZSwgQmFkZ2VTaXplLCBCYWRnZUNvbnRlbnQgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5pbnRlcmZhY2VcIjtcblxuaW1wb3J0IHsgUmVndWxhckljb25JZEtleSwgVG9nZ2xhYmxlSWNvbklkS2V5IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5zZXJ2aWNlXCI7XG5cbmltcG9ydCB7IEJhZGdlQ29tcG9uZW50IH0gZnJvbSBcIi4vYmFkZ2UuY29tcG9uZW50XCI7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogXCJbcnRlQmFkZ2VdXCIsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIEJhZGdlRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMsIE9uRGVzdHJveSB7XG4gIHJlYWRvbmx5IHJ0ZUJhZGdlVHlwZSA9IGlucHV0PEJhZGdlVHlwZT4oXCJicmFuZFwiKTtcbiAgcmVhZG9ubHkgcnRlQmFkZ2VTaXplID0gaW5wdXQ8QmFkZ2VTaXplPihcIm1cIik7XG4gIHJlYWRvbmx5IHJ0ZUJhZGdlQ29udGVudCA9IGlucHV0PEJhZGdlQ29udGVudD4oXCJudW1iZXJcIik7XG4gIHJlYWRvbmx5IHJ0ZUJhZGdlQ291bnQgPSBpbnB1dDxudW1iZXIgfCB1bmRlZmluZWQ+KCk7XG4gIHJlYWRvbmx5IHJ0ZUJhZGdlSWNvbiA9IGlucHV0PFJlZ3VsYXJJY29uSWRLZXkgfCBUb2dnbGFibGVJY29uSWRLZXk+KFwic2V0dGluZ3NcIik7XG5cbiAgcHJpdmF0ZSBiYWRnZUNvbXBvbmVudFJlZjogQ29tcG9uZW50UmVmPEJhZGdlQ29tcG9uZW50PiB8IG51bGwgPSBudWxsO1xuICBwcml2YXRlIGhvc3RFbGVtZW50OiBIVE1MRWxlbWVudDtcblxuICBwcml2YXRlIHJlYWRvbmx5IHZpZXdDb250YWluZXIgPSBpbmplY3QoVmlld0NvbnRhaW5lclJlZik7XG4gIHByaXZhdGUgcmVhZG9ubHkgZWxlbWVudFJlZiA9IGluamVjdChFbGVtZW50UmVmKTtcbiAgcHJpdmF0ZSByZWFkb25seSByZW5kZXJlciA9IGluamVjdChSZW5kZXJlcjIpO1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHRoaXMuaG9zdEVsZW1lbnQgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMuYmFkZ2VDb21wb25lbnRSZWYgPSB0aGlzLnZpZXdDb250YWluZXIuY3JlYXRlQ29tcG9uZW50KEJhZGdlQ29tcG9uZW50KTtcbiAgICB0aGlzLmFzc2lnbkRpcmVjdGl2ZVRvQ29tcG9uZW50KCk7XG4gICAgdGhpcy5hcHBlbmRDb21wb25lbnRUb0hvc3QoKTtcbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKHRoaXMuaG9zdEVsZW1lbnQsIFwicG9zaXRpb25cIiwgXCJyZWxhdGl2ZVwiKTtcbiAgfVxuXG4gIG5nT25DaGFuZ2VzKCk6IHZvaWQge1xuICAgIHRoaXMuYXNzaWduRGlyZWN0aXZlVG9Db21wb25lbnQoKTtcbiAgfVxuXG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmJhZGdlQ29tcG9uZW50UmVmKSB7XG4gICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmLmRlc3Ryb3koKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIGFzc2lnbkRpcmVjdGl2ZVRvQ29tcG9uZW50KCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmJhZGdlQ29tcG9uZW50UmVmKSB7XG4gICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmLnNldElucHV0KFwiYmFkZ2VUeXBlXCIsIHRoaXMucnRlQmFkZ2VUeXBlKCkpO1xuICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5zZXRJbnB1dChcImJhZGdlU2l6ZVwiLCB0aGlzLnJ0ZUJhZGdlU2l6ZSgpKTtcbiAgICAgIHRoaXMuYmFkZ2VDb21wb25lbnRSZWYuc2V0SW5wdXQoXCJiYWRnZUNvbnRlbnRcIiwgdGhpcy5ydGVCYWRnZUNvbnRlbnQoKSk7XG4gICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmLnNldElucHV0KFwiY291bnRcIiwgdGhpcy5ydGVCYWRnZUNvdW50KCkpO1xuICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5zZXRJbnB1dChcImljb25cIiwgdGhpcy5ydGVCYWRnZUljb24oKSk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBhcHBlbmRDb21wb25lbnRUb0hvc3QoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuYmFkZ2VDb21wb25lbnRSZWYpIHtcbiAgICAgIHRoaXMucmVuZGVyZXIuYXBwZW5kQ2hpbGQodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsIHRoaXMuYmFkZ2VDb21wb25lbnRSZWYubG9jYXRpb24ubmF0aXZlRWxlbWVudCk7XG4gICAgfVxuICB9XG59XG4iXX0=
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { CommonModule } from "@angular/common";
|
|
2
|
+
import { ChangeDetectionStrategy, Component, input, output, signal, } from "@angular/core";
|
|
3
|
+
import { ButtonComponent } from "../button/button.component";
|
|
4
|
+
import { IconComponent } from "../icon/icon.component";
|
|
5
|
+
import { IconButtonComponent } from "../icon-button/icon-button.component";
|
|
6
|
+
import * as i0 from "@angular/core";
|
|
7
|
+
import * as i1 from "@angular/common";
|
|
8
|
+
export class BannerComponent {
|
|
9
|
+
constructor() {
|
|
10
|
+
this.type = input("default");
|
|
11
|
+
this.message = input.required();
|
|
12
|
+
this.position = input("push");
|
|
13
|
+
this.title = input();
|
|
14
|
+
this.closable = input(false);
|
|
15
|
+
this.showIcon = input(false);
|
|
16
|
+
this.isOpen = input(true);
|
|
17
|
+
this.actionLabel = input();
|
|
18
|
+
this.click = output();
|
|
19
|
+
this.visible = signal(false);
|
|
20
|
+
this.rendering = signal(false);
|
|
21
|
+
this.close = output();
|
|
22
|
+
}
|
|
23
|
+
ngOnInit() {
|
|
24
|
+
this.visible.set(this.isOpen());
|
|
25
|
+
this.rendering.set(this.isOpen());
|
|
26
|
+
if (this.closable() === false && this.position() === "overlay") {
|
|
27
|
+
console.warn("Banner: 'closable' and 'close' props must be set when 'position' has 'overlay' value.");
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
ngOnChanges(changes) {
|
|
32
|
+
if (changes["isOpen"]) {
|
|
33
|
+
if (this.isOpen())
|
|
34
|
+
this.openBanner();
|
|
35
|
+
else {
|
|
36
|
+
this.closeBanner();
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
clickAction() {
|
|
41
|
+
this.click.emit();
|
|
42
|
+
}
|
|
43
|
+
closeBanner() {
|
|
44
|
+
this.visible.set(false);
|
|
45
|
+
setTimeout(() => {
|
|
46
|
+
this.rendering.set(false);
|
|
47
|
+
this.close.emit();
|
|
48
|
+
}, 200);
|
|
49
|
+
}
|
|
50
|
+
openBanner() {
|
|
51
|
+
if (this.rendering())
|
|
52
|
+
return;
|
|
53
|
+
this.rendering.set(true);
|
|
54
|
+
requestAnimationFrame(() => {
|
|
55
|
+
requestAnimationFrame(() => this.visible.set(true));
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
59
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: BannerComponent, isStandalone: true, selector: "rte-banner", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click", close: "close" }, usesOnChanges: true, ngImport: i0, template: "<section\n *ngIf=\"rendering()\"\n class=\"rte-banner-container {{ type() }} {{ position() }}\"\n [ngClass]=\"{ open: visible(), close: !visible() }\"\n [attr.role]=\"type() === 'default' ? 'status' : 'alert'\"\n>\n <div class=\"rte-banner\">\n <div *ngIf=\"showIcon()\" class=\"rte-banner-icon\">\n <rte-icon [name]=\"type() === 'default' ? 'info' : 'error'\" [size]=\"32\" />\n </div>\n <div class=\"rte-banner-content\">\n <span *ngIf=\"title()\" class=\"rte-banner-title\">{{ title() }}</span>\n <div *ngIf=\"message()\" class=\"rte-banner-message\">\n <span>{{ message() }}</span>\n <rte-button\n *ngIf=\"actionLabel()\"\n variant=\"neutral\"\n size=\"s\"\n [label]=\"actionLabel()!\"\n [ariaLabel]=\"actionLabel()!\"\n (click)=\"clickAction()\"\n />\n </div>\n </div>\n <div *ngIf=\"closable()\" class=\"rte-banner-close-icon\">\n <rte-icon-button\n name=\"close\"\n variant=\"neutral\"\n ariaLabel=\"close banner\"\n (click)=\"closeBanner()\"\n />\n </div>\n </div>\n</section>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-banner-container{display:flex;box-sizing:border-box;width:100%;min-width:320px;padding:24px;flex-direction:column;justify-content:center;align-items:center;gap:0px;border-radius:0;background:var(--background-info-default);color:var(--content-info);top:0;left:0;transition:opacity .2s ease,transform .2s ease;z-index:10}.rte-banner-container.alert{background:var(--background-danger-default);color:var(--content-danger)}.rte-banner-container.overlay{position:fixed}.rte-banner-container.open{opacity:1;transform:translateY(0)}.rte-banner-container.close{opacity:0;transform:translateY(-10px)}.rte-banner-container .rte-banner{display:flex;padding:16px;align-items:flex-start;gap:16px;align-self:stretch;border-radius:var(--radius-S, 4px);opacity:var(--100, 1);box-shadow:0 8px 16px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-4) 0%,var(--elevation-surface-shadow-4) 100%);background-color:var(--background-default, #FFF)}.rte-banner-container .rte-banner .rte-banner-icon{display:flex;padding:0 0 0 16px;justify-content:center;align-items:center;gap:var(--positive-spacing_0, 0);align-self:stretch}.rte-banner-container .rte-banner .banner-close-icon{color:var(--content-secondary)}.rte-banner-container .rte-banner .rte-banner-content{display:flex;padding:0 16px;flex-direction:column;align-items:flex-start;gap:8px;flex:1 0 0;border-radius:0;opacity:100%}.rte-banner-container .rte-banner .rte-banner-content .rte-banner-title{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px}.rte-banner-container .rte-banner .rte-banner-content .rte-banner-message{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0px;color:var(--content-secondary);display:flex;align-items:center;gap:24px;padding:8px 0;justify-content:space-between;width:100%}.rte-banner-container .rte-banner .rte-banner-content .rte-banner-message .rte-banner-action-button{width:max-content}.rte-banner-container .rte-banner .rte-banner-close-icon{color:var(--content-secondary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "rte-icon", inputs: ["name", "size", "color", "classes", "appearance"] }, { kind: "component", type: IconButtonComponent, selector: "rte-icon-button", inputs: ["disabled", "name", "size", "variant", "type", "appearance", "compactSpacing", "ariaLabel", "ariaLabelledBy"], outputs: ["click"] }, { kind: "component", type: ButtonComponent, selector: "rte-button", inputs: ["label", "variant", "size", "disabled", "icon", "ariaLabel", "ariaLabelledBy", "buttonType"], outputs: ["click"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
60
|
+
}
|
|
61
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BannerComponent, decorators: [{
|
|
62
|
+
type: Component,
|
|
63
|
+
args: [{ selector: "rte-banner", imports: [CommonModule, IconComponent, IconButtonComponent, ButtonComponent], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n *ngIf=\"rendering()\"\n class=\"rte-banner-container {{ type() }} {{ position() }}\"\n [ngClass]=\"{ open: visible(), close: !visible() }\"\n [attr.role]=\"type() === 'default' ? 'status' : 'alert'\"\n>\n <div class=\"rte-banner\">\n <div *ngIf=\"showIcon()\" class=\"rte-banner-icon\">\n <rte-icon [name]=\"type() === 'default' ? 'info' : 'error'\" [size]=\"32\" />\n </div>\n <div class=\"rte-banner-content\">\n <span *ngIf=\"title()\" class=\"rte-banner-title\">{{ title() }}</span>\n <div *ngIf=\"message()\" class=\"rte-banner-message\">\n <span>{{ message() }}</span>\n <rte-button\n *ngIf=\"actionLabel()\"\n variant=\"neutral\"\n size=\"s\"\n [label]=\"actionLabel()!\"\n [ariaLabel]=\"actionLabel()!\"\n (click)=\"clickAction()\"\n />\n </div>\n </div>\n <div *ngIf=\"closable()\" class=\"rte-banner-close-icon\">\n <rte-icon-button\n name=\"close\"\n variant=\"neutral\"\n ariaLabel=\"close banner\"\n (click)=\"closeBanner()\"\n />\n </div>\n </div>\n</section>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-banner-container{display:flex;box-sizing:border-box;width:100%;min-width:320px;padding:24px;flex-direction:column;justify-content:center;align-items:center;gap:0px;border-radius:0;background:var(--background-info-default);color:var(--content-info);top:0;left:0;transition:opacity .2s ease,transform .2s ease;z-index:10}.rte-banner-container.alert{background:var(--background-danger-default);color:var(--content-danger)}.rte-banner-container.overlay{position:fixed}.rte-banner-container.open{opacity:1;transform:translateY(0)}.rte-banner-container.close{opacity:0;transform:translateY(-10px)}.rte-banner-container .rte-banner{display:flex;padding:16px;align-items:flex-start;gap:16px;align-self:stretch;border-radius:var(--radius-S, 4px);opacity:var(--100, 1);box-shadow:0 8px 16px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-4) 0%,var(--elevation-surface-shadow-4) 100%);background-color:var(--background-default, #FFF)}.rte-banner-container .rte-banner .rte-banner-icon{display:flex;padding:0 0 0 16px;justify-content:center;align-items:center;gap:var(--positive-spacing_0, 0);align-self:stretch}.rte-banner-container .rte-banner .banner-close-icon{color:var(--content-secondary)}.rte-banner-container .rte-banner .rte-banner-content{display:flex;padding:0 16px;flex-direction:column;align-items:flex-start;gap:8px;flex:1 0 0;border-radius:0;opacity:100%}.rte-banner-container .rte-banner .rte-banner-content .rte-banner-title{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px}.rte-banner-container .rte-banner .rte-banner-content .rte-banner-message{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0px;color:var(--content-secondary);display:flex;align-items:center;gap:24px;padding:8px 0;justify-content:space-between;width:100%}.rte-banner-container .rte-banner .rte-banner-content .rte-banner-message .rte-banner-action-button{width:max-content}.rte-banner-container .rte-banner .rte-banner-close-icon{color:var(--content-secondary)}\n"] }]
|
|
64
|
+
}] });
|
|
65
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFubmVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2Jhbm5lci9iYW5uZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFubmVyL2Jhbm5lci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUNMLHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsS0FBSyxFQUNMLE1BQU0sRUFDTixNQUFNLEdBSVAsTUFBTSxlQUFlLENBQUM7QUFHdkIsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBQzdELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQzs7O0FBVTNFLE1BQU0sT0FBTyxlQUFlO0lBUjVCO1FBU1csU0FBSSxHQUFHLEtBQUssQ0FBYSxTQUFTLENBQUMsQ0FBQztRQUNwQyxZQUFPLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBVSxDQUFDO1FBQ25DLGFBQVEsR0FBRyxLQUFLLENBQWlCLE1BQU0sQ0FBQyxDQUFDO1FBQ3pDLFVBQUssR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUN4QixhQUFRLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBQ2pDLGFBQVEsR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFDakMsV0FBTSxHQUFHLEtBQUssQ0FBVSxJQUFJLENBQUMsQ0FBQztRQUM5QixnQkFBVyxHQUFHLEtBQUssRUFBVSxDQUFDO1FBRTlCLFVBQUssR0FBRyxNQUFNLEVBQVEsQ0FBQztRQUV2QixZQUFPLEdBQUcsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ3hCLGNBQVMsR0FBRyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFMUIsVUFBSyxHQUFHLE1BQU0sRUFBUSxDQUFDO0tBdUNqQztJQXJDQyxRQUFRO1FBQ04sSUFBSSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLENBQUM7UUFDaEMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLENBQUM7UUFDbEMsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLEtBQUssS0FBSyxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUUsS0FBSyxTQUFTLEVBQUUsQ0FBQztZQUMvRCxPQUFPLENBQUMsSUFBSSxDQUFDLHVGQUF1RixDQUFDLENBQUM7WUFDdEcsT0FBTztRQUNULENBQUM7SUFDSCxDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksT0FBTyxDQUFDLFFBQVEsQ0FBQyxFQUFFLENBQUM7WUFDdEIsSUFBSSxJQUFJLENBQUMsTUFBTSxFQUFFO2dCQUFFLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztpQkFDaEMsQ0FBQztnQkFDSixJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7WUFDckIsQ0FBQztRQUNILENBQUM7SUFDSCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDcEIsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN4QixVQUFVLENBQUMsR0FBRyxFQUFFO1lBQ2QsSUFBSSxDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDMUIsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUNwQixDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7SUFDVixDQUFDO0lBRU8sVUFBVTtRQUNoQixJQUFJLElBQUksQ0FBQyxTQUFTLEVBQUU7WUFBRSxPQUFPO1FBQzdCLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQ3pCLHFCQUFxQixDQUFDLEdBQUcsRUFBRTtZQUN6QixxQkFBcUIsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ3RELENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0FyRFUsZUFBZTttR0FBZixlQUFlLHNvQ0N6QjVCLHluQ0FrQ0EsazlFRGZZLFlBQVksaU9BQUUsYUFBYSxpSEFBRSxtQkFBbUIsd01BQUUsZUFBZTs7NEZBTWhFLGVBQWU7a0JBUjNCLFNBQVM7K0JBQ0UsWUFBWSxXQUNiLENBQUMsWUFBWSxFQUFFLGFBQWEsRUFBRSxtQkFBbUIsRUFBRSxlQUFlLENBQUMsY0FDaEUsSUFBSSxtQkFHQyx1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgaW5wdXQsXG4gIG91dHB1dCxcbiAgc2lnbmFsLFxuICBTaW1wbGVDaGFuZ2VzLFxuICBPbkluaXQsXG4gIE9uQ2hhbmdlcyxcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJhbm5lclBvc2l0aW9uLCBCYW5uZXJUeXBlIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvYmFubmVyL2Jhbm5lci5pbnRlcmZhY2VcIjtcblxuaW1wb3J0IHsgQnV0dG9uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2J1dHRvbi9idXR0b24uY29tcG9uZW50XCI7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5jb21wb25lbnRcIjtcbmltcG9ydCB7IEljb25CdXR0b25Db21wb25lbnQgfSBmcm9tIFwiLi4vaWNvbi1idXR0b24vaWNvbi1idXR0b24uY29tcG9uZW50XCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJydGUtYmFubmVyXCIsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEljb25Db21wb25lbnQsIEljb25CdXR0b25Db21wb25lbnQsIEJ1dHRvbkNvbXBvbmVudF0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIHRlbXBsYXRlVXJsOiBcIi4vYmFubmVyLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsOiBcIi4vYmFubmVyLmNvbXBvbmVudC5zY3NzXCIsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBCYW5uZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG4gIHJlYWRvbmx5IHR5cGUgPSBpbnB1dDxCYW5uZXJUeXBlPihcImRlZmF1bHRcIik7XG4gIHJlYWRvbmx5IG1lc3NhZ2UgPSBpbnB1dC5yZXF1aXJlZDxzdHJpbmc+KCk7XG4gIHJlYWRvbmx5IHBvc2l0aW9uID0gaW5wdXQ8QmFubmVyUG9zaXRpb24+KFwicHVzaFwiKTtcbiAgcmVhZG9ubHkgdGl0bGUgPSBpbnB1dDxzdHJpbmc+KCk7XG4gIHJlYWRvbmx5IGNsb3NhYmxlID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpO1xuICByZWFkb25seSBzaG93SWNvbiA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcbiAgcmVhZG9ubHkgaXNPcGVuID0gaW5wdXQ8Ym9vbGVhbj4odHJ1ZSk7XG4gIHJlYWRvbmx5IGFjdGlvbkxhYmVsID0gaW5wdXQ8c3RyaW5nPigpO1xuXG4gIHJlYWRvbmx5IGNsaWNrID0gb3V0cHV0PHZvaWQ+KCk7XG5cbiAgcmVhZG9ubHkgdmlzaWJsZSA9IHNpZ25hbChmYWxzZSk7XG4gIHJlYWRvbmx5IHJlbmRlcmluZyA9IHNpZ25hbChmYWxzZSk7XG5cbiAgcmVhZG9ubHkgY2xvc2UgPSBvdXRwdXQ8dm9pZD4oKTtcblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLnZpc2libGUuc2V0KHRoaXMuaXNPcGVuKCkpO1xuICAgIHRoaXMucmVuZGVyaW5nLnNldCh0aGlzLmlzT3BlbigpKTtcbiAgICBpZiAodGhpcy5jbG9zYWJsZSgpID09PSBmYWxzZSAmJiB0aGlzLnBvc2l0aW9uKCkgPT09IFwib3ZlcmxheVwiKSB7XG4gICAgICBjb25zb2xlLndhcm4oXCJCYW5uZXI6ICdjbG9zYWJsZScgYW5kICdjbG9zZScgcHJvcHMgbXVzdCBiZSBzZXQgd2hlbiAncG9zaXRpb24nIGhhcyAnb3ZlcmxheScgdmFsdWUuXCIpO1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgfVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcbiAgICBpZiAoY2hhbmdlc1tcImlzT3BlblwiXSkge1xuICAgICAgaWYgKHRoaXMuaXNPcGVuKCkpIHRoaXMub3BlbkJhbm5lcigpO1xuICAgICAgZWxzZSB7XG4gICAgICAgIHRoaXMuY2xvc2VCYW5uZXIoKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBjbGlja0FjdGlvbigpIHtcbiAgICB0aGlzLmNsaWNrLmVtaXQoKTtcbiAgfVxuXG4gIGNsb3NlQmFubmVyKCkge1xuICAgIHRoaXMudmlzaWJsZS5zZXQoZmFsc2UpO1xuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgdGhpcy5yZW5kZXJpbmcuc2V0KGZhbHNlKTtcbiAgICAgIHRoaXMuY2xvc2UuZW1pdCgpO1xuICAgIH0sIDIwMCk7XG4gIH1cblxuICBwcml2YXRlIG9wZW5CYW5uZXIoKSB7XG4gICAgaWYgKHRoaXMucmVuZGVyaW5nKCkpIHJldHVybjtcbiAgICB0aGlzLnJlbmRlcmluZy5zZXQodHJ1ZSk7XG4gICAgcmVxdWVzdEFuaW1hdGlvbkZyYW1lKCgpID0+IHtcbiAgICAgIHJlcXVlc3RBbmltYXRpb25GcmFtZSgoKSA9PiB0aGlzLnZpc2libGUuc2V0KHRydWUpKTtcbiAgICB9KTtcbiAgfVxufVxuIiwiPHNlY3Rpb25cbiAgKm5nSWY9XCJyZW5kZXJpbmcoKVwiXG4gIGNsYXNzPVwicnRlLWJhbm5lci1jb250YWluZXIge3sgdHlwZSgpIH19IHt7IHBvc2l0aW9uKCkgfX1cIlxuICBbbmdDbGFzc109XCJ7IG9wZW46IHZpc2libGUoKSwgY2xvc2U6ICF2aXNpYmxlKCkgfVwiXG4gIFthdHRyLnJvbGVdPVwidHlwZSgpID09PSAnZGVmYXVsdCcgPyAnc3RhdHVzJyA6ICdhbGVydCdcIlxuPlxuICA8ZGl2IGNsYXNzPVwicnRlLWJhbm5lclwiPlxuICAgIDxkaXYgKm5nSWY9XCJzaG93SWNvbigpXCIgY2xhc3M9XCJydGUtYmFubmVyLWljb25cIj5cbiAgICAgIDxydGUtaWNvbiBbbmFtZV09XCJ0eXBlKCkgPT09ICdkZWZhdWx0JyA/ICdpbmZvJyA6ICdlcnJvcidcIiBbc2l6ZV09XCIzMlwiIC8+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cInJ0ZS1iYW5uZXItY29udGVudFwiPlxuICAgICAgPHNwYW4gKm5nSWY9XCJ0aXRsZSgpXCIgY2xhc3M9XCJydGUtYmFubmVyLXRpdGxlXCI+e3sgdGl0bGUoKSB9fTwvc3Bhbj5cbiAgICAgIDxkaXYgKm5nSWY9XCJtZXNzYWdlKClcIiBjbGFzcz1cInJ0ZS1iYW5uZXItbWVzc2FnZVwiPlxuICAgICAgICA8c3Bhbj57eyBtZXNzYWdlKCkgfX08L3NwYW4+XG4gICAgICAgIDxydGUtYnV0dG9uXG4gICAgICAgICAgKm5nSWY9XCJhY3Rpb25MYWJlbCgpXCJcbiAgICAgICAgICB2YXJpYW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgc2l6ZT1cInNcIlxuICAgICAgICAgIFtsYWJlbF09XCJhY3Rpb25MYWJlbCgpIVwiXG4gICAgICAgICAgW2FyaWFMYWJlbF09XCJhY3Rpb25MYWJlbCgpIVwiXG4gICAgICAgICAgKGNsaWNrKT1cImNsaWNrQWN0aW9uKClcIlxuICAgICAgICAvPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICAgPGRpdiAqbmdJZj1cImNsb3NhYmxlKClcIiBjbGFzcz1cInJ0ZS1iYW5uZXItY2xvc2UtaWNvblwiPlxuICAgICAgPHJ0ZS1pY29uLWJ1dHRvblxuICAgICAgICBuYW1lPVwiY2xvc2VcIlxuICAgICAgICB2YXJpYW50PVwibmV1dHJhbFwiXG4gICAgICAgIGFyaWFMYWJlbD1cImNsb3NlIGJhbm5lclwiXG4gICAgICAgIChjbGljayk9XCJjbG9zZUJhbm5lcigpXCJcbiAgICAgIC8+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9zZWN0aW9uPlxuIl19
|
|
@@ -17,10 +17,10 @@ export class ButtonComponent {
|
|
|
17
17
|
this.click.emit();
|
|
18
18
|
}
|
|
19
19
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: ButtonComponent, isStandalone: true, selector: "rte-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, buttonType: { classPropertyName: "buttonType", publicName: "buttonType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, ngImport: i0, template: "<button\n class=\"rte-button {{ variant() }} size-{{ size() }}\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.type]=\"buttonType()\"\n [disabled]=\"disabled()\"\n (click)=\"onClick($event)\"\n>\n <span class=\"rte-button-label\">{{ label() }}</span>\n</button>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\"
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: ButtonComponent, isStandalone: true, selector: "rte-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, buttonType: { classPropertyName: "buttonType", publicName: "buttonType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, ngImport: i0, template: "<button\n class=\"rte-button {{ variant() }} size-{{ size() }}\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.type]=\"buttonType()\"\n [disabled]=\"disabled()\"\n (click)=\"onClick($event)\"\n>\n <span class=\"rte-button-label\">{{ label() }}</span>\n</button>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";:host{display:inline-flex;flex-shrink:0}.rte-button{align-items:center;cursor:pointer;display:inline-flex;justify-content:center}.rte-button:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}.rte-button.size-s{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-size:14px;letter-spacing:-.5px;font-weight:600;line-height:20px;height:24px;border-radius:4px;padding:4px 8px}.rte-button.size-s .rte-button-label{margin:0 4px}.rte-button.size-m{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:16px;line-height:24px;letter-spacing:-.5px;height:32px;border-radius:4px;padding:4px 12px}.rte-button.size-m .rte-button-label{margin:0 6px}.rte-button.size-l{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px;height:40px;border-radius:8px;padding:4px 16px}.rte-button.size-l .rte-button-label{margin:0 8px}.rte-button.primary{border:var(--border-brand-default);color:var(--content-primary-inverse);background:var(--background-brand-default)}.rte-button.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}.rte-button.primary:active{background:var(--background-brand-pressed)}.rte-button.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}.rte-button.secondary:hover{background:var(--background-brand-inverse-hover)}.rte-button.secondary:active{background:var(--background-brand-inverse-pressed)}.rte-button.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}.rte-button.text{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.text:hover{background:var(--background-brand-inverse-hover)}.rte-button.text:active{background:var(--background-brand-inverse-pressed)}.rte-button.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}.rte-button.transparent{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.transparent:hover{color:var(--content-brand-hover)}.rte-button.transparent:active{color:var(--content-brand-press)}.rte-button.transparent:disabled{color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.danger{background:var(--background-danger-default);border:none;color:var(--content-primary-inverse);border-radius:8px}.rte-button.danger:hover{background:var(--background-danger-hover)}.rte-button.danger:active{background:var(--background-danger-pressed)}.rte-button.danger:disabled{background:var(--background-disabled);border:var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.neutral{background:none;border:none;color:var(--content-primary)}.rte-button.neutral:hover{color:var(--content-secondary)}.rte-button.neutral:active{color:var(--content-tertiary)}.rte-button.neutral:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}.rte-button.reverse{background:none;border:none;color:var(--content-primary-inverse)}.rte-button.reverse:hover{color:var(--background-hover)}.rte-button.reverse:active{color:var(--content-primary-inverse)}.rte-button.reverse:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
21
21
|
}
|
|
22
22
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
23
23
|
type: Component,
|
|
24
|
-
args: [{ selector: "rte-button", imports: [], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"rte-button {{ variant() }} size-{{ size() }}\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.type]=\"buttonType()\"\n [disabled]=\"disabled()\"\n (click)=\"onClick($event)\"\n>\n <span class=\"rte-button-label\">{{ label() }}</span>\n</button>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\"
|
|
24
|
+
args: [{ selector: "rte-button", imports: [], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"rte-button {{ variant() }} size-{{ size() }}\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.type]=\"buttonType()\"\n [disabled]=\"disabled()\"\n (click)=\"onClick($event)\"\n>\n <span class=\"rte-button-label\">{{ label() }}</span>\n</button>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";:host{display:inline-flex;flex-shrink:0}.rte-button{align-items:center;cursor:pointer;display:inline-flex;justify-content:center}.rte-button:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}.rte-button.size-s{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-size:14px;letter-spacing:-.5px;font-weight:600;line-height:20px;height:24px;border-radius:4px;padding:4px 8px}.rte-button.size-s .rte-button-label{margin:0 4px}.rte-button.size-m{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:16px;line-height:24px;letter-spacing:-.5px;height:32px;border-radius:4px;padding:4px 12px}.rte-button.size-m .rte-button-label{margin:0 6px}.rte-button.size-l{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px;height:40px;border-radius:8px;padding:4px 16px}.rte-button.size-l .rte-button-label{margin:0 8px}.rte-button.primary{border:var(--border-brand-default);color:var(--content-primary-inverse);background:var(--background-brand-default)}.rte-button.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}.rte-button.primary:active{background:var(--background-brand-pressed)}.rte-button.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}.rte-button.secondary:hover{background:var(--background-brand-inverse-hover)}.rte-button.secondary:active{background:var(--background-brand-inverse-pressed)}.rte-button.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}.rte-button.text{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.text:hover{background:var(--background-brand-inverse-hover)}.rte-button.text:active{background:var(--background-brand-inverse-pressed)}.rte-button.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}.rte-button.transparent{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.transparent:hover{color:var(--content-brand-hover)}.rte-button.transparent:active{color:var(--content-brand-press)}.rte-button.transparent:disabled{color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.danger{background:var(--background-danger-default);border:none;color:var(--content-primary-inverse);border-radius:8px}.rte-button.danger:hover{background:var(--background-danger-hover)}.rte-button.danger:active{background:var(--background-danger-pressed)}.rte-button.danger:disabled{background:var(--background-disabled);border:var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.neutral{background:none;border:none;color:var(--content-primary)}.rte-button.neutral:hover{color:var(--content-secondary)}.rte-button.neutral:active{color:var(--content-tertiary)}.rte-button.neutral:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}.rte-button.reverse{background:none;border:none;color:var(--content-primary-inverse)}.rte-button.reverse:hover{color:var(--background-hover)}.rte-button.reverse:active{color:var(--content-primary-inverse)}.rte-button.reverse:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}\n"] }]
|
|
25
25
|
}] });
|
|
26
26
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2J1dHRvbi9idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYnV0dG9uL2J1dHRvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBWWxGLE1BQU0sT0FBTyxlQUFlO0lBUjVCO1FBU1csVUFBSyxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNsQixZQUFPLEdBQUcsS0FBSyxDQUFnQixTQUFTLENBQUMsQ0FBQztRQUMxQyxTQUFJLEdBQUcsS0FBSyxDQUFhLEdBQUcsQ0FBQyxDQUFDO1FBQzlCLGFBQVEsR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsU0FBSSxHQUFHLEtBQUssQ0FBUyxFQUFFLENBQUMsQ0FBQztRQUN6QixjQUFTLEdBQUcsS0FBSyxDQUFTLEVBQUUsQ0FBQyxDQUFDO1FBQzlCLG1CQUFjLEdBQUcsS0FBSyxDQUFTLEVBQUUsQ0FBQyxDQUFDO1FBQ25DLGVBQVUsR0FBRyxLQUFLLENBQWEsUUFBUSxDQUFDLENBQUM7UUFFekMsVUFBSyxHQUFHLE1BQU0sRUFBUSxDQUFDO0tBTWpDO0lBSkMsT0FBTyxDQUFDLEtBQWlDO1FBQ3ZDLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3BCLENBQUM7K0dBZlUsZUFBZTttR0FBZixlQUFlLDhtQ0NaNUIsd1VBU1M7OzRGREdJLGVBQWU7a0JBUjNCLFNBQVM7K0JBQ0UsWUFBWSxXQUNiLEVBQUUsY0FDQyxJQUFJLG1CQUdDLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbnB1dCwgb3V0cHV0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJ1dHRvblR5cGUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmludGVyZmFjZVwiO1xuaW1wb3J0IHsgQnV0dG9uU2l6ZSwgQnV0dG9uVmFyaWFudCB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2J1dHRvbi9jb21tb24vY29tbW9uLWJ1dHRvblwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwicnRlLWJ1dHRvblwiLFxuICBpbXBvcnRzOiBbXSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9idXR0b24uY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmw6IFwiLi9idXR0b24uY29tcG9uZW50LnNjc3NcIixcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEJ1dHRvbkNvbXBvbmVudCB7XG4gIHJlYWRvbmx5IGxhYmVsID0gaW5wdXQoXCJcIik7XG4gIHJlYWRvbmx5IHZhcmlhbnQgPSBpbnB1dDxCdXR0b25WYXJpYW50PihcInByaW1hcnlcIik7XG4gIHJlYWRvbmx5IHNpemUgPSBpbnB1dDxCdXR0b25TaXplPihcIm1cIik7XG4gIHJlYWRvbmx5IGRpc2FibGVkID0gaW5wdXQoZmFsc2UpO1xuICByZWFkb25seSBpY29uID0gaW5wdXQ8c3RyaW5nPihcIlwiKTtcbiAgcmVhZG9ubHkgYXJpYUxhYmVsID0gaW5wdXQ8c3RyaW5nPihcIlwiKTtcbiAgcmVhZG9ubHkgYXJpYUxhYmVsbGVkQnkgPSBpbnB1dDxzdHJpbmc+KFwiXCIpO1xuICByZWFkb25seSBidXR0b25UeXBlID0gaW5wdXQ8QnV0dG9uVHlwZT4oXCJidXR0b25cIik7XG5cbiAgcmVhZG9ubHkgY2xpY2sgPSBvdXRwdXQ8dm9pZD4oKTtcblxuICBvbkNsaWNrKGV2ZW50OiBNb3VzZUV2ZW50IHwgS2V5Ym9hcmRFdmVudCk6IHZvaWQge1xuICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgIHRoaXMuY2xpY2suZW1pdCgpO1xuICB9XG59XG4iLCI8YnV0dG9uXG4gICAgY2xhc3M9XCJydGUtYnV0dG9uIHt7IHZhcmlhbnQoKSB9fSBzaXplLXt7IHNpemUoKSB9fVwiXG4gICAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWwoKVwiXG4gICAgW2F0dHIuYXJpYS1sYWJlbGxlZGJ5XT1cImFyaWFMYWJlbGxlZEJ5KClcIlxuICAgIFthdHRyLnR5cGVdPVwiYnV0dG9uVHlwZSgpXCJcbiAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWQoKVwiXG4gICAgKGNsaWNrKT1cIm9uQ2xpY2soJGV2ZW50KVwiXG4+XG4gICAgPHNwYW4gY2xhc3M9XCJydGUtYnV0dG9uLWxhYmVsXCI+e3sgbGFiZWwoKSB9fTwvc3Bhbj5cbjwvYnV0dG9uPiJdfQ==
|
|
@@ -30,10 +30,10 @@ export class IconComponent {
|
|
|
30
30
|
});
|
|
31
31
|
}
|
|
32
32
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
33
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: IconComponent, isStandalone: true, selector: "rte-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, providers: [IconService], ngImport: i0, template: "<div class=\"rte-icon-container\" [innerHTML]=\"svgContent\" [style.height]=\"(size())+'px'\" [style.width]=\"(size())+'px'\"></div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-icon-container{display:flex;color:
|
|
33
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: IconComponent, isStandalone: true, selector: "rte-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, providers: [IconService], ngImport: i0, template: "<div class=\"rte-icon-container\" [innerHTML]=\"svgContent\" [style.height]=\"(size())+'px'\" [style.width]=\"(size())+'px'\"></div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-icon-container{display:flex;color:inherit}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
34
34
|
}
|
|
35
35
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: IconComponent, decorators: [{
|
|
36
36
|
type: Component,
|
|
37
|
-
args: [{ selector: "rte-icon", imports: [CommonModule], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, providers: [IconService], template: "<div class=\"rte-icon-container\" [innerHTML]=\"svgContent\" [style.height]=\"(size())+'px'\" [style.width]=\"(size())+'px'\"></div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-icon-container{display:flex;color:
|
|
37
|
+
args: [{ selector: "rte-icon", imports: [CommonModule], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, providers: [IconService], template: "<div class=\"rte-icon-container\" [innerHTML]=\"svgContent\" [style.height]=\"(size())+'px'\" [style.width]=\"(size())+'px'\"></div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-icon-container{display:flex;color:inherit}\n"] }]
|
|
38
38
|
}], ctorParameters: () => [] });
|
|
39
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
39
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kcy1ydGUtbGliL3NyYy9saWIvY29tcG9uZW50cy9pY29uL2ljb24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvaWNvbi9pY29uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLGlCQUFpQixFQUNqQixTQUFTLEVBQ1QsVUFBVSxFQUNWLE1BQU0sRUFDTixNQUFNLEVBQ04sS0FBSyxHQUNOLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBQ2hFLE9BQU8sRUFBRSxZQUFZLEVBQVksTUFBTSwyQkFBMkIsQ0FBQztBQUduRSxPQUFPLEVBQUUsV0FBVyxFQUF3QyxNQUFNLGdCQUFnQixDQUFDOztBQVduRixNQUFNLE9BQU8sYUFBYTtJQWV4QjtRQWRTLFNBQUksR0FBRyxLQUFLLENBQUMsUUFBUSxFQUFVLENBQUM7UUFDaEMsU0FBSSxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNqQixVQUFLLEdBQUcsS0FBSyxDQUFDLGNBQWMsQ0FBQyxDQUFDO1FBQzlCLFlBQU8sR0FBRyxLQUFLLENBQUMsRUFBRSxDQUFDLENBQUM7UUFDcEIsZUFBVSxHQUFHLEtBQUssRUFBeUIsQ0FBQztRQUNyRCxlQUFVLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBRWhDLGVBQVUsR0FBb0IsSUFBSSxDQUFDO1FBRzNCLGNBQVMsR0FBRyxNQUFNLENBQUMsWUFBWSxDQUFDLENBQUM7UUFDakMsZ0JBQVcsR0FBRyxNQUFNLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDbEMsUUFBRyxHQUFHLE1BQU0sQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBR3RDLE1BQU0sQ0FBQyxHQUFHLEVBQUU7WUFDVixJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDO1FBQ2xDLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLGFBQWEsQ0FBQyxPQUFlO1FBQ25DLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUNyQyxPQUFnRCxFQUNoRCxJQUFJLENBQUMsVUFBVSxFQUFFLElBQUksVUFBVSxDQUNoQyxDQUFDO1FBRUYsT0FBTyxDQUFDLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxHQUFHLEVBQUUsRUFBRTtZQUNsRSxNQUFNLElBQUksR0FBRyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7WUFDekIsTUFBTSxXQUFXLEdBQUcsR0FBRyxDQUFDLE9BQU8sQ0FBQyxjQUFjLEVBQUUsaUJBQWlCLElBQUksYUFBYSxJQUFJLElBQUksQ0FBQyxDQUFDO1lBRTVGLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyx1QkFBdUIsQ0FBQyxXQUFXLENBQUMsQ0FBQztZQUN0RSxJQUFJLENBQUMsR0FBRyxDQUFDLFlBQVksRUFBRSxDQUFDO1FBQzFCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0FsQ1UsYUFBYTttR0FBYixhQUFhLHlxQkFGYixDQUFDLFdBQVcsQ0FBQywwQkN2QjFCLHNJQUE0SCxxVURrQmhILFlBQVk7OzRGQU9YLGFBQWE7a0JBVHpCLFNBQVM7K0JBQ0UsVUFBVSxXQUNYLENBQUMsWUFBWSxDQUFDLGNBQ1gsSUFBSSxtQkFHQyx1QkFBdUIsQ0FBQyxNQUFNLGFBQ3BDLENBQUMsV0FBVyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBDb21wb25lbnQsXG4gIERlc3Ryb3lSZWYsXG4gIGVmZmVjdCxcbiAgaW5qZWN0LFxuICBpbnB1dCxcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IHRha2VVbnRpbERlc3Ryb3llZCB9IGZyb20gXCJAYW5ndWxhci9jb3JlL3J4anMtaW50ZXJvcFwiO1xuaW1wb3J0IHsgRG9tU2FuaXRpemVyLCBTYWZlSHRtbCB9IGZyb20gXCJAYW5ndWxhci9wbGF0Zm9ybS1icm93c2VyXCI7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcblxuaW1wb3J0IHsgSWNvblNlcnZpY2UsIFJlZ3VsYXJJY29uSWRLZXksIFRvZ2dsYWJsZUljb25JZEtleSB9IGZyb20gXCIuL2ljb24uc2VydmljZVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwicnRlLWljb25cIixcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIHRlbXBsYXRlVXJsOiBcIi4vaWNvbi5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybDogXCIuL2ljb24uY29tcG9uZW50LnNjc3NcIixcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHByb3ZpZGVyczogW0ljb25TZXJ2aWNlXSxcbn0pXG5leHBvcnQgY2xhc3MgSWNvbkNvbXBvbmVudCB7XG4gIHJlYWRvbmx5IG5hbWUgPSBpbnB1dC5yZXF1aXJlZDxzdHJpbmc+KCk7XG4gIHJlYWRvbmx5IHNpemUgPSBpbnB1dCgyMCk7XG4gIHJlYWRvbmx5IGNvbG9yID0gaW5wdXQoXCJjdXJyZW50Q29sb3JcIik7XG4gIHJlYWRvbmx5IGNsYXNzZXMgPSBpbnB1dChcIlwiKTtcbiAgcmVhZG9ubHkgYXBwZWFyYW5jZSA9IGlucHV0PFwib3V0bGluZWRcIiB8IFwiZmlsbGVkXCI+KCk7XG4gIGRlc3Ryb3lSZWYgPSBpbmplY3QoRGVzdHJveVJlZik7XG5cbiAgc3ZnQ29udGVudDogU2FmZUh0bWwgfCBudWxsID0gbnVsbDtcbiAgc3ZnITogT2JzZXJ2YWJsZTxzdHJpbmc+O1xuXG4gIHByaXZhdGUgc2FuaXRpemVyID0gaW5qZWN0KERvbVNhbml0aXplcik7XG4gIHByaXZhdGUgaWNvblNlcnZpY2UgPSBpbmplY3QoSWNvblNlcnZpY2UpO1xuICBwcml2YXRlIGNkciA9IGluamVjdChDaGFuZ2VEZXRlY3RvclJlZik7XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgZWZmZWN0KCgpID0+IHtcbiAgICAgIHRoaXMuc2V0U3ZnQ29udGVudCh0aGlzLm5hbWUoKSk7XG4gICAgfSk7XG4gIH1cblxuICBwcml2YXRlIHNldFN2Z0NvbnRlbnQoc3ZnTmFtZTogc3RyaW5nKSB7XG4gICAgY29uc3Qgc3ZnRmlsZSA9IHRoaXMuaWNvblNlcnZpY2UuZ2V0U3ZnKFxuICAgICAgc3ZnTmFtZSBhcyBSZWd1bGFySWNvbklkS2V5IHwgVG9nZ2xhYmxlSWNvbklkS2V5LFxuICAgICAgdGhpcy5hcHBlYXJhbmNlKCkgfHwgXCJvdXRsaW5lZFwiLFxuICAgICk7XG5cbiAgICBzdmdGaWxlLnBpcGUodGFrZVVudGlsRGVzdHJveWVkKHRoaXMuZGVzdHJveVJlZikpLnN1YnNjcmliZSgocmVzKSA9PiB7XG4gICAgICBjb25zdCBzaXplID0gdGhpcy5zaXplKCk7XG4gICAgICBjb25zdCBzdmdXaXRoU2l6ZSA9IHJlcy5yZXBsYWNlKC88c3ZnKFtePl0qKT4vLCBgPHN2ZyQxIHdpZHRoPVwiJHtzaXplfVwiIGhlaWdodD1cIiR7c2l6ZX1cIj5gKTtcblxuICAgICAgdGhpcy5zdmdDb250ZW50ID0gdGhpcy5zYW5pdGl6ZXIuYnlwYXNzU2VjdXJpdHlUcnVzdEh0bWwoc3ZnV2l0aFNpemUpO1xuICAgICAgdGhpcy5jZHIubWFya0ZvckNoZWNrKCk7XG4gICAgfSk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJydGUtaWNvbi1jb250YWluZXJcIiBbaW5uZXJIVE1MXT1cInN2Z0NvbnRlbnRcIiBbc3R5bGUuaGVpZ2h0XT1cIihzaXplKCkpKydweCdcIiBbc3R5bGUud2lkdGhdPVwiKHNpemUoKSkrJ3B4J1wiPjwvZGl2PiJdfQ==
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { CommonModule } from "@angular/common";
|
|
2
|
+
import { Component, ElementRef, inject, input, output } from "@angular/core";
|
|
3
|
+
import { FOCUSABLE_ELEMENTS_QUERY } from "@design-system-rte/core/constants/dom/dom.constants";
|
|
4
|
+
import { TAB_KEY } from "@design-system-rte/core/constants/keyboard/keyboard.constants";
|
|
5
|
+
import { ButtonComponent } from "../button/button.component";
|
|
6
|
+
import * as i0 from "@angular/core";
|
|
7
|
+
import * as i1 from "@angular/common";
|
|
8
|
+
export class PopoverComponent {
|
|
9
|
+
constructor() {
|
|
10
|
+
this.primaryButtonLabel = input.required();
|
|
11
|
+
this.position = input.required();
|
|
12
|
+
this.alignment = input();
|
|
13
|
+
this.content = input();
|
|
14
|
+
this.arrow = input();
|
|
15
|
+
this.title = input();
|
|
16
|
+
this.secondaryButtonLabel = input();
|
|
17
|
+
this.isOpen = input(false);
|
|
18
|
+
this.coordinates = input({ top: 0, left: 0 });
|
|
19
|
+
this.clickPrimaryButton = output();
|
|
20
|
+
this.clickSecondaryButton = output();
|
|
21
|
+
this.elementRef = inject(ElementRef);
|
|
22
|
+
this.element = this.elementRef.nativeElement;
|
|
23
|
+
}
|
|
24
|
+
ngAfterViewInit() {
|
|
25
|
+
this.focusFirstElement();
|
|
26
|
+
}
|
|
27
|
+
handleKeydown(event) {
|
|
28
|
+
if (event.key === TAB_KEY) {
|
|
29
|
+
if (this.isOpen()) {
|
|
30
|
+
const focusable = this.element.querySelectorAll(FOCUSABLE_ELEMENTS_QUERY);
|
|
31
|
+
const first = focusable[0];
|
|
32
|
+
const last = focusable[focusable.length - 1];
|
|
33
|
+
if (event.shiftKey && document.activeElement === first) {
|
|
34
|
+
event.preventDefault();
|
|
35
|
+
last.focus();
|
|
36
|
+
}
|
|
37
|
+
else if (!event.shiftKey && document.activeElement === last) {
|
|
38
|
+
event.preventDefault();
|
|
39
|
+
first.focus();
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
handleClickPrimaryButton() {
|
|
45
|
+
this.clickPrimaryButton.emit();
|
|
46
|
+
}
|
|
47
|
+
handleClickSecondaryButton() {
|
|
48
|
+
this.clickSecondaryButton.emit();
|
|
49
|
+
}
|
|
50
|
+
focusFirstElement() {
|
|
51
|
+
const focusable = this.element.querySelectorAll(FOCUSABLE_ELEMENTS_QUERY);
|
|
52
|
+
if (focusable.length > 0)
|
|
53
|
+
focusable[0].focus();
|
|
54
|
+
}
|
|
55
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
56
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: PopoverComponent, isStandalone: true, selector: "rte-popover", inputs: { primaryButtonLabel: { classPropertyName: "primaryButtonLabel", publicName: "primaryButtonLabel", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: true, transformFunction: null }, alignment: { classPropertyName: "alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, arrow: { classPropertyName: "arrow", publicName: "arrow", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, secondaryButtonLabel: { classPropertyName: "secondaryButtonLabel", publicName: "secondaryButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, coordinates: { classPropertyName: "coordinates", publicName: "coordinates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickPrimaryButton: "clickPrimaryButton", clickSecondaryButton: "clickSecondaryButton" }, ngImport: i0, template: "<div\n #root\n class=\"rte-popover\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.data-arrow]=\"arrow()\"\n [attr.data-position]=\"position()\"\n [attr.data-alignment]=\"alignment()\"\n [attr.data-open]=\"isOpen()\"\n [style]=\"{ top: coordinates().top + 'px', left: coordinates().left + 'px' }\"\n (keydown)=\"handleKeydown($event)\"\n>\n <div class=\"popoverInner\">\n <div class=\"popoverContentContainer\">\n <div *ngIf=\"title\" class=\"popoverTitle\">{{ title() }}</div>\n <div class=\"popoverContent\">{{ content() }}</div>\n </div>\n <div class=\"popoverButtonContainer\">\n <rte-button\n *ngIf=\"secondaryButtonLabel()\"\n variant=\"secondary\"\n [label]=\"secondaryButtonLabel() || ''\"\n (click)=\"handleClickSecondaryButton()\"\n />\n <rte-button\n variant=\"primary\"\n [label]=\"primaryButtonLabel()\"\n (click)=\"handleClickPrimaryButton()\"\n />\n </div>\n </div>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-popoverTrigger{position:relative;width:max-content}.rte-popover{position:absolute;pointer-events:auto;top:0;left:0;padding:0;display:flex;flex-direction:column;gap:0px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.12)) drop-shadow(0 2px 4px rgba(0,0,0,.08));background-color:var(--background-default);transition:opacity .15s ease-out;opacity:0;z-index:1000;min-width:320px;max-width:600px;width:fit-content;height:fit-content}.rte-popover .popoverInner{display:flex;flex-direction:column;align-items:flex-start;padding:24px;gap:24px;border-radius:4px}.rte-popover .popoverInner .popoverContentContainer{display:flex;flex-direction:column;align-items:flex-start;padding:0;gap:16px}.rte-popover .popoverInner .popoverContentContainer .popoverTitle{overflow:hidden;text-overflow:ellipsis;color:var(--content-primary);font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:24px;line-height:32px;letter-spacing:-.5px}.rte-popover .popoverInner .popoverContentContainer .popoverContent{color:var(--content-secondary);font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:14px;line-height:20px;letter-spacing:0px;width:100%;word-break:break-word}.rte-popover .popoverInner .popoverButtonContainer{display:flex;justify-content:flex-end;align-items:flex-start;padding:0;gap:24px;width:100%}.rte-popover:after{content:\"\";position:absolute;border-width:12px;border-style:solid}.rte-popover[data-position=top]:after{top:100%;left:50%;margin-left:-12px;border-color:var(--background-default) transparent transparent transparent}.rte-popover[data-position=top][data-alignment=start]:after{left:20px}.rte-popover[data-position=top][data-alignment=end]:after{left:auto;right:20px}.rte-popover[data-position=bottom]:after{bottom:100%;left:50%;margin-left:-12px;border-color:transparent transparent var(--background-default) transparent}.rte-popover[data-position=bottom][data-alignment=start]:after{left:20px}.rte-popover[data-position=bottom][data-alignment=end]:after{left:auto;right:20px}.rte-popover[data-position=left]:after{top:50%;left:100%;margin-top:-12px;border-color:transparent transparent transparent var(--background-default)}.rte-popover[data-position=left][data-alignment=start]:after{top:20px}.rte-popover[data-position=left][data-alignment=end]:after{top:auto;bottom:20px}.rte-popover[data-position=right]:after{top:50%;right:100%;margin-top:-12px;border-color:transparent var(--background-default) transparent transparent}.rte-popover[data-position=right][data-alignment=start]:after{top:20px}.rte-popover[data-position=right][data-alignment=end]:after{top:auto;bottom:20px}.rte-popover[data-arrow=false]:after{display:none}.rte-popover[data-open=true]{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "rte-button", inputs: ["label", "variant", "size", "disabled", "icon", "ariaLabel", "ariaLabelledBy", "buttonType"], outputs: ["click"] }] }); }
|
|
57
|
+
}
|
|
58
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PopoverComponent, decorators: [{
|
|
59
|
+
type: Component,
|
|
60
|
+
args: [{ selector: "rte-popover", imports: [CommonModule, ButtonComponent], standalone: true, template: "<div\n #root\n class=\"rte-popover\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.data-arrow]=\"arrow()\"\n [attr.data-position]=\"position()\"\n [attr.data-alignment]=\"alignment()\"\n [attr.data-open]=\"isOpen()\"\n [style]=\"{ top: coordinates().top + 'px', left: coordinates().left + 'px' }\"\n (keydown)=\"handleKeydown($event)\"\n>\n <div class=\"popoverInner\">\n <div class=\"popoverContentContainer\">\n <div *ngIf=\"title\" class=\"popoverTitle\">{{ title() }}</div>\n <div class=\"popoverContent\">{{ content() }}</div>\n </div>\n <div class=\"popoverButtonContainer\">\n <rte-button\n *ngIf=\"secondaryButtonLabel()\"\n variant=\"secondary\"\n [label]=\"secondaryButtonLabel() || ''\"\n (click)=\"handleClickSecondaryButton()\"\n />\n <rte-button\n variant=\"primary\"\n [label]=\"primaryButtonLabel()\"\n (click)=\"handleClickPrimaryButton()\"\n />\n </div>\n </div>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-popoverTrigger{position:relative;width:max-content}.rte-popover{position:absolute;pointer-events:auto;top:0;left:0;padding:0;display:flex;flex-direction:column;gap:0px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.12)) drop-shadow(0 2px 4px rgba(0,0,0,.08));background-color:var(--background-default);transition:opacity .15s ease-out;opacity:0;z-index:1000;min-width:320px;max-width:600px;width:fit-content;height:fit-content}.rte-popover .popoverInner{display:flex;flex-direction:column;align-items:flex-start;padding:24px;gap:24px;border-radius:4px}.rte-popover .popoverInner .popoverContentContainer{display:flex;flex-direction:column;align-items:flex-start;padding:0;gap:16px}.rte-popover .popoverInner .popoverContentContainer .popoverTitle{overflow:hidden;text-overflow:ellipsis;color:var(--content-primary);font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:24px;line-height:32px;letter-spacing:-.5px}.rte-popover .popoverInner .popoverContentContainer .popoverContent{color:var(--content-secondary);font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:14px;line-height:20px;letter-spacing:0px;width:100%;word-break:break-word}.rte-popover .popoverInner .popoverButtonContainer{display:flex;justify-content:flex-end;align-items:flex-start;padding:0;gap:24px;width:100%}.rte-popover:after{content:\"\";position:absolute;border-width:12px;border-style:solid}.rte-popover[data-position=top]:after{top:100%;left:50%;margin-left:-12px;border-color:var(--background-default) transparent transparent transparent}.rte-popover[data-position=top][data-alignment=start]:after{left:20px}.rte-popover[data-position=top][data-alignment=end]:after{left:auto;right:20px}.rte-popover[data-position=bottom]:after{bottom:100%;left:50%;margin-left:-12px;border-color:transparent transparent var(--background-default) transparent}.rte-popover[data-position=bottom][data-alignment=start]:after{left:20px}.rte-popover[data-position=bottom][data-alignment=end]:after{left:auto;right:20px}.rte-popover[data-position=left]:after{top:50%;left:100%;margin-top:-12px;border-color:transparent transparent transparent var(--background-default)}.rte-popover[data-position=left][data-alignment=start]:after{top:20px}.rte-popover[data-position=left][data-alignment=end]:after{top:auto;bottom:20px}.rte-popover[data-position=right]:after{top:50%;right:100%;margin-top:-12px;border-color:transparent var(--background-default) transparent transparent}.rte-popover[data-position=right][data-alignment=start]:after{top:20px}.rte-popover[data-position=right][data-alignment=end]:after{top:auto;bottom:20px}.rte-popover[data-arrow=false]:after{display:none}.rte-popover[data-open=true]{opacity:1}\n"] }]
|
|
61
|
+
}], ctorParameters: () => [] });
|
|
62
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicG9wb3Zlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kcy1ydGUtbGliL3NyYy9saWIvY29tcG9uZW50cy9wb3BvdmVyL3BvcG92ZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvcG9wb3Zlci9wb3BvdmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFFNUYsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0scURBQXFELENBQUM7QUFDL0YsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLCtEQUErRCxDQUFDO0FBRXhGLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQzs7O0FBUzdELE1BQU0sT0FBTyxnQkFBZ0I7SUFrQjNCO1FBakJTLHVCQUFrQixHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQVUsQ0FBQztRQUM5QyxhQUFRLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBb0MsQ0FBQztRQUM5RCxjQUFTLEdBQUcsS0FBSyxFQUFvQixDQUFDO1FBQ3RDLFlBQU8sR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUMxQixVQUFLLEdBQUcsS0FBSyxFQUFXLENBQUM7UUFDekIsVUFBSyxHQUFHLEtBQUssRUFBVSxDQUFDO1FBQ3hCLHlCQUFvQixHQUFHLEtBQUssRUFBVSxDQUFDO1FBQ3ZDLFdBQU0sR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFDL0IsZ0JBQVcsR0FBRyxLQUFLLENBQWdDLEVBQUUsR0FBRyxFQUFFLENBQUMsRUFBRSxJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUV4RSx1QkFBa0IsR0FBRyxNQUFNLEVBQVEsQ0FBQztRQUNwQyx5QkFBb0IsR0FBRyxNQUFNLEVBQVEsQ0FBQztRQUl2QyxlQUFVLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBR3RDLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUM7SUFDL0MsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztJQUMzQixDQUFDO0lBRUQsYUFBYSxDQUFDLEtBQW9CO1FBQ2hDLElBQUksS0FBSyxDQUFDLEdBQUcsS0FBSyxPQUFPLEVBQUUsQ0FBQztZQUMxQixJQUFJLElBQUksQ0FBQyxNQUFNLEVBQUUsRUFBRSxDQUFDO2dCQUNsQixNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLGdCQUFnQixDQUFDLHdCQUF3QixDQUFDLENBQUM7Z0JBQzFFLE1BQU0sS0FBSyxHQUFHLFNBQVMsQ0FBQyxDQUFDLENBQWdCLENBQUM7Z0JBQzFDLE1BQU0sSUFBSSxHQUFHLFNBQVMsQ0FBQyxTQUFTLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBZ0IsQ0FBQztnQkFDNUQsSUFBSSxLQUFLLENBQUMsUUFBUSxJQUFJLFFBQVEsQ0FBQyxhQUFhLEtBQUssS0FBSyxFQUFFLENBQUM7b0JBQ3ZELEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztvQkFDdkIsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO2dCQUNmLENBQUM7cUJBQU0sSUFBSSxDQUFDLEtBQUssQ0FBQyxRQUFRLElBQUksUUFBUSxDQUFDLGFBQWEsS0FBSyxJQUFJLEVBQUUsQ0FBQztvQkFDOUQsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO29CQUN2QixLQUFLLENBQUMsS0FBSyxFQUFFLENBQUM7Z0JBQ2hCLENBQUM7WUFDSCxDQUFDO1FBQ0gsQ0FBQztJQUNILENBQUM7SUFFRCx3QkFBd0I7UUFDdEIsSUFBSSxDQUFDLGtCQUFrQixDQUFDLElBQUksRUFBRSxDQUFDO0lBQ2pDLENBQUM7SUFDRCwwQkFBMEI7UUFDeEIsSUFBSSxDQUFDLG9CQUFvQixDQUFDLElBQUksRUFBRSxDQUFDO0lBQ25DLENBQUM7SUFFTyxpQkFBaUI7UUFDdkIsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxnQkFBZ0IsQ0FBQyx3QkFBd0IsQ0FBQyxDQUFDO1FBQzFFLElBQUksU0FBUyxDQUFDLE1BQU0sR0FBRyxDQUFDO1lBQUcsU0FBUyxDQUFDLENBQUMsQ0FBaUIsQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUNsRSxDQUFDOytHQXJEVSxnQkFBZ0I7bUdBQWhCLGdCQUFnQixrM0NDZjdCLHErQkFnQ0EsaS9GRHRCWSxZQUFZLG1JQUFFLGVBQWU7OzRGQUs1QixnQkFBZ0I7a0JBUDVCLFNBQVM7K0JBQ0UsYUFBYSxXQUNkLENBQUMsWUFBWSxFQUFFLGVBQWUsQ0FBQyxjQUM1QixJQUFJIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBpbmplY3QsIGlucHV0LCBvdXRwdXQsIEFmdGVyVmlld0luaXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgUG9wb3ZlckFsaWdubWVudCwgUG9wb3ZlclBvc2l0aW9uIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvcG9wb3Zlci9wb3BvdmVyLmludGVyZmFjZVwiO1xuaW1wb3J0IHsgRk9DVVNBQkxFX0VMRU1FTlRTX1FVRVJZIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbnN0YW50cy9kb20vZG9tLmNvbnN0YW50c1wiO1xuaW1wb3J0IHsgVEFCX0tFWSB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb25zdGFudHMva2V5Ym9hcmQva2V5Ym9hcmQuY29uc3RhbnRzXCI7XG5cbmltcG9ydCB7IEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gXCIuLi9idXR0b24vYnV0dG9uLmNvbXBvbmVudFwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwicnRlLXBvcG92ZXJcIixcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgQnV0dG9uQ29tcG9uZW50XSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9wb3BvdmVyLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsOiBcIi4vcG9wb3Zlci5jb21wb25lbnQuc2Nzc1wiLFxufSlcbmV4cG9ydCBjbGFzcyBQb3BvdmVyQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XG4gIHJlYWRvbmx5IHByaW1hcnlCdXR0b25MYWJlbCA9IGlucHV0LnJlcXVpcmVkPHN0cmluZz4oKTtcbiAgcmVhZG9ubHkgcG9zaXRpb24gPSBpbnB1dC5yZXF1aXJlZDxFeGNsdWRlPFBvcG92ZXJQb3NpdGlvbiwgXCJhdXRvXCI+PigpO1xuICByZWFkb25seSBhbGlnbm1lbnQgPSBpbnB1dDxQb3BvdmVyQWxpZ25tZW50PigpO1xuICByZWFkb25seSBjb250ZW50ID0gaW5wdXQ8c3RyaW5nPigpO1xuICByZWFkb25seSBhcnJvdyA9IGlucHV0PGJvb2xlYW4+KCk7XG4gIHJlYWRvbmx5IHRpdGxlID0gaW5wdXQ8c3RyaW5nPigpO1xuICByZWFkb25seSBzZWNvbmRhcnlCdXR0b25MYWJlbCA9IGlucHV0PHN0cmluZz4oKTtcbiAgcmVhZG9ubHkgaXNPcGVuID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpO1xuICByZWFkb25seSBjb29yZGluYXRlcyA9IGlucHV0PHsgdG9wOiBudW1iZXI7IGxlZnQ6IG51bWJlciB9Pih7IHRvcDogMCwgbGVmdDogMCB9KTtcblxuICByZWFkb25seSBjbGlja1ByaW1hcnlCdXR0b24gPSBvdXRwdXQ8dm9pZD4oKTtcbiAgcmVhZG9ubHkgY2xpY2tTZWNvbmRhcnlCdXR0b24gPSBvdXRwdXQ8dm9pZD4oKTtcblxuICBwcml2YXRlIGVsZW1lbnQ6IEhUTUxFbGVtZW50O1xuXG4gIHByaXZhdGUgZWxlbWVudFJlZiA9IGluamVjdChFbGVtZW50UmVmKTtcblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgICB0aGlzLmVsZW1lbnQgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICB0aGlzLmZvY3VzRmlyc3RFbGVtZW50KCk7XG4gIH1cblxuICBoYW5kbGVLZXlkb3duKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG4gICAgaWYgKGV2ZW50LmtleSA9PT0gVEFCX0tFWSkge1xuICAgICAgaWYgKHRoaXMuaXNPcGVuKCkpIHtcbiAgICAgICAgY29uc3QgZm9jdXNhYmxlID0gdGhpcy5lbGVtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoRk9DVVNBQkxFX0VMRU1FTlRTX1FVRVJZKTtcbiAgICAgICAgY29uc3QgZmlyc3QgPSBmb2N1c2FibGVbMF0gYXMgSFRNTEVsZW1lbnQ7XG4gICAgICAgIGNvbnN0IGxhc3QgPSBmb2N1c2FibGVbZm9jdXNhYmxlLmxlbmd0aCAtIDFdIGFzIEhUTUxFbGVtZW50O1xuICAgICAgICBpZiAoZXZlbnQuc2hpZnRLZXkgJiYgZG9jdW1lbnQuYWN0aXZlRWxlbWVudCA9PT0gZmlyc3QpIHtcbiAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgIGxhc3QuZm9jdXMoKTtcbiAgICAgICAgfSBlbHNlIGlmICghZXZlbnQuc2hpZnRLZXkgJiYgZG9jdW1lbnQuYWN0aXZlRWxlbWVudCA9PT0gbGFzdCkge1xuICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgZmlyc3QuZm9jdXMoKTtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIGhhbmRsZUNsaWNrUHJpbWFyeUJ1dHRvbigpIHtcbiAgICB0aGlzLmNsaWNrUHJpbWFyeUJ1dHRvbi5lbWl0KCk7XG4gIH1cbiAgaGFuZGxlQ2xpY2tTZWNvbmRhcnlCdXR0b24oKSB7XG4gICAgdGhpcy5jbGlja1NlY29uZGFyeUJ1dHRvbi5lbWl0KCk7XG4gIH1cblxuICBwcml2YXRlIGZvY3VzRmlyc3RFbGVtZW50KCkge1xuICAgIGNvbnN0IGZvY3VzYWJsZSA9IHRoaXMuZWxlbWVudC5xdWVyeVNlbGVjdG9yQWxsKEZPQ1VTQUJMRV9FTEVNRU5UU19RVUVSWSk7XG4gICAgaWYgKGZvY3VzYWJsZS5sZW5ndGggPiAwKSAoZm9jdXNhYmxlWzBdIGFzIEhUTUxFbGVtZW50KS5mb2N1cygpO1xuICB9XG59XG4iLCI8ZGl2XG4gICNyb290XG4gIGNsYXNzPVwicnRlLXBvcG92ZXJcIlxuICByb2xlPVwiZGlhbG9nXCJcbiAgYXJpYS1tb2RhbD1cInRydWVcIlxuICBbYXR0ci5kYXRhLWFycm93XT1cImFycm93KClcIlxuICBbYXR0ci5kYXRhLXBvc2l0aW9uXT1cInBvc2l0aW9uKClcIlxuICBbYXR0ci5kYXRhLWFsaWdubWVudF09XCJhbGlnbm1lbnQoKVwiXG4gIFthdHRyLmRhdGEtb3Blbl09XCJpc09wZW4oKVwiXG4gIFtzdHlsZV09XCJ7IHRvcDogY29vcmRpbmF0ZXMoKS50b3AgKyAncHgnLCBsZWZ0OiBjb29yZGluYXRlcygpLmxlZnQgKyAncHgnIH1cIlxuICAoa2V5ZG93bik9XCJoYW5kbGVLZXlkb3duKCRldmVudClcIlxuPlxuICA8ZGl2IGNsYXNzPVwicG9wb3ZlcklubmVyXCI+XG4gICAgPGRpdiBjbGFzcz1cInBvcG92ZXJDb250ZW50Q29udGFpbmVyXCI+XG4gICAgICA8ZGl2ICpuZ0lmPVwidGl0bGVcIiBjbGFzcz1cInBvcG92ZXJUaXRsZVwiPnt7IHRpdGxlKCkgfX08L2Rpdj5cbiAgICAgIDxkaXYgY2xhc3M9XCJwb3BvdmVyQ29udGVudFwiPnt7IGNvbnRlbnQoKSB9fTwvZGl2PlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJwb3BvdmVyQnV0dG9uQ29udGFpbmVyXCI+XG4gICAgICA8cnRlLWJ1dHRvblxuICAgICAgICAqbmdJZj1cInNlY29uZGFyeUJ1dHRvbkxhYmVsKClcIlxuICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgW2xhYmVsXT1cInNlY29uZGFyeUJ1dHRvbkxhYmVsKCkgfHwgJydcIlxuICAgICAgICAoY2xpY2spPVwiaGFuZGxlQ2xpY2tTZWNvbmRhcnlCdXR0b24oKVwiXG4gICAgICAvPlxuICAgICAgPHJ0ZS1idXR0b25cbiAgICAgICAgdmFyaWFudD1cInByaW1hcnlcIlxuICAgICAgICBbbGFiZWxdPVwicHJpbWFyeUJ1dHRvbkxhYmVsKClcIlxuICAgICAgICAoY2xpY2spPVwiaGFuZGxlQ2xpY2tQcmltYXJ5QnV0dG9uKClcIlxuICAgICAgLz5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|