@design-system-rte/angular 0.16.0 → 1.0.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/README.md +1 -1
- package/esm2022/lib/components/badge/badge.component.mjs +3 -3
- package/esm2022/lib/components/banner/banner.component.mjs +14 -6
- package/esm2022/lib/components/breadcrumbs/breadcrumb-item/breadcrumb-item.component.mjs +1 -1
- package/esm2022/lib/components/button/button.component.mjs +11 -4
- package/esm2022/lib/components/card/card.component.mjs +40 -0
- package/esm2022/lib/components/divider/divider.component.mjs +3 -3
- package/esm2022/lib/components/icon-button/icon-button.component.mjs +3 -3
- package/esm2022/lib/components/icon-button-toggle/icon-button-toggle.component.mjs +3 -3
- package/esm2022/lib/components/popover/popover.component.mjs +1 -1
- package/esm2022/lib/components/side-nav/base-side-nav/base-side-nav.component.mjs +63 -0
- package/esm2022/lib/components/side-nav/nav-item/nav-item.component.mjs +58 -0
- package/esm2022/lib/components/side-nav/nav-menu/nav-menu.component.mjs +90 -0
- package/esm2022/lib/components/side-nav/side-nav.component.mjs +96 -0
- package/esm2022/lib/components/toast/toast.component.mjs +57 -0
- package/esm2022/lib/components/toast/toast.service.mjs +114 -0
- package/esm2022/lib/components/tooltip/tooltip.component.mjs +3 -3
- package/esm2022/lib/components/tooltip/tooltip.directive.mjs +11 -8
- package/esm2022/lib/services/overlay.service.mjs +9 -1
- package/esm2022/public-api.mjs +5 -1
- package/fesm2022/design-system-rte-angular.mjs +519 -26
- package/fesm2022/design-system-rte-angular.mjs.map +1 -1
- package/lib/components/badge/badge.directive.d.ts +1 -1
- package/lib/components/banner/banner.component.d.ts +3 -2
- package/lib/components/button/button.component.d.ts +5 -1
- package/lib/components/card/card.component.d.ts +19 -0
- package/lib/components/icon-button/icon-button.component.d.ts +3 -3
- package/lib/components/icon-button-toggle/icon-button-toggle.component.d.ts +2 -2
- package/lib/components/side-nav/base-side-nav/base-side-nav.component.d.ts +26 -0
- package/lib/components/side-nav/nav-item/nav-item.component.d.ts +28 -0
- package/lib/components/side-nav/nav-menu/nav-menu.component.d.ts +42 -0
- package/lib/components/side-nav/side-nav.component.d.ts +33 -0
- package/lib/components/split-button/split-button.component.d.ts +1 -1
- package/lib/components/text-input/text-input.component.d.ts +3 -3
- package/lib/components/toast/toast.component.d.ts +30 -0
- package/lib/components/toast/toast.service.d.ts +34 -0
- package/lib/components/tooltip/tooltip.directive.d.ts +4 -3
- package/lib/services/overlay.service.d.ts +2 -0
- package/package.json +2 -2
- package/public-api.d.ts +4 -0
package/README.md
CHANGED
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
|
|
21
21
|
3. **Use Components:**
|
|
22
22
|
|
|
23
|
-
Implement the different components as documented in the [Storybook](https://opensource.rte-france.com/design-system-rte/?path=/docs/
|
|
23
|
+
Implement the different components as documented in the [Storybook](https://opensource.rte-france.com/design-system-rte/?path=/docs/angular_composants-button--docs) provided with the library.
|
|
24
24
|
|
|
25
25
|
4. **Icon Component Usage:**
|
|
26
26
|
|
|
@@ -35,10 +35,10 @@ export class BadgeComponent {
|
|
|
35
35
|
}));
|
|
36
36
|
}
|
|
37
37
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", 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
|
|
38
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", 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:-3;right:-3}.badge.size-s{width:12px;height:12px;top:-6px;right:-6px}.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:-8px;right:-8px;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:-12px;right:-12px;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 }); }
|
|
39
39
|
}
|
|
40
40
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
41
41
|
type: Component,
|
|
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
|
|
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:-3;right:-3}.badge.size-s{width:12px;height:12px;top:-6px;right:-6px}.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:-8px;right:-8px;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:-12px;right:-12px;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"] }]
|
|
43
43
|
}] });
|
|
44
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
44
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBRSx1QkFBdUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUVwRixPQUFPLEVBQ0wsZ0JBQWdCLEVBQ2hCLGVBQWUsRUFDZixZQUFZLEVBQ1osV0FBVyxFQUNYLFdBQVcsR0FDWixNQUFNLHNEQUFzRCxDQUFDO0FBRTlELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQztBQUNuRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7OztBQVV2RCxNQUFNLE9BQU8sY0FBYztJQVIzQjtRQVNXLGNBQVMsR0FBRyxLQUFLLENBQVksT0FBTyxDQUFDLENBQUM7UUFDdEMsY0FBUyxHQUFHLEtBQUssQ0FBWSxHQUFHLENBQUMsQ0FBQztRQUNsQyxpQkFBWSxHQUFHLEtBQUssQ0FBZSxRQUFRLENBQUMsQ0FBQztRQUM3QyxVQUFLLEdBQUcsS0FBSyxFQUFzQixDQUFDO1FBQ3BDLFNBQUksR0FBRyxLQUFLLENBQVMsY0FBYyxDQUFDLENBQUM7UUFDckMsZ0JBQVcsR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFFcEMsb0JBQWUsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFFL0QsYUFBUSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FDaEMsV0FBVyxDQUFDO1lBQ1YsSUFBSSxFQUFFLElBQUksQ0FBQyxTQUFTLEVBQUU7WUFDdEIsT0FBTyxFQUFFLElBQUksQ0FBQyxZQUFZLEVBQUU7WUFDNUIsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRLEVBQUU7U0FDMUIsQ0FBQyxDQUNILENBQUM7UUFFTyxhQUFRLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUNoQyxXQUFXLENBQUM7WUFDVixJQUFJLEVBQUUsSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUN0QixPQUFPLEVBQUUsSUFBSSxDQUFDLFlBQVksRUFBRTtZQUM1QixLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRTtTQUNwQixDQUFDLENBQ0gsQ0FBQztRQUVPLGlCQUFZLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBQzdELGtCQUFhLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsSUFBSSxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFDO1FBQ2xGLGFBQVEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUU5RCxjQUFTLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUNqQyxZQUFZLENBQUM7WUFDWCxJQUFJLEVBQUUsSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUN0QixPQUFPLEVBQUUsSUFBSSxDQUFDLFlBQVksRUFBRTtZQUM1QixLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNuQixRQUFRLEVBQUUsSUFBSSxDQUFDLFFBQVEsRUFBRTtTQUMxQixDQUFDLENBQ0gsQ0FBQztLQUNIOytHQXRDWSxjQUFjO21HQUFkLGNBQWMsNjFCQ3RCM0IsMmJBZ0JBLDZwRURBWSxZQUFZLGlPQUFFLGFBQWE7OzRGQU0xQixjQUFjO2tCQVIxQixTQUFTOytCQUNFLFdBQVcsV0FDWixDQUFDLFlBQVksRUFBRSxhQUFhLENBQUMsY0FDMUIsSUFBSSxtQkFHQyx1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBpbnB1dCwgY29tcHV0ZWQsIENoYW5nZURldGVjdGlvblN0cmF0ZWd5IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJhZGdlQ29udGVudCwgQmFkZ2VTaXplLCBCYWRnZVR5cGUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5pbnRlcmZhY2VcIjtcbmltcG9ydCB7XG4gIGdldEJhZGdlSWNvblNpemUsXG4gIGdldERpc3BsYXlDb3VudCxcbiAgZ2V0U2hvd0JhZGdlLFxuICBnZXRTaG93SWNvbixcbiAgZ2V0U2hvd1RleHQsXG59IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2JhZGdlL2JhZGdlLnV0aWxzXCI7XG5cbmltcG9ydCB7IGlzVmFsaWRJY29uTmFtZSB9IGZyb20gXCIuLi9pY29uL2ljb24tbWFwXCI7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5jb21wb25lbnRcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInJ0ZS1iYWRnZVwiLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJY29uQ29tcG9uZW50XSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9iYWRnZS5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybDogXCIuL2JhZGdlLmNvbXBvbmVudC5zY3NzXCIsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBCYWRnZUNvbXBvbmVudCB7XG4gIHJlYWRvbmx5IGJhZGdlVHlwZSA9IGlucHV0PEJhZGdlVHlwZT4oXCJicmFuZFwiKTtcbiAgcmVhZG9ubHkgYmFkZ2VTaXplID0gaW5wdXQ8QmFkZ2VTaXplPihcIm1cIik7XG4gIHJlYWRvbmx5IGJhZGdlQ29udGVudCA9IGlucHV0PEJhZGdlQ29udGVudD4oXCJudW1iZXJcIik7XG4gIHJlYWRvbmx5IGNvdW50ID0gaW5wdXQ8bnVtYmVyIHwgdW5kZWZpbmVkPigpO1xuICByZWFkb25seSBpY29uID0gaW5wdXQ8c3RyaW5nPihcIm5vdGlmaWNhdGlvblwiKTtcbiAgcmVhZG9ubHkgc2ltcGxlQmFkZ2UgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG5cbiAgcmVhZG9ubHkgaXNWYWxpZEljb25OYW1lID0gY29tcHV0ZWQoKCkgPT4gaXNWYWxpZEljb25OYW1lKHRoaXMuaWNvbigpKSk7XG5cbiAgcmVhZG9ubHkgc2hvd0ljb24gPSBjb21wdXRlZCgoKSA9PlxuICAgIGdldFNob3dJY29uKHtcbiAgICAgIHNpemU6IHRoaXMuYmFkZ2VTaXplKCksXG4gICAgICBjb250ZW50OiB0aGlzLmJhZGdlQ29udGVudCgpLFxuICAgICAgaWNvblNpemU6IHRoaXMuaWNvblNpemUoKSxcbiAgICB9KSxcbiAgKTtcblxuICByZWFkb25seSBzaG93VGV4dCA9IGNvbXB1dGVkKCgpID0+XG4gICAgZ2V0U2hvd1RleHQoe1xuICAgICAgc2l6ZTogdGhpcy5iYWRnZVNpemUoKSxcbiAgICAgIGNvbnRlbnQ6IHRoaXMuYmFkZ2VDb250ZW50KCksXG4gICAgICBjb3VudDogdGhpcy5jb3VudCgpLFxuICAgIH0pLFxuICApO1xuXG4gIHJlYWRvbmx5IGRpc3BsYXlDb3VudCA9IGNvbXB1dGVkKCgpID0+IGdldERpc3BsYXlDb3VudCh0aGlzLmNvdW50KCkpKTtcbiAgcmVhZG9ubHkgY291bnRPdmVyZmxvdyA9IGNvbXB1dGVkKCgpID0+IHRoaXMuc2hvd1RleHQoKSAmJiB0aGlzLmRpc3BsYXlDb3VudCgpLmxlbmd0aCA+IDIpO1xuICByZWFkb25seSBpY29uU2l6ZSA9IGNvbXB1dGVkKCgpID0+IGdldEJhZGdlSWNvblNpemUodGhpcy5iYWRnZVNpemUoKSkpO1xuXG4gIHJlYWRvbmx5IHNob3dCYWRnZSA9IGNvbXB1dGVkKCgpID0+XG4gICAgZ2V0U2hvd0JhZGdlKHtcbiAgICAgIHNpemU6IHRoaXMuYmFkZ2VTaXplKCksXG4gICAgICBjb250ZW50OiB0aGlzLmJhZGdlQ29udGVudCgpLFxuICAgICAgY291bnQ6IHRoaXMuY291bnQoKSxcbiAgICAgIGljb25TaXplOiB0aGlzLmljb25TaXplKCksXG4gICAgfSksXG4gICk7XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwiYmFkZ2Ugc2l6ZS17eyBiYWRnZVNpemUoKSB9fSB0eXBlLXt7IGJhZGdlVHlwZSgpIH19XCJcbiAgZGF0YS10ZXN0aWQ9XCJiYWRnZVwiXG4gIFthdHRyLmRhdGEtc2ltcGxlLWJhZGdlXT1cInNpbXBsZUJhZGdlKClcIlxuICBbbmdDbGFzc109XCJ7IGhpZGRlbjogIXNob3dCYWRnZSgpLCAnY291bnQtb3ZlcmZsb3cnOiBjb3VudE92ZXJmbG93KCkgfVwiXG4+XG4gIDxydGUtaWNvblxuICAgICpuZ0lmPVwic2hvd0ljb24oKVwiXG4gICAgY2xhc3M9XCJiYWRnZS1pY29uXCJcbiAgICBbbmFtZV09XCJpY29uKClcIlxuICAgIFtzaXplXT1cImljb25TaXplKCkhXCJcbiAgLz5cbiAgPHNwYW4gKm5nSWY9XCJzaG93VGV4dCgpXCIgY2xhc3M9XCJiYWRnZS10ZXh0XCI+XG4gICAge3sgZGlzcGxheUNvdW50KCkgfX1cbiAgPC9zcGFuPlxuPC9kaXY+XG4iXX0=
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CommonModule } from "@angular/common";
|
|
2
|
-
import { ChangeDetectionStrategy, Component, input, output, signal, } from "@angular/core";
|
|
2
|
+
import { ChangeDetectionStrategy, Component, input, output, signal, computed, } from "@angular/core";
|
|
3
3
|
import { ButtonComponent } from "../button/button.component";
|
|
4
4
|
import { IconComponent } from "../icon/icon.component";
|
|
5
5
|
import { IconButtonComponent } from "../icon-button/icon-button.component";
|
|
@@ -7,18 +7,26 @@ import * as i0 from "@angular/core";
|
|
|
7
7
|
import * as i1 from "@angular/common";
|
|
8
8
|
export class BannerComponent {
|
|
9
9
|
constructor() {
|
|
10
|
-
this.type = input("
|
|
10
|
+
this.type = input("info");
|
|
11
11
|
this.message = input.required();
|
|
12
12
|
this.position = input("push");
|
|
13
13
|
this.title = input();
|
|
14
14
|
this.closable = input(false);
|
|
15
|
-
this.showIcon = input(false);
|
|
16
15
|
this.isOpen = input(true);
|
|
17
16
|
this.actionLabel = input();
|
|
18
17
|
this.click = output();
|
|
19
18
|
this.visible = signal(false);
|
|
20
19
|
this.rendering = signal(false);
|
|
21
20
|
this.close = output();
|
|
21
|
+
this.iconTypeMap = {
|
|
22
|
+
info: "info",
|
|
23
|
+
error: "dangerous",
|
|
24
|
+
success: "check-circle",
|
|
25
|
+
warning: "warning",
|
|
26
|
+
};
|
|
27
|
+
this.iconName = computed(() => {
|
|
28
|
+
return this.iconTypeMap[this.type()];
|
|
29
|
+
});
|
|
22
30
|
}
|
|
23
31
|
ngOnInit() {
|
|
24
32
|
this.visible.set(this.isOpen());
|
|
@@ -56,10 +64,10 @@ export class BannerComponent {
|
|
|
56
64
|
});
|
|
57
65
|
}
|
|
58
66
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
59
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", 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 },
|
|
67
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", 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 }, 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 class=\"rte-banner\"\n [ngClass]=\"{ open: visible(), close: !visible() }\"\n [attr.role]=\"type() === 'error' ? 'alert' : 'status'\"\n>\n <div class=\"rte-banner-icon\">\n <rte-icon [name]=\"iconName()\" [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 </div>\n </div>\n <button\n *ngIf=\"actionLabel()\"\n rteButton\n rteButtonVariant=\"text\"\n rteButtonSize=\"s\"\n [attr.aria-label]=\"actionLabel()!\"\n (click)=\"clickAction()\"\n >\n {{ actionLabel() }}\n </button>\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</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{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%);padding:16px;gap:16px;align-self:stretch;border-radius:0 0 4px 4px;display:flex;box-sizing:border-box;width:100%;min-width:320px;justify-content:center;align-items:center;color:var(--content-info-default);top:0;left:0;opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:10;border-bottom:8px solid var(--border-info);background-color:var(--background-default)}.rte-banner.error{color:var(--content-danger-default);border-bottom-color:var(--border-danger)}.rte-banner.success{color:var(--content-success-default);border-bottom-color:var(--border-success)}.rte-banner.warning{color:var(--content-primary);border-bottom-color:var(--border-warning)}.rte-banner.overlay{position:fixed}.rte-banner.open{opacity:1;transform:translateY(0)}.rte-banner.close{opacity:0;transform:translateY(-10px)}.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 .banner-close-icon{color:var(--content-secondary)}.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 .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 .rte-banner-content .rte-banner-action-button{width:max-content}.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:14px;line-height:20px;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 .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", "badgeCount", "badgeContent", "badgeType", "badgeIcon"], outputs: ["click"] }, { kind: "component", type: ButtonComponent, selector: "button[rteButton]", inputs: ["rteButtonVariant", "rteButtonSize", "rteBadgeCount", "rteBadgeContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
60
68
|
}
|
|
61
69
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BannerComponent, decorators: [{
|
|
62
70
|
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() === '
|
|
71
|
+
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 class=\"rte-banner\"\n [ngClass]=\"{ open: visible(), close: !visible() }\"\n [attr.role]=\"type() === 'error' ? 'alert' : 'status'\"\n>\n <div class=\"rte-banner-icon\">\n <rte-icon [name]=\"iconName()\" [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 </div>\n </div>\n <button\n *ngIf=\"actionLabel()\"\n rteButton\n rteButtonVariant=\"text\"\n rteButtonSize=\"s\"\n [attr.aria-label]=\"actionLabel()!\"\n (click)=\"clickAction()\"\n >\n {{ actionLabel() }}\n </button>\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</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{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%);padding:16px;gap:16px;align-self:stretch;border-radius:0 0 4px 4px;display:flex;box-sizing:border-box;width:100%;min-width:320px;justify-content:center;align-items:center;color:var(--content-info-default);top:0;left:0;opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:10;border-bottom:8px solid var(--border-info);background-color:var(--background-default)}.rte-banner.error{color:var(--content-danger-default);border-bottom-color:var(--border-danger)}.rte-banner.success{color:var(--content-success-default);border-bottom-color:var(--border-success)}.rte-banner.warning{color:var(--content-primary);border-bottom-color:var(--border-warning)}.rte-banner.overlay{position:fixed}.rte-banner.open{opacity:1;transform:translateY(0)}.rte-banner.close{opacity:0;transform:translateY(-10px)}.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 .banner-close-icon{color:var(--content-secondary)}.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 .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 .rte-banner-content .rte-banner-action-button{width:max-content}.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:14px;line-height:20px;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 .rte-banner-close-icon{color:var(--content-secondary)}\n"] }]
|
|
64
72
|
}] });
|
|
65
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
73
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFubmVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2Jhbm5lci9iYW5uZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYmFubmVyL2Jhbm5lci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUNMLHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsS0FBSyxFQUNMLE1BQU0sRUFDTixNQUFNLEVBSU4sUUFBUSxHQUNULE1BQU0sZUFBZSxDQUFDO0FBR3ZCLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUM3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdkQsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sc0NBQXNDLENBQUM7OztBQVUzRSxNQUFNLE9BQU8sZUFBZTtJQVI1QjtRQVNXLFNBQUksR0FBRyxLQUFLLENBQWEsTUFBTSxDQUFDLENBQUM7UUFDakMsWUFBTyxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQVUsQ0FBQztRQUNuQyxhQUFRLEdBQUcsS0FBSyxDQUFpQixNQUFNLENBQUMsQ0FBQztRQUN6QyxVQUFLLEdBQUcsS0FBSyxFQUFVLENBQUM7UUFDeEIsYUFBUSxHQUFHLEtBQUssQ0FBVSxLQUFLLENBQUMsQ0FBQztRQUNqQyxXQUFNLEdBQUcsS0FBSyxDQUFVLElBQUksQ0FBQyxDQUFDO1FBQzlCLGdCQUFXLEdBQUcsS0FBSyxFQUFVLENBQUM7UUFFOUIsVUFBSyxHQUFHLE1BQU0sRUFBUSxDQUFDO1FBRXZCLFlBQU8sR0FBRyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsY0FBUyxHQUFHLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUUxQixVQUFLLEdBQUcsTUFBTSxFQUFRLENBQUM7UUFFdkIsZ0JBQVcsR0FBMkI7WUFDN0MsSUFBSSxFQUFFLE1BQU07WUFDWixLQUFLLEVBQUUsV0FBVztZQUNsQixPQUFPLEVBQUUsY0FBYztZQUN2QixPQUFPLEVBQUUsU0FBUztTQUNuQixDQUFDO1FBRU8sYUFBUSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUU7WUFDaEMsT0FBTyxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDO1FBQ3ZDLENBQUMsQ0FBQyxDQUFDO0tBdUNKO0lBckNDLFFBQVE7UUFDTixJQUFJLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsQ0FBQztRQUNoQyxJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsQ0FBQztRQUNsQyxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUUsS0FBSyxLQUFLLElBQUksSUFBSSxDQUFDLFFBQVEsRUFBRSxLQUFLLFNBQVMsRUFBRSxDQUFDO1lBQy9ELE9BQU8sQ0FBQyxJQUFJLENBQUMsdUZBQXVGLENBQUMsQ0FBQztZQUN0RyxPQUFPO1FBQ1QsQ0FBQztJQUNILENBQUM7SUFFRCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxPQUFPLENBQUMsUUFBUSxDQUFDLEVBQUUsQ0FBQztZQUN0QixJQUFJLElBQUksQ0FBQyxNQUFNLEVBQUU7Z0JBQUUsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO2lCQUNoQyxDQUFDO2dCQUNKLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztZQUNyQixDQUFDO1FBQ0gsQ0FBQztJQUNILENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUNwQixDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ3hCLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUMxQixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ3BCLENBQUMsRUFBRSxHQUFHLENBQUMsQ0FBQztJQUNWLENBQUM7SUFFTyxVQUFVO1FBQ2hCLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUFFLE9BQU87UUFDN0IsSUFBSSxDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDekIscUJBQXFCLENBQUMsR0FBRyxFQUFFO1lBQ3pCLHFCQUFxQixDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDdEQsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDOytHQS9EVSxlQUFlO21HQUFmLGVBQWUscWdDQzFCNUIsd2dDQW1DQSxreUVEZlksWUFBWSxpT0FBRSxhQUFhLGlIQUFFLG1CQUFtQixnUUFBRSxlQUFlOzs0RkFNaEUsZUFBZTtrQkFSM0IsU0FBUzsrQkFDRSxZQUFZLFdBQ2IsQ0FBQyxZQUFZLEVBQUUsYUFBYSxFQUFFLG1CQUFtQixFQUFFLGVBQWUsQ0FBQyxjQUNoRSxJQUFJLG1CQUdDLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tIFwiQGFuZ3VsYXIvY29tbW9uXCI7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBpbnB1dCxcbiAgb3V0cHV0LFxuICBzaWduYWwsXG4gIFNpbXBsZUNoYW5nZXMsXG4gIE9uSW5pdCxcbiAgT25DaGFuZ2VzLFxuICBjb21wdXRlZCxcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJhbm5lclBvc2l0aW9uLCBCYW5uZXJUeXBlIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvYmFubmVyL2Jhbm5lci5pbnRlcmZhY2VcIjtcblxuaW1wb3J0IHsgQnV0dG9uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2J1dHRvbi9idXR0b24uY29tcG9uZW50XCI7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5jb21wb25lbnRcIjtcbmltcG9ydCB7IEljb25CdXR0b25Db21wb25lbnQgfSBmcm9tIFwiLi4vaWNvbi1idXR0b24vaWNvbi1idXR0b24uY29tcG9uZW50XCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJydGUtYmFubmVyXCIsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEljb25Db21wb25lbnQsIEljb25CdXR0b25Db21wb25lbnQsIEJ1dHRvbkNvbXBvbmVudF0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIHRlbXBsYXRlVXJsOiBcIi4vYmFubmVyLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsOiBcIi4vYmFubmVyLmNvbXBvbmVudC5zY3NzXCIsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBCYW5uZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG4gIHJlYWRvbmx5IHR5cGUgPSBpbnB1dDxCYW5uZXJUeXBlPihcImluZm9cIik7XG4gIHJlYWRvbmx5IG1lc3NhZ2UgPSBpbnB1dC5yZXF1aXJlZDxzdHJpbmc+KCk7XG4gIHJlYWRvbmx5IHBvc2l0aW9uID0gaW5wdXQ8QmFubmVyUG9zaXRpb24+KFwicHVzaFwiKTtcbiAgcmVhZG9ubHkgdGl0bGUgPSBpbnB1dDxzdHJpbmc+KCk7XG4gIHJlYWRvbmx5IGNsb3NhYmxlID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpO1xuICByZWFkb25seSBpc09wZW4gPSBpbnB1dDxib29sZWFuPih0cnVlKTtcbiAgcmVhZG9ubHkgYWN0aW9uTGFiZWwgPSBpbnB1dDxzdHJpbmc+KCk7XG5cbiAgcmVhZG9ubHkgY2xpY2sgPSBvdXRwdXQ8dm9pZD4oKTtcblxuICByZWFkb25seSB2aXNpYmxlID0gc2lnbmFsKGZhbHNlKTtcbiAgcmVhZG9ubHkgcmVuZGVyaW5nID0gc2lnbmFsKGZhbHNlKTtcblxuICByZWFkb25seSBjbG9zZSA9IG91dHB1dDx2b2lkPigpO1xuXG4gIHJlYWRvbmx5IGljb25UeXBlTWFwOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+ID0ge1xuICAgIGluZm86IFwiaW5mb1wiLFxuICAgIGVycm9yOiBcImRhbmdlcm91c1wiLFxuICAgIHN1Y2Nlc3M6IFwiY2hlY2stY2lyY2xlXCIsXG4gICAgd2FybmluZzogXCJ3YXJuaW5nXCIsXG4gIH07XG5cbiAgcmVhZG9ubHkgaWNvbk5hbWUgPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgcmV0dXJuIHRoaXMuaWNvblR5cGVNYXBbdGhpcy50eXBlKCldO1xuICB9KTtcblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLnZpc2libGUuc2V0KHRoaXMuaXNPcGVuKCkpO1xuICAgIHRoaXMucmVuZGVyaW5nLnNldCh0aGlzLmlzT3BlbigpKTtcbiAgICBpZiAodGhpcy5jbG9zYWJsZSgpID09PSBmYWxzZSAmJiB0aGlzLnBvc2l0aW9uKCkgPT09IFwib3ZlcmxheVwiKSB7XG4gICAgICBjb25zb2xlLndhcm4oXCJCYW5uZXI6ICdjbG9zYWJsZScgYW5kICdjbG9zZScgcHJvcHMgbXVzdCBiZSBzZXQgd2hlbiAncG9zaXRpb24nIGhhcyAnb3ZlcmxheScgdmFsdWUuXCIpO1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgfVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcbiAgICBpZiAoY2hhbmdlc1tcImlzT3BlblwiXSkge1xuICAgICAgaWYgKHRoaXMuaXNPcGVuKCkpIHRoaXMub3BlbkJhbm5lcigpO1xuICAgICAgZWxzZSB7XG4gICAgICAgIHRoaXMuY2xvc2VCYW5uZXIoKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBjbGlja0FjdGlvbigpIHtcbiAgICB0aGlzLmNsaWNrLmVtaXQoKTtcbiAgfVxuXG4gIGNsb3NlQmFubmVyKCkge1xuICAgIHRoaXMudmlzaWJsZS5zZXQoZmFsc2UpO1xuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgdGhpcy5yZW5kZXJpbmcuc2V0KGZhbHNlKTtcbiAgICAgIHRoaXMuY2xvc2UuZW1pdCgpO1xuICAgIH0sIDIwMCk7XG4gIH1cblxuICBwcml2YXRlIG9wZW5CYW5uZXIoKSB7XG4gICAgaWYgKHRoaXMucmVuZGVyaW5nKCkpIHJldHVybjtcbiAgICB0aGlzLnJlbmRlcmluZy5zZXQodHJ1ZSk7XG4gICAgcmVxdWVzdEFuaW1hdGlvbkZyYW1lKCgpID0+IHtcbiAgICAgIHJlcXVlc3RBbmltYXRpb25GcmFtZSgoKSA9PiB0aGlzLnZpc2libGUuc2V0KHRydWUpKTtcbiAgICB9KTtcbiAgfVxufVxuIiwiPHNlY3Rpb25cbiAgKm5nSWY9XCJyZW5kZXJpbmcoKVwiXG4gIGNsYXNzPVwicnRlLWJhbm5lci1jb250YWluZXIge3sgdHlwZSgpIH19IHt7IHBvc2l0aW9uKCkgfX1cIlxuICBjbGFzcz1cInJ0ZS1iYW5uZXJcIlxuICBbbmdDbGFzc109XCJ7IG9wZW46IHZpc2libGUoKSwgY2xvc2U6ICF2aXNpYmxlKCkgfVwiXG4gIFthdHRyLnJvbGVdPVwidHlwZSgpID09PSAnZXJyb3InID8gJ2FsZXJ0JyA6ICdzdGF0dXMnXCJcbj5cbiAgPGRpdiBjbGFzcz1cInJ0ZS1iYW5uZXItaWNvblwiPlxuICAgIDxydGUtaWNvbiBbbmFtZV09XCJpY29uTmFtZSgpXCIgW3NpemVdPVwiMzJcIiAvPlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cInJ0ZS1iYW5uZXItY29udGVudFwiPlxuICAgIDxzcGFuICpuZ0lmPVwidGl0bGUoKVwiIGNsYXNzPVwicnRlLWJhbm5lci10aXRsZVwiPnt7IHRpdGxlKCkgfX08L3NwYW4+XG4gICAgPGRpdiAqbmdJZj1cIm1lc3NhZ2UoKVwiIGNsYXNzPVwicnRlLWJhbm5lci1tZXNzYWdlXCI+XG4gICAgICA8c3Bhbj57eyBtZXNzYWdlKCkgfX08L3NwYW4+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuICA8YnV0dG9uXG4gICAgKm5nSWY9XCJhY3Rpb25MYWJlbCgpXCJcbiAgICBydGVCdXR0b25cbiAgICBydGVCdXR0b25WYXJpYW50PVwidGV4dFwiXG4gICAgcnRlQnV0dG9uU2l6ZT1cInNcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiYWN0aW9uTGFiZWwoKSFcIlxuICAgIChjbGljayk9XCJjbGlja0FjdGlvbigpXCJcbiAgPlxuICAgIHt7IGFjdGlvbkxhYmVsKCkgfX1cbiAgPC9idXR0b24+XG4gIDxkaXYgKm5nSWY9XCJjbG9zYWJsZSgpXCIgY2xhc3M9XCJydGUtYmFubmVyLWNsb3NlLWljb25cIj5cbiAgICA8cnRlLWljb24tYnV0dG9uXG4gICAgICBuYW1lPVwiY2xvc2VcIlxuICAgICAgdmFyaWFudD1cIm5ldXRyYWxcIlxuICAgICAgYXJpYUxhYmVsPVwiY2xvc2UgYmFubmVyXCJcbiAgICAgIChjbGljayk9XCJjbG9zZUJhbm5lcigpXCJcbiAgICAvPlxuICA8L2Rpdj5cbjwvc2VjdGlvbj5cbiJdfQ==
|
|
@@ -29,7 +29,7 @@ export class BreadcrumbItemComponent {
|
|
|
29
29
|
this.initialScrollWidth.set(el.scrollWidth);
|
|
30
30
|
}
|
|
31
31
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BreadcrumbItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
32
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: BreadcrumbItemComponent, isStandalone: true, selector: "rte-breadcrumb-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isLast: { classPropertyName: "isLast", publicName: "isLast", isSignal: true, isRequired: false, transformFunction: null }, breadcrumbItemMaxWidth: { classPropertyName: "breadcrumbItemMaxWidth", publicName: "breadcrumbItemMaxWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"rte-breadcrumb-item\">\n @if (isLast()) {\n @if (isEllipsisActive()) {\n <div\n [rteTooltip]=\"item()!.label\"\n [rteTooltipPosition]=\"'bottom'\"\n [style]=\"tooltipTriggerStyle()\"\n >\n <a\n role=\"link\"\n aria-current=\"page\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item()!.label\"\n [style]=\"linkStyle()\"\n >\n {{ item()!.label }}\n </a>\n </div>\n } @else {\n <a\n role=\"link\"\n aria-current=\"page\"\n tabindex=\"0\"\n [attr.aria-label]=\"item()!.label\"\n [style]=\"linkStyle()\"\n >\n {{ item()!.label }}\n </a>\n }\n } @else {\n @if (isEllipsisActive()) {\n <div\n [rteTooltip]=\"item()!.label\"\n [rteTooltipPosition]=\"'bottom'\"\n [style]=\"tooltipTriggerStyle()\"\n [style.overflow]=\"'unset'\"\n [rteTooltipShouldFocusTrigger]=\"false\"\n >\n <rte-link\n [href]=\"item()!.link\"\n [label]=\"item()!.label\"\n [subtle]=\"true\"\n [maxWidth]=\"breadcrumbItemMaxWidth()\"\n />\n </div>\n } @else {\n <rte-link\n [href]=\"item()!.link\"\n [label]=\"item()!.label\"\n [subtle]=\"true\"\n [maxWidth]=\"breadcrumbItemMaxWidth()\"\n />\n }\n }\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-breadcrumb-item{display:inline-flex;align-items:center;opacity:0;animation:fadeIn .15s forwards;font-family:Arial;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px}.rte-breadcrumb-item rte-link ::ng-deep a,.rte-breadcrumb-item rte-link ::ng-deep a.subtle{color:var(--content-tertiary)!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rte-breadcrumb-item a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rte-breadcrumb-item:last-child{cursor:default;color:var(--content-primary)}.rte-breadcrumb-item :focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px;border-radius:4px}@keyframes fadeIn{to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: LinkComponent, selector: "rte-link", inputs: ["label", "href", "subtle", "externalLink", "reverse", "maxWidth"] }, { kind: "directive", type: TooltipDirective, selector: "[rteTooltip]", inputs: ["rteTooltip", "rteTooltipPosition", "rteTooltipAlignment", "rteTooltipArrow", "rteTooltipShouldFocusTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
32
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: BreadcrumbItemComponent, isStandalone: true, selector: "rte-breadcrumb-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isLast: { classPropertyName: "isLast", publicName: "isLast", isSignal: true, isRequired: false, transformFunction: null }, breadcrumbItemMaxWidth: { classPropertyName: "breadcrumbItemMaxWidth", publicName: "breadcrumbItemMaxWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"rte-breadcrumb-item\">\n @if (isLast()) {\n @if (isEllipsisActive()) {\n <div\n [rteTooltip]=\"item()!.label\"\n [rteTooltipPosition]=\"'bottom'\"\n [style]=\"tooltipTriggerStyle()\"\n >\n <a\n role=\"link\"\n aria-current=\"page\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item()!.label\"\n [style]=\"linkStyle()\"\n >\n {{ item()!.label }}\n </a>\n </div>\n } @else {\n <a\n role=\"link\"\n aria-current=\"page\"\n tabindex=\"0\"\n [attr.aria-label]=\"item()!.label\"\n [style]=\"linkStyle()\"\n >\n {{ item()!.label }}\n </a>\n }\n } @else {\n @if (isEllipsisActive()) {\n <div\n [rteTooltip]=\"item()!.label\"\n [rteTooltipPosition]=\"'bottom'\"\n [style]=\"tooltipTriggerStyle()\"\n [style.overflow]=\"'unset'\"\n [rteTooltipShouldFocusTrigger]=\"false\"\n >\n <rte-link\n [href]=\"item()!.link\"\n [label]=\"item()!.label\"\n [subtle]=\"true\"\n [maxWidth]=\"breadcrumbItemMaxWidth()\"\n />\n </div>\n } @else {\n <rte-link\n [href]=\"item()!.link\"\n [label]=\"item()!.label\"\n [subtle]=\"true\"\n [maxWidth]=\"breadcrumbItemMaxWidth()\"\n />\n }\n }\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-breadcrumb-item{display:inline-flex;align-items:center;opacity:0;animation:fadeIn .15s forwards;font-family:Arial;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px}.rte-breadcrumb-item rte-link ::ng-deep a,.rte-breadcrumb-item rte-link ::ng-deep a.subtle{color:var(--content-tertiary)!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rte-breadcrumb-item a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rte-breadcrumb-item:last-child{cursor:default;color:var(--content-primary)}.rte-breadcrumb-item :focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px;border-radius:4px}@keyframes fadeIn{to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: LinkComponent, selector: "rte-link", inputs: ["label", "href", "subtle", "externalLink", "reverse", "maxWidth"] }, { kind: "directive", type: TooltipDirective, selector: "[rteTooltip]", inputs: ["rteTooltip", "rteTooltipPosition", "rteTooltipAlignment", "rteTooltipArrow", "rteTooltipShouldFocusTrigger", "rteTooltipGap"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
33
33
|
}
|
|
34
34
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BreadcrumbItemComponent, decorators: [{
|
|
35
35
|
type: Component,
|
|
@@ -1,21 +1,28 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, Component, HostBinding, input } from "@angular/core";
|
|
1
|
+
import { ChangeDetectionStrategy, Component, computed, HostBinding, input } from "@angular/core";
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export class ButtonComponent {
|
|
4
4
|
constructor() {
|
|
5
5
|
this.rteButtonVariant = input("primary");
|
|
6
6
|
this.rteButtonSize = input("m");
|
|
7
|
+
this.rteBadgeCount = input();
|
|
8
|
+
this.rteBadgeContent = input();
|
|
9
|
+
this.shouldDisplayBadge = computed(() => {
|
|
10
|
+
const count = this.rteBadgeCount();
|
|
11
|
+
const content = this.rteBadgeContent();
|
|
12
|
+
return (count && count > 0 && content === "number") || content === "icon";
|
|
13
|
+
});
|
|
7
14
|
}
|
|
8
15
|
get classes() {
|
|
9
16
|
return `rte-button ${this.rteButtonVariant()} size-${this.rteButtonSize()}`;
|
|
10
17
|
}
|
|
11
18
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: ButtonComponent, isStandalone: true, selector: "button[rteButton]", inputs: { rteButtonVariant: { classPropertyName: "rteButtonVariant", publicName: "rteButtonVariant", isSignal: true, isRequired: false, transformFunction: null }, rteButtonSize: { classPropertyName: "rteButtonSize", publicName: "rteButtonSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.classes" } }, ngImport: i0, template: "<span class=\"rte-button-label\">\n
|
|
19
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: ButtonComponent, isStandalone: true, selector: "button[rteButton]", inputs: { rteButtonVariant: { classPropertyName: "rteButtonVariant", publicName: "rteButtonVariant", isSignal: true, isRequired: false, transformFunction: null }, rteButtonSize: { classPropertyName: "rteButtonSize", publicName: "rteButtonSize", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeCount: { classPropertyName: "rteBadgeCount", publicName: "rteBadgeCount", isSignal: true, isRequired: false, transformFunction: null }, rteBadgeContent: { classPropertyName: "rteBadgeContent", publicName: "rteBadgeContent", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.classes" } }, ngImport: i0, template: "<span class=\"rte-button-label\">\n <ng-content />\n <!-- Le badge est g\u00E9r\u00E9 par BadgeDirective attach\u00E9e via hostDirectives -->\n</span>\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\";:host{display:inline-flex;flex-shrink:0;align-items:center;cursor:pointer;justify-content:center;width:fit-content}:host:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}:host.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}:host.size-s .rte-button-label{margin:0 4px}:host.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}:host.size-m .rte-button-label{margin:0 6px}:host.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}:host.size-l .rte-button-label{margin:0 8px}:host.primary{border:var(--border-brand-default);color:var(--content-primary-inverse);background:var(--background-brand-default)}:host.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}:host.primary:active{background:var(--background-brand-pressed)}:host.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}:host.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}:host.secondary:hover{background:var(--background-brand-inverse-hover)}:host.secondary:active{background:var(--background-brand-inverse-pressed)}:host.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}:host.text{background:transparent;border:none;color:var(--content-brand-default)}:host.text:hover{background:var(--background-brand-inverse-hover)}:host.text:active{background:var(--background-brand-inverse-pressed)}:host.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}:host.transparent{background:transparent;border:none;color:var(--content-brand-default)}:host.transparent:hover{color:var(--content-brand-hover)}:host.transparent:active{color:var(--content-brand-pressed)}:host.transparent:disabled{color:var(--content-disabled);box-shadow:none;cursor:default}:host.danger{background:var(--background-danger-default);border:none;color:var(--content-primary-inverse)}:host.danger:hover{background:var(--background-danger-hover)}:host.danger:active{background:var(--background-danger-pressed)}:host.danger:disabled{background:var(--background-disabled);border:var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}:host.neutral{background:none;border:none;color:var(--content-primary)}:host.neutral:hover{color:var(--content-secondary)}:host.neutral:active{color:var(--content-tertiary)}:host.neutral:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}:host.reverse{background:none;border:none;color:var(--content-primary-inverse)}:host.reverse:hover{color:var(--background-hover)}:host.reverse:active{color:var(--content-primary-inverse)}:host.reverse:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
13
20
|
}
|
|
14
21
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
15
22
|
type: Component,
|
|
16
|
-
args: [{ selector: "button[rteButton]", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"rte-button-label\">\n
|
|
23
|
+
args: [{ selector: "button[rteButton]", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"rte-button-label\">\n <ng-content />\n <!-- Le badge est g\u00E9r\u00E9 par BadgeDirective attach\u00E9e via hostDirectives -->\n</span>\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\";:host{display:inline-flex;flex-shrink:0;align-items:center;cursor:pointer;justify-content:center;width:fit-content}:host:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}:host.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}:host.size-s .rte-button-label{margin:0 4px}:host.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}:host.size-m .rte-button-label{margin:0 6px}:host.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}:host.size-l .rte-button-label{margin:0 8px}:host.primary{border:var(--border-brand-default);color:var(--content-primary-inverse);background:var(--background-brand-default)}:host.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}:host.primary:active{background:var(--background-brand-pressed)}:host.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}:host.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}:host.secondary:hover{background:var(--background-brand-inverse-hover)}:host.secondary:active{background:var(--background-brand-inverse-pressed)}:host.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}:host.text{background:transparent;border:none;color:var(--content-brand-default)}:host.text:hover{background:var(--background-brand-inverse-hover)}:host.text:active{background:var(--background-brand-inverse-pressed)}:host.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}:host.transparent{background:transparent;border:none;color:var(--content-brand-default)}:host.transparent:hover{color:var(--content-brand-hover)}:host.transparent:active{color:var(--content-brand-pressed)}:host.transparent:disabled{color:var(--content-disabled);box-shadow:none;cursor:default}:host.danger{background:var(--background-danger-default);border:none;color:var(--content-primary-inverse)}:host.danger:hover{background:var(--background-danger-hover)}:host.danger:active{background:var(--background-danger-pressed)}:host.danger:disabled{background:var(--background-disabled);border:var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}:host.neutral{background:none;border:none;color:var(--content-primary)}:host.neutral:hover{color:var(--content-secondary)}:host.neutral:active{color:var(--content-tertiary)}:host.neutral:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}:host.reverse{background:none;border:none;color:var(--content-primary-inverse)}:host.reverse:hover{color:var(--background-hover)}:host.reverse:active{color:var(--content-primary-inverse)}:host.reverse:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}\n"] }]
|
|
17
24
|
}], propDecorators: { classes: [{
|
|
18
25
|
type: HostBinding,
|
|
19
26
|
args: ["class"]
|
|
20
27
|
}] } });
|
|
21
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
28
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2J1dHRvbi9idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYnV0dG9uL2J1dHRvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVdqRyxNQUFNLE9BQU8sZUFBZTtJQVA1QjtRQVFXLHFCQUFnQixHQUFHLEtBQUssQ0FBZ0IsU0FBUyxDQUFDLENBQUM7UUFDbkQsa0JBQWEsR0FBRyxLQUFLLENBQWEsR0FBRyxDQUFDLENBQUM7UUFDdkMsa0JBQWEsR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUNoQyxvQkFBZSxHQUFHLEtBQUssRUFBZ0IsQ0FBQztRQU14Qyx1QkFBa0IsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQzFDLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztZQUNuQyxNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7WUFFdkMsT0FBTyxDQUFDLEtBQUssSUFBSSxLQUFLLEdBQUcsQ0FBQyxJQUFJLE9BQU8sS0FBSyxRQUFRLENBQUMsSUFBSSxPQUFPLEtBQUssTUFBTSxDQUFDO1FBQzVFLENBQUMsQ0FBQyxDQUFDO0tBQ0o7SUFWQyxJQUEwQixPQUFPO1FBQy9CLE9BQU8sY0FBYyxJQUFJLENBQUMsZ0JBQWdCLEVBQUUsU0FBUyxJQUFJLENBQUMsYUFBYSxFQUFFLEVBQUUsQ0FBQztJQUM5RSxDQUFDOytHQVJVLGVBQWU7bUdBQWYsZUFBZSwydEJDWDVCLDRKQUlBOzs0RkRPYSxlQUFlO2tCQVAzQixTQUFTOytCQUNFLG1CQUFtQixjQUNqQixJQUFJLG1CQUdDLHVCQUF1QixDQUFDLE1BQU07OEJBUXJCLE9BQU87c0JBQWhDLFdBQVc7dUJBQUMsT0FBTyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBIb3N0QmluZGluZywgaW5wdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgQmFkZ2VDb250ZW50IH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuaW50ZXJmYWNlXCI7XG5pbXBvcnQgeyBCdXR0b25TaXplLCBCdXR0b25WYXJpYW50IH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvYnV0dG9uL2NvbW1vbi9jb21tb24tYnV0dG9uXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJidXR0b25bcnRlQnV0dG9uXVwiLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICB0ZW1wbGF0ZVVybDogXCIuL2J1dHRvbi5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybDogXCIuL2J1dHRvbi5jb21wb25lbnQuc2Nzc1wiLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgQnV0dG9uQ29tcG9uZW50IHtcbiAgcmVhZG9ubHkgcnRlQnV0dG9uVmFyaWFudCA9IGlucHV0PEJ1dHRvblZhcmlhbnQ+KFwicHJpbWFyeVwiKTtcbiAgcmVhZG9ubHkgcnRlQnV0dG9uU2l6ZSA9IGlucHV0PEJ1dHRvblNpemU+KFwibVwiKTtcbiAgcmVhZG9ubHkgcnRlQmFkZ2VDb3VudCA9IGlucHV0PG51bWJlcj4oKTtcbiAgcmVhZG9ubHkgcnRlQmFkZ2VDb250ZW50ID0gaW5wdXQ8QmFkZ2VDb250ZW50PigpO1xuXG4gIEBIb3N0QmluZGluZyhcImNsYXNzXCIpIGdldCBjbGFzc2VzKCkge1xuICAgIHJldHVybiBgcnRlLWJ1dHRvbiAke3RoaXMucnRlQnV0dG9uVmFyaWFudCgpfSBzaXplLSR7dGhpcy5ydGVCdXR0b25TaXplKCl9YDtcbiAgfVxuXG4gIHJlYWRvbmx5IHNob3VsZERpc3BsYXlCYWRnZSA9IGNvbXB1dGVkKCgpID0+IHtcbiAgICBjb25zdCBjb3VudCA9IHRoaXMucnRlQmFkZ2VDb3VudCgpO1xuICAgIGNvbnN0IGNvbnRlbnQgPSB0aGlzLnJ0ZUJhZGdlQ29udGVudCgpO1xuXG4gICAgcmV0dXJuIChjb3VudCAmJiBjb3VudCA+IDAgJiYgY29udGVudCA9PT0gXCJudW1iZXJcIikgfHwgY29udGVudCA9PT0gXCJpY29uXCI7XG4gIH0pO1xufVxuIiwiPHNwYW4gY2xhc3M9XCJydGUtYnV0dG9uLWxhYmVsXCI+XG4gIDxuZy1jb250ZW50IC8+XG4gIDwhLS0gTGUgYmFkZ2UgZXN0IGfDqXLDqSBwYXIgQmFkZ2VEaXJlY3RpdmUgYXR0YWNow6llIHZpYSBob3N0RGlyZWN0aXZlcyAtLT5cbjwvc3Bhbj5cbiJdfQ==
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { CommonModule } from "@angular/common";
|
|
2
|
+
import { ChangeDetectionStrategy, Component, computed, input, output } from "@angular/core";
|
|
3
|
+
import { cardSize } from "@design-system-rte/core/components/card/card.constats";
|
|
4
|
+
import { ENTER_KEY, SPACE_KEY } from "@design-system-rte/core/constants/keyboard/keyboard.constants";
|
|
5
|
+
import * as i0 from "@angular/core";
|
|
6
|
+
import * as i1 from "@angular/common";
|
|
7
|
+
export class CardComponent {
|
|
8
|
+
constructor() {
|
|
9
|
+
this.size = input("m");
|
|
10
|
+
this.cardType = input("default");
|
|
11
|
+
this.clickable = input(false);
|
|
12
|
+
this.disabled = input(false);
|
|
13
|
+
this.ariaLabel = input(undefined);
|
|
14
|
+
this.ariaLabelledby = input(undefined);
|
|
15
|
+
this.ariaRole = input(undefined);
|
|
16
|
+
this.cardClicked = output();
|
|
17
|
+
this.cardWidth = computed(() => `${cardSize[this.size()]}px`);
|
|
18
|
+
this.tabIndex = computed(() => (this.clickable() ? 0 : -1));
|
|
19
|
+
}
|
|
20
|
+
onClick() {
|
|
21
|
+
if (!this.disabled() && this.clickable()) {
|
|
22
|
+
this.cardClicked.emit();
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
onKeyDown(event) {
|
|
26
|
+
if (!this.disabled() && this.clickable()) {
|
|
27
|
+
if ([ENTER_KEY, SPACE_KEY].includes(event.key)) {
|
|
28
|
+
event.preventDefault();
|
|
29
|
+
this.cardClicked.emit();
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
34
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CardComponent, isStandalone: true, selector: "rte-card", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, cardType: { classPropertyName: "cardType", publicName: "cardType", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", 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 }, ariaRole: { classPropertyName: "ariaRole", publicName: "ariaRole", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cardClicked: "cardClicked" }, ngImport: i0, template: "<div\n class=\"card card-{{cardType()}}\"\n [style.width]=\"cardWidth()\"\n [attr.disabled]=\"disabled()\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledby()\"\n [attr.aria-role]=\"ariaRole()\"\n [ngClass]=\"{'clickable': clickable()}\"\n [tabIndex]=\"tabIndex()\"\n (click)=\"onClick()\"\n (keydown)=\"onKeyDown($event)\"\n>\n <ng-content/>\n</div>\n\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\";.card{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;border-radius:4px;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%);transition:background-color .3s,box-shadow .3s}.card:active{box-shadow:0 1px 2px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-1) 0%,var(--elevation-surface-shadow-1) 100%)}.card:hover{box-shadow:0 4px 8px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-3) 0%,var(--elevation-surface-shadow-3) 100%)}.card[disabled=true]{background:var(--background-disabled);opacity:30%;box-shadow:none;pointer-events:none}.card[disabled=true].card-outlined{border:1px solid var(--border-disabled)}.card.card-outlined{flex-shrink:0;border:1px solid var(--border-tertiary);box-shadow:none}.card.card-outlined:active{border-color:var(--border-secondary)}.card.clickable{cursor:pointer}.card:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
35
|
+
}
|
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CardComponent, decorators: [{
|
|
37
|
+
type: Component,
|
|
38
|
+
args: [{ selector: "rte-card", imports: [CommonModule], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"card card-{{cardType()}}\"\n [style.width]=\"cardWidth()\"\n [attr.disabled]=\"disabled()\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledby()\"\n [attr.aria-role]=\"ariaRole()\"\n [ngClass]=\"{'clickable': clickable()}\"\n [tabIndex]=\"tabIndex()\"\n (click)=\"onClick()\"\n (keydown)=\"onKeyDown($event)\"\n>\n <ng-content/>\n</div>\n\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\";.card{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;border-radius:4px;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%);transition:background-color .3s,box-shadow .3s}.card:active{box-shadow:0 1px 2px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-1) 0%,var(--elevation-surface-shadow-1) 100%)}.card:hover{box-shadow:0 4px 8px 0 var(--elevation-shadow-key),0 0 2px 0 var(--elevation-shadow-ambient);background:linear-gradient(0deg,var(--elevation-surface-shadow-3) 0%,var(--elevation-surface-shadow-3) 100%)}.card[disabled=true]{background:var(--background-disabled);opacity:30%;box-shadow:none;pointer-events:none}.card[disabled=true].card-outlined{border:1px solid var(--border-disabled)}.card.card-outlined{flex-shrink:0;border:1px solid var(--border-tertiary);box-shadow:none}.card.card-outlined:active{border-color:var(--border-secondary)}.card.clickable{cursor:pointer}.card:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}\n"] }]
|
|
39
|
+
}] });
|
|
40
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kcy1ydGUtbGliL3NyYy9saWIvY29tcG9uZW50cy9jYXJkL2NhcmQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvY2FyZC9jYXJkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzVGLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSx1REFBdUQsQ0FBQztBQUdqRixPQUFPLEVBQUUsU0FBUyxFQUFFLFNBQVMsRUFBRSxNQUFNLCtEQUErRCxDQUFDOzs7QUFVckcsTUFBTSxPQUFPLGFBQWE7SUFSMUI7UUFTVyxTQUFJLEdBQUcsS0FBSyxDQUFPLEdBQUcsQ0FBQyxDQUFDO1FBQ3hCLGFBQVEsR0FBRyxLQUFLLENBQVcsU0FBUyxDQUFDLENBQUM7UUFDdEMsY0FBUyxHQUFHLEtBQUssQ0FBVSxLQUFLLENBQUMsQ0FBQztRQUNsQyxhQUFRLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBRWpDLGNBQVMsR0FBRyxLQUFLLENBQXFCLFNBQVMsQ0FBQyxDQUFDO1FBQ2pELG1CQUFjLEdBQUcsS0FBSyxDQUFxQixTQUFTLENBQUMsQ0FBQztRQUN0RCxhQUFRLEdBQUcsS0FBSyxDQUFxQixTQUFTLENBQUMsQ0FBQztRQUVoRCxnQkFBVyxHQUFHLE1BQU0sRUFBUSxDQUFDO1FBRTdCLGNBQVMsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsR0FBRyxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBRXpELGFBQVEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDO0tBZ0JqRTtJQWRDLE9BQU87UUFDTCxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRSxJQUFJLElBQUksQ0FBQyxTQUFTLEVBQUUsRUFBRSxDQUFDO1lBQ3pDLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDMUIsQ0FBQztJQUNILENBQUM7SUFFRCxTQUFTLENBQUMsS0FBb0I7UUFDNUIsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsSUFBSSxJQUFJLENBQUMsU0FBUyxFQUFFLEVBQUUsQ0FBQztZQUN6QyxJQUFJLENBQUMsU0FBUyxFQUFFLFNBQVMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLEVBQUUsQ0FBQztnQkFDL0MsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO2dCQUN2QixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksRUFBRSxDQUFDO1lBQzFCLENBQUM7UUFDSCxDQUFDO0lBQ0gsQ0FBQzsrR0E3QlUsYUFBYTttR0FBYixhQUFhLDRnQ0NmMUIsMllBZUEsdy9DRE5ZLFlBQVk7OzRGQU1YLGFBQWE7a0JBUnpCLFNBQVM7K0JBQ0UsVUFBVSxXQUNYLENBQUMsWUFBWSxDQUFDLGNBQ1gsSUFBSSxtQkFHQyx1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgY29tcHV0ZWQsIGlucHV0LCBvdXRwdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgY2FyZFNpemUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9jYXJkL2NhcmQuY29uc3RhdHNcIjtcbmltcG9ydCB7IENhcmRUeXBlIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvY2FyZC9jYXJkLmludGVyZmFjZVwiO1xuaW1wb3J0IHsgU2l6ZSB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2NvbW1vbi9jb21tb24tdHlwZXNcIjtcbmltcG9ydCB7IEVOVEVSX0tFWSwgU1BBQ0VfS0VZIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbnN0YW50cy9rZXlib2FyZC9rZXlib2FyZC5jb25zdGFudHNcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInJ0ZS1jYXJkXCIsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGVdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICB0ZW1wbGF0ZVVybDogXCIuL2NhcmQuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmw6IFwiLi9jYXJkLmNvbXBvbmVudC5zY3NzXCIsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBDYXJkQ29tcG9uZW50IHtcbiAgcmVhZG9ubHkgc2l6ZSA9IGlucHV0PFNpemU+KFwibVwiKTtcbiAgcmVhZG9ubHkgY2FyZFR5cGUgPSBpbnB1dDxDYXJkVHlwZT4oXCJkZWZhdWx0XCIpO1xuICByZWFkb25seSBjbGlja2FibGUgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG4gIHJlYWRvbmx5IGRpc2FibGVkID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpO1xuXG4gIHJlYWRvbmx5IGFyaWFMYWJlbCA9IGlucHV0PHN0cmluZyB8IHVuZGVmaW5lZD4odW5kZWZpbmVkKTtcbiAgcmVhZG9ubHkgYXJpYUxhYmVsbGVkYnkgPSBpbnB1dDxzdHJpbmcgfCB1bmRlZmluZWQ+KHVuZGVmaW5lZCk7XG4gIHJlYWRvbmx5IGFyaWFSb2xlID0gaW5wdXQ8c3RyaW5nIHwgdW5kZWZpbmVkPih1bmRlZmluZWQpO1xuXG4gIHJlYWRvbmx5IGNhcmRDbGlja2VkID0gb3V0cHV0PHZvaWQ+KCk7XG5cbiAgcmVhZG9ubHkgY2FyZFdpZHRoID0gY29tcHV0ZWQoKCkgPT4gYCR7Y2FyZFNpemVbdGhpcy5zaXplKCldfXB4YCk7XG5cbiAgcmVhZG9ubHkgdGFiSW5kZXggPSBjb21wdXRlZCgoKSA9PiAodGhpcy5jbGlja2FibGUoKSA/IDAgOiAtMSkpO1xuXG4gIG9uQ2xpY2soKTogdm9pZCB7XG4gICAgaWYgKCF0aGlzLmRpc2FibGVkKCkgJiYgdGhpcy5jbGlja2FibGUoKSkge1xuICAgICAgdGhpcy5jYXJkQ2xpY2tlZC5lbWl0KCk7XG4gICAgfVxuICB9XG5cbiAgb25LZXlEb3duKGV2ZW50OiBLZXlib2FyZEV2ZW50KTogdm9pZCB7XG4gICAgaWYgKCF0aGlzLmRpc2FibGVkKCkgJiYgdGhpcy5jbGlja2FibGUoKSkge1xuICAgICAgaWYgKFtFTlRFUl9LRVksIFNQQUNFX0tFWV0uaW5jbHVkZXMoZXZlbnQua2V5KSkge1xuICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICB0aGlzLmNhcmRDbGlja2VkLmVtaXQoKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cbn1cbiIsIjxkaXZcbiAgY2xhc3M9XCJjYXJkIGNhcmQte3tjYXJkVHlwZSgpfX1cIlxuICBbc3R5bGUud2lkdGhdPVwiY2FyZFdpZHRoKClcIlxuICBbYXR0ci5kaXNhYmxlZF09XCJkaXNhYmxlZCgpXCJcbiAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWwoKVwiXG4gIFthdHRyLmFyaWEtbGFiZWxsZWRieV09XCJhcmlhTGFiZWxsZWRieSgpXCJcbiAgW2F0dHIuYXJpYS1yb2xlXT1cImFyaWFSb2xlKClcIlxuICBbbmdDbGFzc109XCJ7J2NsaWNrYWJsZSc6IGNsaWNrYWJsZSgpfVwiXG4gIFt0YWJJbmRleF09XCJ0YWJJbmRleCgpXCJcbiAgKGNsaWNrKT1cIm9uQ2xpY2soKVwiXG4gIChrZXlkb3duKT1cIm9uS2V5RG93bigkZXZlbnQpXCJcbj5cbiAgPG5nLWNvbnRlbnQvPlxuPC9kaXY+XG5cbiJdfQ==
|
|
@@ -10,10 +10,10 @@ export class DividerComponent {
|
|
|
10
10
|
this.isHorizontal = computed(() => this.orientation() === "horizontal");
|
|
11
11
|
}
|
|
12
12
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DividerComponent, isStandalone: true, selector: "rte-divider", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, endPoint: { classPropertyName: "endPoint", publicName: "endPoint", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (isHorizontal()) {\n <hr class=\"horizontal {{thickness()}} {{appearance()}} {{endPoint()}}\" />\n} @else {\n <div class=\"vertical {{thickness()}} {{appearance()}} {{endPoint()}}\" role=\"separator\"></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\"
|
|
13
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DividerComponent, isStandalone: true, selector: "rte-divider", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, endPoint: { classPropertyName: "endPoint", publicName: "endPoint", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (isHorizontal()) {\n <hr class=\"horizontal {{thickness()}} {{appearance()}} {{endPoint()}}\" />\n} @else {\n <div class=\"vertical {{thickness()}} {{appearance()}} {{endPoint()}}\" role=\"separator\"></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\";:host{display:contents}.horizontal{border:none;padding:0;margin:0;width:100%}.horizontal.round{border-radius:999px}.horizontal.light{border-top:1px solid var(--border-divider)}.horizontal.medium{border-top:2px solid var(--border-divider)}.horizontal.bold{border-top:4px solid var(--border-divider)}.horizontal.inverse{border-top-color:var(--border-inverse)}.horizontal.brand{border-top-color:var(--border-brand-default)}.horizontal.brand-navigation{border-top-color:var(--border-brand-navigation-divider)}.vertical{height:100%;background-color:var(--border-divider);margin:0;padding:0}.vertical.round{border-radius:999px}.vertical.light{width:1px}.vertical.medium{width:2px}.vertical.bold{width:4px}.vertical.inverse{background-color:var(--border-inverse)}.vertical.brand{background-color:var(--border-brand-default)}.vertical.brand-navigation{background-color:var(--border-brand-navigation-divider)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14
14
|
}
|
|
15
15
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DividerComponent, decorators: [{
|
|
16
16
|
type: Component,
|
|
17
|
-
args: [{ selector: "rte-divider", imports: [CommonModule], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isHorizontal()) {\n <hr class=\"horizontal {{thickness()}} {{appearance()}} {{endPoint()}}\" />\n} @else {\n <div class=\"vertical {{thickness()}} {{appearance()}} {{endPoint()}}\" role=\"separator\"></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\"
|
|
17
|
+
args: [{ selector: "rte-divider", imports: [CommonModule], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isHorizontal()) {\n <hr class=\"horizontal {{thickness()}} {{appearance()}} {{endPoint()}}\" />\n} @else {\n <div class=\"vertical {{thickness()}} {{appearance()}} {{endPoint()}}\" role=\"separator\"></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\";:host{display:contents}.horizontal{border:none;padding:0;margin:0;width:100%}.horizontal.round{border-radius:999px}.horizontal.light{border-top:1px solid var(--border-divider)}.horizontal.medium{border-top:2px solid var(--border-divider)}.horizontal.bold{border-top:4px solid var(--border-divider)}.horizontal.inverse{border-top-color:var(--border-inverse)}.horizontal.brand{border-top-color:var(--border-brand-default)}.horizontal.brand-navigation{border-top-color:var(--border-brand-navigation-divider)}.vertical{height:100%;background-color:var(--border-divider);margin:0;padding:0}.vertical.round{border-radius:999px}.vertical.light{width:1px}.vertical.medium{width:2px}.vertical.bold{width:4px}.vertical.inverse{background-color:var(--border-inverse)}.vertical.brand{background-color:var(--border-brand-default)}.vertical.brand-navigation{background-color:var(--border-brand-navigation-divider)}\n"] }]
|
|
18
18
|
}] });
|
|
19
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
19
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGl2aWRlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kcy1ydGUtbGliL3NyYy9saWIvY29tcG9uZW50cy9kaXZpZGVyL2RpdmlkZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvZGl2aWRlci9kaXZpZGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBV3BGLE1BQU0sT0FBTyxnQkFBZ0I7SUFSN0I7UUFTVyxnQkFBVyxHQUFHLEtBQUssQ0FBOEIsWUFBWSxDQUFDLENBQUM7UUFDL0QsY0FBUyxHQUFHLEtBQUssQ0FBNEIsT0FBTyxDQUFDLENBQUM7UUFDdEQsZUFBVSxHQUFHLEtBQUssQ0FBNkIsU0FBUyxDQUFDLENBQUM7UUFDMUQsYUFBUSxHQUFHLEtBQUssQ0FBMkIsT0FBTyxDQUFDLENBQUM7UUFFcEQsaUJBQVksR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxLQUFLLFlBQVksQ0FBQyxDQUFDO0tBQzdFOytHQVBZLGdCQUFnQjttR0FBaEIsZ0JBQWdCLHltQkNaN0IsME5BSUMsMHBDREVXLFlBQVk7OzRGQU1YLGdCQUFnQjtrQkFSNUIsU0FBUzsrQkFDRSxhQUFhLFdBQ2QsQ0FBQyxZQUFZLENBQUMsY0FDWCxJQUFJLG1CQUdDLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tIFwiQGFuZ3VsYXIvY29tbW9uXCI7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBjb21wdXRlZCwgaW5wdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgRGl2aWRlclByb3BzIH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvZGl2aWRlci9kaXZpZGVyLmludGVyZmFjZVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwicnRlLWRpdmlkZXJcIixcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIHRlbXBsYXRlVXJsOiBcIi4vZGl2aWRlci5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybDogXCIuL2RpdmlkZXIuY29tcG9uZW50LnNjc3NcIixcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIERpdmlkZXJDb21wb25lbnQge1xuICByZWFkb25seSBvcmllbnRhdGlvbiA9IGlucHV0PERpdmlkZXJQcm9wc1tcIm9yaWVudGF0aW9uXCJdPihcImhvcml6b250YWxcIik7XG4gIHJlYWRvbmx5IHRoaWNrbmVzcyA9IGlucHV0PERpdmlkZXJQcm9wc1tcInRoaWNrbmVzc1wiXT4oXCJsaWdodFwiKTtcbiAgcmVhZG9ubHkgYXBwZWFyYW5jZSA9IGlucHV0PERpdmlkZXJQcm9wc1tcImFwcGVhcmFuY2VcIl0+KFwiZGVmYXVsdFwiKTtcbiAgcmVhZG9ubHkgZW5kUG9pbnQgPSBpbnB1dDxEaXZpZGVyUHJvcHNbXCJlbmRQb2ludFwiXT4oXCJyb3VuZFwiKTtcblxuICByZWFkb25seSBpc0hvcml6b250YWwgPSBjb21wdXRlZCgoKSA9PiB0aGlzLm9yaWVudGF0aW9uKCkgPT09IFwiaG9yaXpvbnRhbFwiKTtcbn1cbiIsIkBpZiAoaXNIb3Jpem9udGFsKCkpIHtcbiAgPGhyIGNsYXNzPVwiaG9yaXpvbnRhbCB7e3RoaWNrbmVzcygpfX0ge3thcHBlYXJhbmNlKCl9fSB7e2VuZFBvaW50KCl9fVwiIC8+XG59IEBlbHNlIHtcbiAgPGRpdiBjbGFzcz1cInZlcnRpY2FsIHt7dGhpY2tuZXNzKCl9fSB7e2FwcGVhcmFuY2UoKX19IHt7ZW5kUG9pbnQoKX19XCIgcm9sZT1cInNlcGFyYXRvclwiPjwvZGl2PlxufSJdfQ==
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { CommonModule } from "@angular/common";
|
|
2
2
|
import { ChangeDetectionStrategy, Component, computed, input, output } from "@angular/core";
|
|
3
|
-
import {
|
|
3
|
+
import { ButtonIconSize } from "@design-system-rte/core/components/button/common/common-button.constants";
|
|
4
4
|
import { BadgeDirective } from "../badge/badge.directive";
|
|
5
5
|
import { isValidIconName } from "../icon/icon-map";
|
|
6
6
|
import { IconComponent } from "../icon/icon.component";
|
|
@@ -21,7 +21,7 @@ export class IconButtonComponent {
|
|
|
21
21
|
this.badgeContent = input();
|
|
22
22
|
this.badgeType = input();
|
|
23
23
|
this.badgeIcon = input("settings");
|
|
24
|
-
this.buttonIconSize = computed(() =>
|
|
24
|
+
this.buttonIconSize = computed(() => ButtonIconSize[this.size()]);
|
|
25
25
|
this.isValidIconName = computed(() => isValidIconName(this.name()));
|
|
26
26
|
this.click = output();
|
|
27
27
|
this.shouldDisplayBadge = computed(() => {
|
|
@@ -41,4 +41,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
41
41
|
type: Component,
|
|
42
42
|
args: [{ selector: "rte-icon-button", imports: [CommonModule, IconComponent, BadgeDirective], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (shouldDisplayBadge()) {\n <button\n *ngIf=\"isValidIconName\"\n class=\"rte-icon-button {{ variant() }} size-{{ size() }}\"\n rteBadge\n [class.compact-spacing]=\"compactSpacing()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [type]=\"type()\"\n [rteBadgeType]=\"badgeType()!\"\n [rteBadgeSize]=\"size()\"\n [rteBadgeContent]=\"size() === 's' ? 'empty' : badgeContent()!\"\n [rteBadgeCount]=\"badgeCount()!\"\n [rteBadgeIcon]=\"badgeIcon()!\"\n (click)=\"onClick($event)\"\n >\n <rte-icon\n [name]=\"name()\"\n [appearance]=\"appearance()\"\n [size]=\"buttonIconSize()\"\n />\n </button>\n} @else {\n <button\n *ngIf=\"isValidIconName\"\n class=\"rte-icon-button {{ variant() }} size-{{ size() }}\"\n [class.compact-spacing]=\"compactSpacing()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [type]=\"type()\"\n (click)=\"onClick($event)\"\n >\n <rte-icon\n [name]=\"name()\"\n [appearance]=\"appearance()\"\n [size]=\"buttonIconSize()\"\n />\n </button>\n}\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-icon-button{display:flex;cursor:pointer;height:24px;align-items:center;gap:0px;flex-shrink:0}.rte-icon-button:focus-visible{outline:none;position:relative;outline:1px solid var(--border-brand-focused);outline-offset:4px;border-radius:4px}.rte-icon-button.size-s{border-radius:4px;height:24px;padding:2px 4px}.rte-icon-button.size-s.compact-spacing{height:16px}.rte-icon-button.size-m{border-radius:4px;height:32px;padding:4px 6px}.rte-icon-button.size-m.compact-spacing{height:20px}.rte-icon-button.size-l{border-radius:8px;height:40px;padding:6px 8px}.rte-icon-button.size-l.compact-spacing{height:24px}.rte-icon-button.primary{background:var(--background-brand-default);border:var(--border-brand-default)}.rte-icon-button.primary ::ng-deep .rte-icon-container{color:var(--content-primary-inverse)}.rte-icon-button.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}.rte-icon-button.primary:active{background:var(--background-brand-pressed)}.rte-icon-button.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}.rte-icon-button.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}.rte-icon-button.secondary:hover{background:var(--background-brand-inverse-hover);border:solid 1px var(--border-brand-default)}.rte-icon-button.secondary:active{background:var(--background-brand-inverse-pressed)}.rte-icon-button.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}.rte-icon-button.text{background:transparent;border:none;color:var(--content-brand-default)}.rte-icon-button.text:hover{background:var(--background-brand-inverse-hover)}.rte-icon-button.text:active{background:var(--background-brand-inverse-pressed)}.rte-icon-button.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}.rte-icon-button.transparent{background:transparent;border:none;color:var(--content-brand-default)}.rte-icon-button.transparent:hover{color:var(--content-brand-hover)}.rte-icon-button.transparent:active{color:var(--content-brand-pressed)}.rte-icon-button.transparent:disabled{box-shadow:none;background-color:var(--background-disabled);color:var(--content-disabled);cursor:default}.rte-icon-button.danger{background:var(--background-danger-default);border:none}.rte-icon-button.danger ::ng-deep .rte-icon-container{color:var(--content-primary-inverse)}.rte-icon-button.danger:hover{background:var(--background-danger-hover)}.rte-icon-button.danger:active{background:var(--background-danger-pressed)}.rte-icon-button.danger:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}.rte-icon-button.neutral{background:none;border:none;color:var(--content-primary)}.rte-icon-button.neutral:hover{color:var(--content-secondary)}.rte-icon-button.neutral:active{color:var(--content-tertiary)}.rte-icon-button.neutral:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}.rte-icon-button.reverse{background:none;border:none;color:var(--content-primary-inverse)}.rte-icon-button.reverse:hover{color:var(--background-hover)}.rte-icon-button.reverse:active{color:var(--content-primary-inverse)}.rte-icon-button.reverse:disabled{background:var(--background-disabled);box-shadow:none;color:var(--content-disabled);cursor:default}.rte-icon-button.compact-spacing{padding:0}\n"] }]
|
|
43
43
|
}] });
|
|
44
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
44
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1idXR0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvaWNvbi1idXR0b24vaWNvbi1idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvaWNvbi1idXR0b24vaWNvbi1idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFJNUYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDBFQUEwRSxDQUFDO0FBRTFHLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUMxRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDbkQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDOzs7QUFXdkQsTUFBTSxPQUFPLG1CQUFtQjtJQVJoQztRQVNXLGFBQVEsR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFDakMsU0FBSSxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQXlDLENBQUM7UUFDL0QsU0FBSSxHQUFHLEtBQUssQ0FBYSxHQUFHLENBQUMsQ0FBQztRQUM5QixZQUFPLEdBQUcsS0FBSyxDQUFnQixTQUFTLENBQUMsQ0FBQztRQUMxQyxTQUFJLEdBQUcsS0FBSyxDQUFhLFFBQVEsQ0FBQyxDQUFDO1FBQ25DLGVBQVUsR0FBRyxLQUFLLENBQXdCLFVBQVUsQ0FBQyxDQUFDO1FBQ3RELG1CQUFjLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBQ3ZDLGNBQVMsR0FBRyxLQUFLLENBQXFCLFNBQVMsQ0FBQyxDQUFDO1FBQ2pELG1CQUFjLEdBQUcsS0FBSyxDQUFxQixTQUFTLENBQUMsQ0FBQztRQUN0RCxlQUFVLEdBQUcsS0FBSyxFQUFVLENBQUM7UUFDN0IsaUJBQVksR0FBRyxLQUFLLEVBQWdCLENBQUM7UUFDckMsY0FBUyxHQUFHLEtBQUssRUFBYSxDQUFDO1FBQy9CLGNBQVMsR0FBRyxLQUFLLENBQXdDLFVBQVUsQ0FBQyxDQUFDO1FBRXJFLG1CQUFjLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBRTdELG9CQUFlLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBRS9ELFVBQUssR0FBRyxNQUFNLEVBQThCLENBQUM7UUFFN0MsdUJBQWtCLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRTtZQUMxQyxNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUM7WUFDaEMsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1lBRXBDLE9BQU8sQ0FBQyxLQUFLLElBQUksS0FBSyxHQUFHLENBQUMsSUFBSSxPQUFPLEtBQUssUUFBUSxDQUFDLElBQUksT0FBTyxLQUFLLE1BQU0sQ0FBQztRQUM1RSxDQUFDLENBQUMsQ0FBQztLQU1KO0lBSkMsT0FBTyxDQUFDLEtBQWlDO1FBQ3ZDLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUN6QixDQUFDOytHQS9CVSxtQkFBbUI7bUdBQW5CLG1CQUFtQiw4eERDcEJoQyw4ckNBeUNBLG0wSEQzQlksWUFBWSxtSUFBRSxhQUFhLGlIQUFFLGNBQWM7OzRGQU0xQyxtQkFBbUI7a0JBUi9CLFNBQVM7K0JBQ0UsaUJBQWlCLFdBQ2xCLENBQUMsWUFBWSxFQUFFLGFBQWEsRUFBRSxjQUFjLENBQUMsY0FDMUMsSUFBSSxtQkFHQyx1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xuaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgY29tcHV0ZWQsIGlucHV0LCBvdXRwdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgQmFkZ2VDb250ZW50LCBCYWRnZVR5cGUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5pbnRlcmZhY2VcIjtcbmltcG9ydCB7IEJ1dHRvblR5cGUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmludGVyZmFjZVwiO1xuaW1wb3J0IHsgQnV0dG9uU2l6ZSwgQnV0dG9uVmFyaWFudCB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2J1dHRvbi9jb21tb24vY29tbW9uLWJ1dHRvblwiO1xuaW1wb3J0IHsgQnV0dG9uSWNvblNpemUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9idXR0b24vY29tbW9uL2NvbW1vbi1idXR0b24uY29uc3RhbnRzXCI7XG5cbmltcG9ydCB7IEJhZGdlRGlyZWN0aXZlIH0gZnJvbSBcIi4uL2JhZGdlL2JhZGdlLmRpcmVjdGl2ZVwiO1xuaW1wb3J0IHsgaXNWYWxpZEljb25OYW1lIH0gZnJvbSBcIi4uL2ljb24vaWNvbi1tYXBcIjtcbmltcG9ydCB7IEljb25Db21wb25lbnQgfSBmcm9tIFwiLi4vaWNvbi9pY29uLmNvbXBvbmVudFwiO1xuaW1wb3J0IHsgUmVndWxhckljb25JZEtleSwgVG9nZ2xhYmxlSWNvbklkS2V5IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5zZXJ2aWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJydGUtaWNvbi1idXR0b25cIixcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgSWNvbkNvbXBvbmVudCwgQmFkZ2VEaXJlY3RpdmVdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICB0ZW1wbGF0ZVVybDogXCIuL2ljb24tYnV0dG9uLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsOiBcIi4vaWNvbi1idXR0b24uY29tcG9uZW50LnNjc3NcIixcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEljb25CdXR0b25Db21wb25lbnQge1xuICByZWFkb25seSBkaXNhYmxlZCA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcbiAgcmVhZG9ubHkgbmFtZSA9IGlucHV0LnJlcXVpcmVkPFJlZ3VsYXJJY29uSWRLZXkgfCBUb2dnbGFibGVJY29uSWRLZXk+KCk7XG4gIHJlYWRvbmx5IHNpemUgPSBpbnB1dDxCdXR0b25TaXplPihcIm1cIik7XG4gIHJlYWRvbmx5IHZhcmlhbnQgPSBpbnB1dDxCdXR0b25WYXJpYW50PihcInByaW1hcnlcIik7XG4gIHJlYWRvbmx5IHR5cGUgPSBpbnB1dDxCdXR0b25UeXBlPihcImJ1dHRvblwiKTtcbiAgcmVhZG9ubHkgYXBwZWFyYW5jZSA9IGlucHV0PFwib3V0bGluZWRcIiB8IFwiZmlsbGVkXCI+KFwib3V0bGluZWRcIik7XG4gIHJlYWRvbmx5IGNvbXBhY3RTcGFjaW5nID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpO1xuICByZWFkb25seSBhcmlhTGFiZWwgPSBpbnB1dDxzdHJpbmcgfCB1bmRlZmluZWQ+KHVuZGVmaW5lZCk7XG4gIHJlYWRvbmx5IGFyaWFMYWJlbGxlZEJ5ID0gaW5wdXQ8c3RyaW5nIHwgdW5kZWZpbmVkPih1bmRlZmluZWQpO1xuICByZWFkb25seSBiYWRnZUNvdW50ID0gaW5wdXQ8bnVtYmVyPigpO1xuICByZWFkb25seSBiYWRnZUNvbnRlbnQgPSBpbnB1dDxCYWRnZUNvbnRlbnQ+KCk7XG4gIHJlYWRvbmx5IGJhZGdlVHlwZSA9IGlucHV0PEJhZGdlVHlwZT4oKTtcbiAgcmVhZG9ubHkgYmFkZ2VJY29uID0gaW5wdXQ8UmVndWxhckljb25JZEtleSB8IFRvZ2dsYWJsZUljb25JZEtleT4oXCJzZXR0aW5nc1wiKTtcblxuICByZWFkb25seSBidXR0b25JY29uU2l6ZSA9IGNvbXB1dGVkKCgpID0+IEJ1dHRvbkljb25TaXplW3RoaXMuc2l6ZSgpXSk7XG5cbiAgcmVhZG9ubHkgaXNWYWxpZEljb25OYW1lID0gY29tcHV0ZWQoKCkgPT4gaXNWYWxpZEljb25OYW1lKHRoaXMubmFtZSgpKSk7XG5cbiAgcmVhZG9ubHkgY2xpY2sgPSBvdXRwdXQ8TW91c2VFdmVudCB8IEtleWJvYXJkRXZlbnQ+KCk7XG5cbiAgcmVhZG9ubHkgc2hvdWxkRGlzcGxheUJhZGdlID0gY29tcHV0ZWQoKCkgPT4ge1xuICAgIGNvbnN0IGNvdW50ID0gdGhpcy5iYWRnZUNvdW50KCk7XG4gICAgY29uc3QgY29udGVudCA9IHRoaXMuYmFkZ2VDb250ZW50KCk7XG5cbiAgICByZXR1cm4gKGNvdW50ICYmIGNvdW50ID4gMCAmJiBjb250ZW50ID09PSBcIm51bWJlclwiKSB8fCBjb250ZW50ID09PSBcImljb25cIjtcbiAgfSk7XG5cbiAgb25DbGljayhldmVudDogTW91c2VFdmVudCB8IEtleWJvYXJkRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICB0aGlzLmNsaWNrLmVtaXQoZXZlbnQpO1xuICB9XG59XG4iLCJAaWYgKHNob3VsZERpc3BsYXlCYWRnZSgpKSB7XG4gIDxidXR0b25cbiAgICAqbmdJZj1cImlzVmFsaWRJY29uTmFtZVwiXG4gICAgY2xhc3M9XCJydGUtaWNvbi1idXR0b24ge3sgdmFyaWFudCgpIH19IHNpemUte3sgc2l6ZSgpIH19XCJcbiAgICBydGVCYWRnZVxuICAgIFtjbGFzcy5jb21wYWN0LXNwYWNpbmddPVwiY29tcGFjdFNwYWNpbmcoKVwiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkKClcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiYXJpYUxhYmVsKClcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxsZWRieV09XCJhcmlhTGFiZWxsZWRCeSgpXCJcbiAgICBbdHlwZV09XCJ0eXBlKClcIlxuICAgIFtydGVCYWRnZVR5cGVdPVwiYmFkZ2VUeXBlKCkhXCJcbiAgICBbcnRlQmFkZ2VTaXplXT1cInNpemUoKVwiXG4gICAgW3J0ZUJhZGdlQ29udGVudF09XCJzaXplKCkgPT09ICdzJyA/ICdlbXB0eScgOiBiYWRnZUNvbnRlbnQoKSFcIlxuICAgIFtydGVCYWRnZUNvdW50XT1cImJhZGdlQ291bnQoKSFcIlxuICAgIFtydGVCYWRnZUljb25dPVwiYmFkZ2VJY29uKCkhXCJcbiAgICAoY2xpY2spPVwib25DbGljaygkZXZlbnQpXCJcbiAgPlxuICAgIDxydGUtaWNvblxuICAgICAgW25hbWVdPVwibmFtZSgpXCJcbiAgICAgIFthcHBlYXJhbmNlXT1cImFwcGVhcmFuY2UoKVwiXG4gICAgICBbc2l6ZV09XCJidXR0b25JY29uU2l6ZSgpXCJcbiAgICAvPlxuICA8L2J1dHRvbj5cbn0gQGVsc2Uge1xuICA8YnV0dG9uXG4gICAgKm5nSWY9XCJpc1ZhbGlkSWNvbk5hbWVcIlxuICAgIGNsYXNzPVwicnRlLWljb24tYnV0dG9uIHt7IHZhcmlhbnQoKSB9fSBzaXplLXt7IHNpemUoKSB9fVwiXG4gICAgW2NsYXNzLmNvbXBhY3Qtc3BhY2luZ109XCJjb21wYWN0U3BhY2luZygpXCJcbiAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWQoKVwiXG4gICAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWwoKVwiXG4gICAgW2F0dHIuYXJpYS1sYWJlbGxlZGJ5XT1cImFyaWFMYWJlbGxlZEJ5KClcIlxuICAgIFt0eXBlXT1cInR5cGUoKVwiXG4gICAgKGNsaWNrKT1cIm9uQ2xpY2soJGV2ZW50KVwiXG4gID5cbiAgICA8cnRlLWljb25cbiAgICAgIFtuYW1lXT1cIm5hbWUoKVwiXG4gICAgICBbYXBwZWFyYW5jZV09XCJhcHBlYXJhbmNlKClcIlxuICAgICAgW3NpemVdPVwiYnV0dG9uSWNvblNpemUoKVwiXG4gICAgLz5cbiAgPC9idXR0b24+XG59XG4iXX0=
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { CommonModule } from "@angular/common";
|
|
2
2
|
import { ChangeDetectionStrategy, Component, computed, input, output, signal } from "@angular/core";
|
|
3
|
-
import {
|
|
3
|
+
import { ButtonIconSize } from "@design-system-rte/core/components/button/common/common-button.constants";
|
|
4
4
|
import { IconButtonComponent } from "../icon-button/icon-button.component";
|
|
5
5
|
import * as i0 from "@angular/core";
|
|
6
6
|
export class IconButtonToggleComponent {
|
|
@@ -21,7 +21,7 @@ export class IconButtonToggleComponent {
|
|
|
21
21
|
this.isSelected = computed(() => {
|
|
22
22
|
return this.isControlled() ? this.selected() : this.internalSelected();
|
|
23
23
|
});
|
|
24
|
-
this.buttonIconSize = computed(() =>
|
|
24
|
+
this.buttonIconSize = computed(() => ButtonIconSize[this.size()]);
|
|
25
25
|
}
|
|
26
26
|
toggleInternalSelectedState() {
|
|
27
27
|
this.internalSelected.set(!this.internalSelected());
|
|
@@ -40,4 +40,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
40
40
|
type: Component,
|
|
41
41
|
args: [{ selector: "rte-icon-button-toggle", imports: [CommonModule, IconButtonComponent], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<rte-icon-button \n [size]=\"size()\" \n [name]=\"name()\" \n [compactSpacing]=\"compactSpacing()\"\n [disabled]=\"disabled()\"\n [ariaLabel]=\"ariaLabel()\"\n [ariaLabelledBy]=\"ariaLabelledBy()\"\n [type]=\"type()\"\n [variant]=\"variant()\"\n [appearance]=\"isSelected() ? 'filled' : 'outlined'\"\n (click)=\"onClick($event)\"\n/>" }]
|
|
42
42
|
}] });
|
|
43
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
43
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1idXR0b24tdG9nZ2xlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2ljb24tYnV0dG9uLXRvZ2dsZS9pY29uLWJ1dHRvbi10b2dnbGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvaWNvbi1idXR0b24tdG9nZ2xlL2ljb24tYnV0dG9uLXRvZ2dsZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHcEcsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDBFQUEwRSxDQUFDO0FBRzFHLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDOztBQVMzRSxNQUFNLE9BQU8seUJBQXlCO0lBUHRDO1FBUVcsYUFBUSxHQUFHLEtBQUssQ0FBVSxLQUFLLENBQUMsQ0FBQztRQUNqQyxTQUFJLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBeUMsQ0FBQztRQUMvRCxTQUFJLEdBQUcsS0FBSyxDQUFhLEdBQUcsQ0FBQyxDQUFDO1FBQzlCLFlBQU8sR0FBRyxLQUFLLENBQWdCLFNBQVMsQ0FBQyxDQUFDO1FBQzFDLFNBQUksR0FBRyxLQUFLLENBQWEsUUFBUSxDQUFDLENBQUM7UUFDbkMsbUJBQWMsR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFDdkMsY0FBUyxHQUFHLEtBQUssRUFBc0IsQ0FBQztRQUN4QyxtQkFBYyxHQUFHLEtBQUssRUFBc0IsQ0FBQztRQUU3QyxhQUFRLEdBQUcsS0FBSyxFQUF1QixDQUFDO1FBRXhDLHFCQUFnQixHQUFHLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUVqQyxvQkFBZSxHQUFHLEtBQUssQ0FBVSxLQUFLLENBQUMsQ0FBQztRQUV4QyxpQkFBWSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLEtBQUssU0FBUyxDQUFDLENBQUM7UUFFN0QsVUFBSyxHQUFHLE1BQU0sRUFBOEIsQ0FBQztRQUU3QyxlQUFVLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRTtZQUNsQyxPQUFPLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQztRQUN6RSxDQUFDLENBQUMsQ0FBQztRQWNNLG1CQUFjLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQyxDQUFDO0tBQ3ZFO0lBYlMsMkJBQTJCO1FBQ2pDLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxHQUFHLENBQUMsQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDO0lBQ3RELENBQUM7SUFFRCxPQUFPLENBQUMsS0FBaUM7UUFDdkMsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3hCLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxJQUFJLENBQUMsWUFBWSxFQUFFLEVBQUUsQ0FBQztZQUN6QixJQUFJLENBQUMsMkJBQTJCLEVBQUUsQ0FBQztRQUNyQyxDQUFDO0lBQ0gsQ0FBQzsrR0FsQ1UseUJBQXlCO21HQUF6Qix5QkFBeUIseTVDQ2hCdEMseVZBV0UsMkNEQVUsWUFBWSwrQkFBRSxtQkFBbUI7OzRGQUtoQyx5QkFBeUI7a0JBUHJDLFNBQVM7K0JBQ0Usd0JBQXdCLFdBQ3pCLENBQUMsWUFBWSxFQUFFLG1CQUFtQixDQUFDLGNBQ2hDLElBQUksbUJBRUMsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjtcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBpbnB1dCwgb3V0cHV0LCBzaWduYWwgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgQnV0dG9uVHlwZSB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2J1dHRvbi9idXR0b24uaW50ZXJmYWNlXCI7XG5pbXBvcnQgeyBCdXR0b25TaXplLCBCdXR0b25WYXJpYW50IH0gZnJvbSBcIkBkZXNpZ24tc3lzdGVtLXJ0ZS9jb3JlL2NvbXBvbmVudHMvYnV0dG9uL2NvbW1vbi9jb21tb24tYnV0dG9uXCI7XG5pbXBvcnQgeyBCdXR0b25JY29uU2l6ZSB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2J1dHRvbi9jb21tb24vY29tbW9uLWJ1dHRvbi5jb25zdGFudHNcIjtcblxuaW1wb3J0IHsgUmVndWxhckljb25JZEtleSwgVG9nZ2xhYmxlSWNvbklkS2V5IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5zZXJ2aWNlXCI7XG5pbXBvcnQgeyBJY29uQnV0dG9uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24tYnV0dG9uL2ljb24tYnV0dG9uLmNvbXBvbmVudFwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwicnRlLWljb24tYnV0dG9uLXRvZ2dsZVwiLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJY29uQnV0dG9uQ29tcG9uZW50XSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9pY29uLWJ1dHRvbi10b2dnbGUuY29tcG9uZW50Lmh0bWxcIixcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEljb25CdXR0b25Ub2dnbGVDb21wb25lbnQge1xuICByZWFkb25seSBkaXNhYmxlZCA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcbiAgcmVhZG9ubHkgbmFtZSA9IGlucHV0LnJlcXVpcmVkPFJlZ3VsYXJJY29uSWRLZXkgfCBUb2dnbGFibGVJY29uSWRLZXk+KCk7XG4gIHJlYWRvbmx5IHNpemUgPSBpbnB1dDxCdXR0b25TaXplPihcIm1cIik7XG4gIHJlYWRvbmx5IHZhcmlhbnQgPSBpbnB1dDxCdXR0b25WYXJpYW50PihcInByaW1hcnlcIik7XG4gIHJlYWRvbmx5IHR5cGUgPSBpbnB1dDxCdXR0b25UeXBlPihcImJ1dHRvblwiKTtcbiAgcmVhZG9ubHkgY29tcGFjdFNwYWNpbmcgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG4gIHJlYWRvbmx5IGFyaWFMYWJlbCA9IGlucHV0PHN0cmluZyB8IHVuZGVmaW5lZD4oKTtcbiAgcmVhZG9ubHkgYXJpYUxhYmVsbGVkQnkgPSBpbnB1dDxzdHJpbmcgfCB1bmRlZmluZWQ+KCk7XG5cbiAgcmVhZG9ubHkgc2VsZWN0ZWQgPSBpbnB1dDxib29sZWFuIHwgdW5kZWZpbmVkPigpO1xuXG4gIHJlYWRvbmx5IGludGVybmFsU2VsZWN0ZWQgPSBzaWduYWwoZmFsc2UpO1xuXG4gIHJlYWRvbmx5IGRlZmF1bHRTZWxlY3RlZCA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcblxuICByZWFkb25seSBpc0NvbnRyb2xsZWQgPSBjb21wdXRlZCgoKSA9PiB0aGlzLnNlbGVjdGVkKCkgIT09IHVuZGVmaW5lZCk7XG5cbiAgcmVhZG9ubHkgY2xpY2sgPSBvdXRwdXQ8TW91c2VFdmVudCB8IEtleWJvYXJkRXZlbnQ+KCk7XG5cbiAgcmVhZG9ubHkgaXNTZWxlY3RlZCA9IGNvbXB1dGVkKCgpID0+IHtcbiAgICByZXR1cm4gdGhpcy5pc0NvbnRyb2xsZWQoKSA/IHRoaXMuc2VsZWN0ZWQoKSA6IHRoaXMuaW50ZXJuYWxTZWxlY3RlZCgpO1xuICB9KTtcblxuICBwcml2YXRlIHRvZ2dsZUludGVybmFsU2VsZWN0ZWRTdGF0ZSgpOiB2b2lkIHtcbiAgICB0aGlzLmludGVybmFsU2VsZWN0ZWQuc2V0KCF0aGlzLmludGVybmFsU2VsZWN0ZWQoKSk7XG4gIH1cblxuICBvbkNsaWNrKGV2ZW50OiBNb3VzZUV2ZW50IHwgS2V5Ym9hcmRFdmVudCk6IHZvaWQge1xuICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgIHRoaXMuY2xpY2suZW1pdChldmVudCk7XG4gICAgaWYgKCF0aGlzLmlzQ29udHJvbGxlZCgpKSB7XG4gICAgICB0aGlzLnRvZ2dsZUludGVybmFsU2VsZWN0ZWRTdGF0ZSgpO1xuICAgIH1cbiAgfVxuXG4gIHJlYWRvbmx5IGJ1dHRvbkljb25TaXplID0gY29tcHV0ZWQoKCkgPT4gQnV0dG9uSWNvblNpemVbdGhpcy5zaXplKCldKTtcbn1cbiIsIjxydGUtaWNvbi1idXR0b24gXG4gIFtzaXplXT1cInNpemUoKVwiIFxuICBbbmFtZV09XCJuYW1lKClcIiBcbiAgW2NvbXBhY3RTcGFjaW5nXT1cImNvbXBhY3RTcGFjaW5nKClcIlxuICBbZGlzYWJsZWRdPVwiZGlzYWJsZWQoKVwiXG4gIFthcmlhTGFiZWxdPVwiYXJpYUxhYmVsKClcIlxuICBbYXJpYUxhYmVsbGVkQnldPVwiYXJpYUxhYmVsbGVkQnkoKVwiXG4gIFt0eXBlXT1cInR5cGUoKVwiXG4gIFt2YXJpYW50XT1cInZhcmlhbnQoKVwiXG4gIFthcHBlYXJhbmNlXT1cImlzU2VsZWN0ZWQoKSA/ICdmaWxsZWQnIDogJ291dGxpbmVkJ1wiXG4gIChjbGljayk9XCJvbkNsaWNrKCRldmVudClcIlxuLz4iXX0=
|