@agorapulse/ui-components 18.0.42 → 18.0.44

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.
@@ -11,7 +11,7 @@ export class SelectLabelSingleComponent {
11
11
  showAvatarInitials = true;
12
12
  roundedAvatar = input(true);
13
13
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: SelectLabelSingleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
14
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: SelectLabelSingleComponent, isStandalone: true, selector: "ap-select-label-single", inputs: { displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: true, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, network: { classPropertyName: "network", publicName: "network", isSignal: false, isRequired: false, transformFunction: null }, showAvatarInitials: { classPropertyName: "showAvatarInitials", publicName: "showAvatarInitials", isSignal: false, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@switch (displayType) {\n @case ('text') {\n <span\n class=\"text-item\"\n [title]=\"label\">\n {{ label }}\n </span>\n }\n @case ('label') {\n <ap-label\n color=\"blue\"\n [removable]=\"false\"\n [content]=\"label\" />\n }\n @case ('tag') {\n <ap-tag\n class=\"text-item\"\n color=\"grey\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"16\"\n [username]=\"label\"\n [showInitials]=\"true\"\n [profilePicture]=\"avatarUrl\" />\n }\n {{ label }}\n </ap-tag>\n }\n @case ('withAvatar') {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [username]=\"label\"\n [showInitials]=\"showAvatarInitials\"\n [profilePicture]=\"avatarUrl\"\n [network]=\"network\" />\n <span class=\"text-item\">\n {{ label }}\n </span>\n }\n}\n", styles: ["ap-select-label-single{display:flex;gap:var(--ref-spacing-xxs);width:100%;align-items:center}\n"], dependencies: [{ kind: "component", type: LabelComponent, selector: "ap-label", inputs: ["content", "selectorWidth", "removable"], outputs: ["remove"] }, { kind: "component", type: TagComponent, selector: "ap-tag", inputs: ["clearable", "color", "mini"], outputs: ["clear"] }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
14
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: SelectLabelSingleComponent, isStandalone: true, selector: "ap-select-label-single", inputs: { displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: true, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, network: { classPropertyName: "network", publicName: "network", isSignal: false, isRequired: false, transformFunction: null }, showAvatarInitials: { classPropertyName: "showAvatarInitials", publicName: "showAvatarInitials", isSignal: false, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@switch (displayType) {\n @case ('text') {\n <span\n class=\"text-item\"\n [title]=\"label\">\n {{ label }}\n </span>\n }\n @case ('label') {\n <ap-label\n color=\"blue\"\n [removable]=\"false\"\n [content]=\"label\" />\n }\n @case ('tag') {\n <ap-tag\n class=\"text-item\"\n color=\"grey\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"16\"\n [username]=\"label\"\n [showInitials]=\"true\"\n [profilePicture]=\"avatarUrl\" />\n }\n {{ label }}\n </ap-tag>\n }\n @case ('withAvatar') {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [username]=\"label\"\n [showInitials]=\"showAvatarInitials\"\n [profilePicture]=\"avatarUrl\"\n [network]=\"network\" />\n <span class=\"text-item\">\n {{ label }}\n </span>\n }\n}\n", styles: ["ap-select-label-single{display:flex;gap:var(--ref-spacing-xxs);width:100%;align-items:center}\n"], dependencies: [{ kind: "component", type: LabelComponent, selector: "ap-label", inputs: ["content", "selectorWidth", "removable"], outputs: ["remove"] }, { kind: "component", type: TagComponent, selector: "ap-tag", inputs: ["clearable", "add", "color", "mini"], outputs: ["clear", "added"] }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
15
15
  }
16
16
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: SelectLabelSingleComponent, decorators: [{
17
17
  type: Component,
@@ -30,4 +30,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
30
30
  }], showAvatarInitials: [{
31
31
  type: Input
32
32
  }] } });
33
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0LWxhYmVsLXNpbmdsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvc2VsZWN0L3NyYy9zZWxlY3QtbGFiZWwtc2luZ2xlL3NlbGVjdC1sYWJlbC1zaW5nbGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vbGlicy91aS1jb21wb25lbnRzL3NlbGVjdC9zcmMvc2VsZWN0LWxhYmVsLXNpbmdsZS9zZWxlY3QtbGFiZWwtc2luZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxlQUFlLEVBQWlCLE1BQU0sa0NBQWtDLENBQUM7QUFDbEYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLGtDQUFrQyxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUU3RCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBV3BHLE1BQU0sT0FBTywwQkFBMEI7SUFDMUIsV0FBVyxHQUE0QyxNQUFNLENBQUM7SUFJdkUsS0FBSyxDQUFVO0lBQ04sU0FBUyxDQUFVO0lBQ25CLE9BQU8sR0FBOEIsU0FBUyxDQUFDO0lBQy9DLGtCQUFrQixHQUFHLElBQUksQ0FBQztJQUVuQyxhQUFhLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDO3VHQVZuQiwwQkFBMEI7MkZBQTFCLDBCQUEwQixxNUJDZnZDLDhvQ0EwQ0EseUpEN0JjLGNBQWMsNkhBQUUsWUFBWSwrR0FBRSxlQUFlOzsyRkFFOUMsMEJBQTBCO2tCQVR0QyxTQUFTOytCQUNJLHdCQUF3QixjQUd0QixJQUFJLGlCQUNELGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxjQUFjLEVBQUUsWUFBWSxFQUFFLGVBQWUsQ0FBQzs4QkFHL0MsV0FBVztzQkFBbkIsS0FBSztnQkFJTixLQUFLO3NCQUhKLEtBQUs7dUJBQUM7d0JBQ0gsUUFBUSxFQUFFLElBQUk7cUJBQ2pCO2dCQUVRLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLGtCQUFrQjtzQkFBMUIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEF2YXRhckNvbXBvbmVudCwgQXZhdGFyTmV0d29yayB9IGZyb20gJ0BhZ29yYXB1bHNlL3VpLWNvbXBvbmVudHMvYXZhdGFyJztcbmltcG9ydCB7IExhYmVsQ29tcG9uZW50IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy9sYWJlbHMnO1xuaW1wb3J0IHsgVGFnQ29tcG9uZW50IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy90YWcnO1xuXG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbnB1dCwgSW5wdXQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnYXAtc2VsZWN0LWxhYmVsLXNpbmdsZScsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3NlbGVjdC1sYWJlbC1zaW5nbGUuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3NlbGVjdC1sYWJlbC1zaW5nbGUuY29tcG9uZW50LnNjc3MnXSxcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgaW1wb3J0czogW0xhYmVsQ29tcG9uZW50LCBUYWdDb21wb25lbnQsIEF2YXRhckNvbXBvbmVudF0sXG59KVxuZXhwb3J0IGNsYXNzIFNlbGVjdExhYmVsU2luZ2xlQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBkaXNwbGF5VHlwZTogJ3RleHQnIHwgJ3dpdGhBdmF0YXInIHwgJ3RhZycgfCAnbGFiZWwnID0gJ3RleHQnO1xuICAgIEBJbnB1dCh7XG4gICAgICAgIHJlcXVpcmVkOiB0cnVlLFxuICAgIH0pXG4gICAgbGFiZWwhOiBzdHJpbmc7XG4gICAgQElucHV0KCkgYXZhdGFyVXJsPzogc3RyaW5nO1xuICAgIEBJbnB1dCgpIG5ldHdvcms6IEF2YXRhck5ldHdvcmsgfCB1bmRlZmluZWQgPSB1bmRlZmluZWQ7XG4gICAgQElucHV0KCkgc2hvd0F2YXRhckluaXRpYWxzID0gdHJ1ZTtcblxuICAgIHJvdW5kZWRBdmF0YXIgPSBpbnB1dCh0cnVlKTtcbn1cbiIsIkBzd2l0Y2ggKGRpc3BsYXlUeXBlKSB7XG4gICAgQGNhc2UgKCd0ZXh0Jykge1xuICAgICAgICA8c3BhblxuICAgICAgICAgICAgY2xhc3M9XCJ0ZXh0LWl0ZW1cIlxuICAgICAgICAgICAgW3RpdGxlXT1cImxhYmVsXCI+XG4gICAgICAgICAgICB7eyBsYWJlbCB9fVxuICAgICAgICA8L3NwYW4+XG4gICAgfVxuICAgIEBjYXNlICgnbGFiZWwnKSB7XG4gICAgICAgIDxhcC1sYWJlbFxuICAgICAgICAgICAgY29sb3I9XCJibHVlXCJcbiAgICAgICAgICAgIFtyZW1vdmFibGVdPVwiZmFsc2VcIlxuICAgICAgICAgICAgW2NvbnRlbnRdPVwibGFiZWxcIiAvPlxuICAgIH1cbiAgICBAY2FzZSAoJ3RhZycpIHtcbiAgICAgICAgPGFwLXRhZ1xuICAgICAgICAgICAgY2xhc3M9XCJ0ZXh0LWl0ZW1cIlxuICAgICAgICAgICAgY29sb3I9XCJncmV5XCI+XG4gICAgICAgICAgICBAaWYgKGF2YXRhclVybCAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICAgICAgICAgICAgPGFwLWF2YXRhclxuICAgICAgICAgICAgICAgICAgICBbcm91bmRlZF09XCJyb3VuZGVkQXZhdGFyKClcIlxuICAgICAgICAgICAgICAgICAgICBbc2l6ZV09XCIxNlwiXG4gICAgICAgICAgICAgICAgICAgIFt1c2VybmFtZV09XCJsYWJlbFwiXG4gICAgICAgICAgICAgICAgICAgIFtzaG93SW5pdGlhbHNdPVwidHJ1ZVwiXG4gICAgICAgICAgICAgICAgICAgIFtwcm9maWxlUGljdHVyZV09XCJhdmF0YXJVcmxcIiAvPlxuICAgICAgICAgICAgfVxuICAgICAgICAgICAge3sgbGFiZWwgfX1cbiAgICAgICAgPC9hcC10YWc+XG4gICAgfVxuICAgIEBjYXNlICgnd2l0aEF2YXRhcicpIHtcbiAgICAgICAgPGFwLWF2YXRhclxuICAgICAgICAgICAgW3JvdW5kZWRdPVwicm91bmRlZEF2YXRhcigpXCJcbiAgICAgICAgICAgIFtzaXplXT1cIjI0XCJcbiAgICAgICAgICAgIFt1c2VybmFtZV09XCJsYWJlbFwiXG4gICAgICAgICAgICBbc2hvd0luaXRpYWxzXT1cInNob3dBdmF0YXJJbml0aWFsc1wiXG4gICAgICAgICAgICBbcHJvZmlsZVBpY3R1cmVdPVwiYXZhdGFyVXJsXCJcbiAgICAgICAgICAgIFtuZXR3b3JrXT1cIm5ldHdvcmtcIiAvPlxuICAgICAgICA8c3BhbiBjbGFzcz1cInRleHQtaXRlbVwiPlxuICAgICAgICAgICAge3sgbGFiZWwgfX1cbiAgICAgICAgPC9zcGFuPlxuICAgIH1cbn1cbiJdfQ==
33
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0LWxhYmVsLXNpbmdsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvc2VsZWN0L3NyYy9zZWxlY3QtbGFiZWwtc2luZ2xlL3NlbGVjdC1sYWJlbC1zaW5nbGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vbGlicy91aS1jb21wb25lbnRzL3NlbGVjdC9zcmMvc2VsZWN0LWxhYmVsLXNpbmdsZS9zZWxlY3QtbGFiZWwtc2luZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxlQUFlLEVBQWlCLE1BQU0sa0NBQWtDLENBQUM7QUFDbEYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLGtDQUFrQyxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUU3RCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBV3BHLE1BQU0sT0FBTywwQkFBMEI7SUFDMUIsV0FBVyxHQUE0QyxNQUFNLENBQUM7SUFJdkUsS0FBSyxDQUFVO0lBQ04sU0FBUyxDQUFVO0lBQ25CLE9BQU8sR0FBOEIsU0FBUyxDQUFDO0lBQy9DLGtCQUFrQixHQUFHLElBQUksQ0FBQztJQUVuQyxhQUFhLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDO3VHQVZuQiwwQkFBMEI7MkZBQTFCLDBCQUEwQixxNUJDZnZDLDhvQ0EwQ0EseUpEN0JjLGNBQWMsNkhBQUUsWUFBWSwrSEFBRSxlQUFlOzsyRkFFOUMsMEJBQTBCO2tCQVR0QyxTQUFTOytCQUNJLHdCQUF3QixjQUd0QixJQUFJLGlCQUNELGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxjQUFjLEVBQUUsWUFBWSxFQUFFLGVBQWUsQ0FBQzs4QkFHL0MsV0FBVztzQkFBbkIsS0FBSztnQkFJTixLQUFLO3NCQUhKLEtBQUs7dUJBQUM7d0JBQ0gsUUFBUSxFQUFFLElBQUk7cUJBQ2pCO2dCQUVRLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLGtCQUFrQjtzQkFBMUIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEF2YXRhckNvbXBvbmVudCwgQXZhdGFyTmV0d29yayB9IGZyb20gJ0BhZ29yYXB1bHNlL3VpLWNvbXBvbmVudHMvYXZhdGFyJztcbmltcG9ydCB7IExhYmVsQ29tcG9uZW50IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy9sYWJlbHMnO1xuaW1wb3J0IHsgVGFnQ29tcG9uZW50IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy90YWcnO1xuXG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbnB1dCwgSW5wdXQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnYXAtc2VsZWN0LWxhYmVsLXNpbmdsZScsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3NlbGVjdC1sYWJlbC1zaW5nbGUuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3NlbGVjdC1sYWJlbC1zaW5nbGUuY29tcG9uZW50LnNjc3MnXSxcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgaW1wb3J0czogW0xhYmVsQ29tcG9uZW50LCBUYWdDb21wb25lbnQsIEF2YXRhckNvbXBvbmVudF0sXG59KVxuZXhwb3J0IGNsYXNzIFNlbGVjdExhYmVsU2luZ2xlQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBkaXNwbGF5VHlwZTogJ3RleHQnIHwgJ3dpdGhBdmF0YXInIHwgJ3RhZycgfCAnbGFiZWwnID0gJ3RleHQnO1xuICAgIEBJbnB1dCh7XG4gICAgICAgIHJlcXVpcmVkOiB0cnVlLFxuICAgIH0pXG4gICAgbGFiZWwhOiBzdHJpbmc7XG4gICAgQElucHV0KCkgYXZhdGFyVXJsPzogc3RyaW5nO1xuICAgIEBJbnB1dCgpIG5ldHdvcms6IEF2YXRhck5ldHdvcmsgfCB1bmRlZmluZWQgPSB1bmRlZmluZWQ7XG4gICAgQElucHV0KCkgc2hvd0F2YXRhckluaXRpYWxzID0gdHJ1ZTtcblxuICAgIHJvdW5kZWRBdmF0YXIgPSBpbnB1dCh0cnVlKTtcbn1cbiIsIkBzd2l0Y2ggKGRpc3BsYXlUeXBlKSB7XG4gICAgQGNhc2UgKCd0ZXh0Jykge1xuICAgICAgICA8c3BhblxuICAgICAgICAgICAgY2xhc3M9XCJ0ZXh0LWl0ZW1cIlxuICAgICAgICAgICAgW3RpdGxlXT1cImxhYmVsXCI+XG4gICAgICAgICAgICB7eyBsYWJlbCB9fVxuICAgICAgICA8L3NwYW4+XG4gICAgfVxuICAgIEBjYXNlICgnbGFiZWwnKSB7XG4gICAgICAgIDxhcC1sYWJlbFxuICAgICAgICAgICAgY29sb3I9XCJibHVlXCJcbiAgICAgICAgICAgIFtyZW1vdmFibGVdPVwiZmFsc2VcIlxuICAgICAgICAgICAgW2NvbnRlbnRdPVwibGFiZWxcIiAvPlxuICAgIH1cbiAgICBAY2FzZSAoJ3RhZycpIHtcbiAgICAgICAgPGFwLXRhZ1xuICAgICAgICAgICAgY2xhc3M9XCJ0ZXh0LWl0ZW1cIlxuICAgICAgICAgICAgY29sb3I9XCJncmV5XCI+XG4gICAgICAgICAgICBAaWYgKGF2YXRhclVybCAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICAgICAgICAgICAgPGFwLWF2YXRhclxuICAgICAgICAgICAgICAgICAgICBbcm91bmRlZF09XCJyb3VuZGVkQXZhdGFyKClcIlxuICAgICAgICAgICAgICAgICAgICBbc2l6ZV09XCIxNlwiXG4gICAgICAgICAgICAgICAgICAgIFt1c2VybmFtZV09XCJsYWJlbFwiXG4gICAgICAgICAgICAgICAgICAgIFtzaG93SW5pdGlhbHNdPVwidHJ1ZVwiXG4gICAgICAgICAgICAgICAgICAgIFtwcm9maWxlUGljdHVyZV09XCJhdmF0YXJVcmxcIiAvPlxuICAgICAgICAgICAgfVxuICAgICAgICAgICAge3sgbGFiZWwgfX1cbiAgICAgICAgPC9hcC10YWc+XG4gICAgfVxuICAgIEBjYXNlICgnd2l0aEF2YXRhcicpIHtcbiAgICAgICAgPGFwLWF2YXRhclxuICAgICAgICAgICAgW3JvdW5kZWRdPVwicm91bmRlZEF2YXRhcigpXCJcbiAgICAgICAgICAgIFtzaXplXT1cIjI0XCJcbiAgICAgICAgICAgIFt1c2VybmFtZV09XCJsYWJlbFwiXG4gICAgICAgICAgICBbc2hvd0luaXRpYWxzXT1cInNob3dBdmF0YXJJbml0aWFsc1wiXG4gICAgICAgICAgICBbcHJvZmlsZVBpY3R1cmVdPVwiYXZhdGFyVXJsXCJcbiAgICAgICAgICAgIFtuZXR3b3JrXT1cIm5ldHdvcmtcIiAvPlxuICAgICAgICA8c3BhbiBjbGFzcz1cInRleHQtaXRlbVwiPlxuICAgICAgICAgICAge3sgbGFiZWwgfX1cbiAgICAgICAgPC9zcGFuPlxuICAgIH1cbn1cbiJdfQ==
@@ -1,17 +1,19 @@
1
1
  import { CloseButtonComponent } from '@agorapulse/ui-components/close-button';
2
- import { apDeleteNoCircle, SymbolRegistry } from '@agorapulse/ui-symbol';
3
- import { booleanAttribute, ChangeDetectionStrategy, Component, computed, ElementRef, EventEmitter, inject, Input, Output, viewChild, ViewEncapsulation, } from '@angular/core';
2
+ import { apDeleteNoCircle, apPlus, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';
3
+ import { booleanAttribute, ChangeDetectionStrategy, Component, computed, ElementRef, inject, input, output, viewChild, ViewEncapsulation, } from '@angular/core';
4
4
  import * as i0 from "@angular/core";
5
5
  export class TagComponent {
6
6
  elementRef = inject(ElementRef);
7
7
  symbolRegistry = inject(SymbolRegistry);
8
8
  constructor() {
9
- this.symbolRegistry.registerSymbols([apDeleteNoCircle]);
9
+ this.symbolRegistry.registerSymbols([apDeleteNoCircle, apPlus]);
10
10
  }
11
- clearable = false;
12
- color = 'blue';
13
- mini = false;
14
- clear = new EventEmitter();
11
+ clearable = input(false, { transform: booleanAttribute });
12
+ add = input(false, { transform: booleanAttribute });
13
+ color = input('blue');
14
+ mini = input(false);
15
+ clear = output();
16
+ added = output();
15
17
  content = viewChild.required('contentWrapper');
16
18
  contentText = computed(() => this.content().nativeElement.innerText);
17
19
  onClear($event) {
@@ -19,20 +21,15 @@ export class TagComponent {
19
21
  this.elementRef.nativeElement.remove();
20
22
  this.clear.emit({ $event });
21
23
  }
24
+ onAdd($event) {
25
+ $event.stopImmediatePropagation();
26
+ this.added.emit({ $event: $event });
27
+ }
22
28
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
23
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: TagComponent, isStandalone: true, selector: "ap-tag", inputs: { clearable: ["clearable", "clearable", booleanAttribute], color: "color", mini: "mini" }, outputs: { clear: "clear" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentWrapper"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n [class.blue]=\"color === 'blue'\"\n [class.menthol]=\"color === 'menthol'\"\n [class.grey]=\"color === 'grey'\"\n [class.tagOrange]=\"color === 'tagOrange'\"\n [class.green]=\"color === 'green'\"\n [class.red]=\"color === 'red'\"\n [class.clearable]=\"clearable\"\n [class.mini]=\"mini\">\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"ap-avatar\" />\n\n <span #contentWrapper>\n <ng-content />\n </span>\n\n @if (clearable) {\n <!-- FIXME implement as a directive and combine with a button tag to have to full access to all attributes (aria-labelledby) -->\n <ap-close-button\n [ariaLabel]=\"'clear ' + contentText()\"\n (closed)=\"onClear($event)\" />\n }\n</div>\n", styles: ["ap-tag{--avatar-size: 16px;--button-size: 20px;display:inline-flex;vertical-align:middle}ap-tag>div{display:flex;align-items:center;justify-content:center;height:var(--comp-tag-height);max-height:var(--height);box-sizing:border-box;border-width:1px;border-style:solid;padding:0 var(--comp-tag-padding-right) 0 var(--comp-tag-padding-left);border-radius:var(--comp-tag-border-radius);gap:var(--ref-spacing-xxxs)}ap-tag>div.clearable{padding:0 calc(var(--comp-tag-closable-padding-right) - 1px) 0 var(--comp-tag-padding-left)}ap-tag>div.mini{height:var(--comp-tag-mini-height);padding:0 var(--comp-tag-mini-padding-right) 0 var(--comp-tag-mini-padding-left)}ap-tag>div span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--comp-tag-text-style-size);line-height:var(--comp-tag-text-style-line-height);font-weight:var(--comp-tag-text-style-font-weight);font-family:var(--comp-tag-text-style-font-family)}ap-tag>div ap-avatar{min-width:var(--avatar-size);width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);height:var(--avatar-size);max-height:var(--avatar-size)}ap-tag>div ap-avatar img{width:var(--avatar-size);height:var(--avatar-size)}ap-tag>div.blue{background-color:var(--comp-tag-blue-background-color);border-color:var(--comp-tag-blue-border-color);color:var(--comp-tag-blue-text-color)}ap-tag>div.grey{background-color:var(--comp-tag-grey-background-color);border-color:var(--comp-tag-grey-border-color);color:var(--comp-tag-grey-text-color)}ap-tag>div.tagOrange{background-color:var(--comp-tag-tag-orange-background-color);border-color:var(--comp-tag-tag-orange-border-color);color:var(--comp-tag-tag-orange-text-color)}ap-tag>div.menthol{background-color:var(--comp-tag-menthol-background-color);border-color:var(--comp-tag-menthol-border-color);color:var(--comp-tag-menthol-text-color)}ap-tag>div.green{background-color:var(--comp-tag-green-background-color);border-color:var(--comp-tag-green-border-color);color:var(--comp-tag-green-text-color)}ap-tag>div.red{background-color:var(--comp-tag-red-background-color);border-color:var(--comp-tag-red-border-color);color:var(--comp-tag-red-text-color)}\n"], dependencies: [{ kind: "component", type: CloseButtonComponent, selector: "ap-close-button", inputs: ["disabled", "ariaLabel", "dataTest"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
29
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: TagComponent, isStandalone: true, selector: "ap-tag", inputs: { clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, add: { classPropertyName: "add", publicName: "add", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, mini: { classPropertyName: "mini", publicName: "mini", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clear: "clear", added: "added" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentWrapper"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n [class.blue]=\"color() === 'blue'\"\n [class.menthol]=\"color() === 'menthol'\"\n [class.grey]=\"color() === 'grey'\"\n [class.tagOrange]=\"color() === 'tagOrange'\"\n [class.green]=\"color() === 'green'\"\n [class.red]=\"color() === 'red'\"\n [class.clearable]=\"clearable()\"\n [class.add]=\"add()\"\n [class.mini]=\"mini()\">\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"ap-avatar\" />\n\n <span #contentWrapper>\n <ng-content />\n </span>\n\n @if (clearable()) {\n <!-- FIXME implement as a directive and combine with a button tag to have to full access to all attributes (aria-labelledby) -->\n <ap-close-button\n [ariaLabel]=\"'clear ' + contentText()\"\n (closed)=\"onClear($event)\" />\n } @else if (add()) {\n <button \n class=\"add-button\"\n type=\"button\"\n aria-label=\"Add item\"\n (click)=\"onAdd($event)\">\n <ap-symbol size=\"xs\" symbolId=\"plus\" color=\"#344563\" />\n </button>\n }\n</div>\n", styles: ["ap-tag{--avatar-size: 16px;--button-size: 20px;display:inline-flex;vertical-align:middle}ap-tag>div{display:flex;align-items:center;justify-content:center;height:var(--comp-tag-height);max-height:var(--height);box-sizing:border-box;border-width:1px;border-style:solid;padding:0 var(--comp-tag-padding-right) 0 var(--comp-tag-padding-left);border-radius:var(--comp-tag-border-radius);gap:var(--ref-spacing-xxxs)}ap-tag>div.clearable,ap-tag>div.add{padding:0 calc(var(--comp-tag-closable-padding-right) - 1px) 0 var(--comp-tag-padding-left)}ap-tag>div.mini{height:var(--comp-tag-mini-height);padding:0 var(--comp-tag-mini-padding-right) 0 var(--comp-tag-mini-padding-left)}ap-tag>div span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--comp-tag-text-style-size);line-height:var(--comp-tag-text-style-line-height);font-weight:var(--comp-tag-text-style-font-weight);font-family:var(--comp-tag-text-style-font-family)}ap-tag>div ap-avatar{min-width:var(--avatar-size);width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);height:var(--avatar-size);max-height:var(--avatar-size)}ap-tag>div ap-avatar img{width:var(--avatar-size);height:var(--avatar-size)}ap-tag>div.blue{background-color:var(--comp-tag-blue-background-color);border-color:var(--comp-tag-blue-border-color);color:var(--comp-tag-blue-text-color)}ap-tag>div.grey{background-color:var(--comp-tag-grey-background-color);border-color:var(--comp-tag-grey-border-color);color:var(--comp-tag-grey-text-color)}ap-tag>div.tagOrange{background-color:var(--comp-tag-tag-orange-background-color);border-color:var(--comp-tag-tag-orange-border-color);color:var(--comp-tag-tag-orange-text-color)}ap-tag>div.menthol{background-color:var(--comp-tag-menthol-background-color);border-color:var(--comp-tag-menthol-border-color);color:var(--comp-tag-menthol-text-color)}ap-tag>div.green{background-color:var(--comp-tag-green-background-color);border-color:var(--comp-tag-green-border-color);color:var(--comp-tag-green-text-color)}ap-tag>div.red{background-color:var(--comp-tag-red-background-color);border-color:var(--comp-tag-red-border-color);color:var(--comp-tag-red-text-color)}ap-tag>div .add-button{margin:0;display:flex;justify-content:center;align-items:center;width:var(--comp-close-button-size);max-width:var(--comp-close-button-size);height:var(--comp-close-button-size);max-height:var(--comp-close-button-size);border-radius:50%;background:transparent;border:none;position:relative;transition:border .25s;padding:var(--comp-close-button-padding);outline:none;cursor:pointer}@media (hover: hover){ap-tag>div .add-button:focus:not(.disabled):not(:active){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-tag>div .add-button:hover{background:var(--comp-close-button-hover-background)}ap-tag>div .add-button:active{background:var(--comp-close-button-active-background);outline:none}ap-tag>div .add-button:focus:active{outline:none}\n"], dependencies: [{ kind: "component", type: CloseButtonComponent, selector: "ap-close-button", inputs: ["disabled", "ariaLabel", "dataTest"], outputs: ["closed"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
24
30
  }
25
31
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: TagComponent, decorators: [{
26
32
  type: Component,
27
- args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-tag', standalone: true, imports: [CloseButtonComponent], encapsulation: ViewEncapsulation.None, template: "<div\n [class.blue]=\"color === 'blue'\"\n [class.menthol]=\"color === 'menthol'\"\n [class.grey]=\"color === 'grey'\"\n [class.tagOrange]=\"color === 'tagOrange'\"\n [class.green]=\"color === 'green'\"\n [class.red]=\"color === 'red'\"\n [class.clearable]=\"clearable\"\n [class.mini]=\"mini\">\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"ap-avatar\" />\n\n <span #contentWrapper>\n <ng-content />\n </span>\n\n @if (clearable) {\n <!-- FIXME implement as a directive and combine with a button tag to have to full access to all attributes (aria-labelledby) -->\n <ap-close-button\n [ariaLabel]=\"'clear ' + contentText()\"\n (closed)=\"onClear($event)\" />\n }\n</div>\n", styles: ["ap-tag{--avatar-size: 16px;--button-size: 20px;display:inline-flex;vertical-align:middle}ap-tag>div{display:flex;align-items:center;justify-content:center;height:var(--comp-tag-height);max-height:var(--height);box-sizing:border-box;border-width:1px;border-style:solid;padding:0 var(--comp-tag-padding-right) 0 var(--comp-tag-padding-left);border-radius:var(--comp-tag-border-radius);gap:var(--ref-spacing-xxxs)}ap-tag>div.clearable{padding:0 calc(var(--comp-tag-closable-padding-right) - 1px) 0 var(--comp-tag-padding-left)}ap-tag>div.mini{height:var(--comp-tag-mini-height);padding:0 var(--comp-tag-mini-padding-right) 0 var(--comp-tag-mini-padding-left)}ap-tag>div span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--comp-tag-text-style-size);line-height:var(--comp-tag-text-style-line-height);font-weight:var(--comp-tag-text-style-font-weight);font-family:var(--comp-tag-text-style-font-family)}ap-tag>div ap-avatar{min-width:var(--avatar-size);width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);height:var(--avatar-size);max-height:var(--avatar-size)}ap-tag>div ap-avatar img{width:var(--avatar-size);height:var(--avatar-size)}ap-tag>div.blue{background-color:var(--comp-tag-blue-background-color);border-color:var(--comp-tag-blue-border-color);color:var(--comp-tag-blue-text-color)}ap-tag>div.grey{background-color:var(--comp-tag-grey-background-color);border-color:var(--comp-tag-grey-border-color);color:var(--comp-tag-grey-text-color)}ap-tag>div.tagOrange{background-color:var(--comp-tag-tag-orange-background-color);border-color:var(--comp-tag-tag-orange-border-color);color:var(--comp-tag-tag-orange-text-color)}ap-tag>div.menthol{background-color:var(--comp-tag-menthol-background-color);border-color:var(--comp-tag-menthol-border-color);color:var(--comp-tag-menthol-text-color)}ap-tag>div.green{background-color:var(--comp-tag-green-background-color);border-color:var(--comp-tag-green-border-color);color:var(--comp-tag-green-text-color)}ap-tag>div.red{background-color:var(--comp-tag-red-background-color);border-color:var(--comp-tag-red-border-color);color:var(--comp-tag-red-text-color)}\n"] }]
28
- }], ctorParameters: () => [], propDecorators: { clearable: [{
29
- type: Input,
30
- args: [{ transform: booleanAttribute }]
31
- }], color: [{
32
- type: Input
33
- }], mini: [{
34
- type: Input
35
- }], clear: [{
36
- type: Output
37
- }] } });
38
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy90YWcvc3JjL3RhZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvdGFnL3NyYy90YWcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7QUFDOUUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLGNBQWMsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBRXpFLE9BQU8sRUFDSCxnQkFBZ0IsRUFDaEIsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxRQUFRLEVBQ1IsVUFBVSxFQUNWLFlBQVksRUFDWixNQUFNLEVBQ04sS0FBSyxFQUNMLE1BQU0sRUFDTixTQUFTLEVBQ1QsaUJBQWlCLEdBQ3BCLE1BQU0sZUFBZSxDQUFDOztBQWF2QixNQUFNLE9BQU8sWUFBWTtJQUNKLFVBQVUsR0FBZSxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDNUMsY0FBYyxHQUFtQixNQUFNLENBQUMsY0FBYyxDQUFDLENBQUM7SUFFekU7UUFDSSxJQUFJLENBQUMsY0FBYyxDQUFDLGVBQWUsQ0FBQyxDQUFDLGdCQUFnQixDQUFDLENBQUMsQ0FBQztJQUM1RCxDQUFDO0lBRXVDLFNBQVMsR0FBWSxLQUFLLENBQUM7SUFDMUQsS0FBSyxHQUFhLE1BQU0sQ0FBQztJQUN6QixJQUFJLEdBQUcsS0FBSyxDQUFDO0lBRVosS0FBSyxHQUFHLElBQUksWUFBWSxFQUF5QyxDQUFDO0lBRTVFLE9BQU8sR0FBRyxTQUFTLENBQUMsUUFBUSxDQUFhLGdCQUFnQixDQUFDLENBQUM7SUFDM0QsV0FBVyxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsYUFBYSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBRXJFLE9BQU8sQ0FBQyxNQUFpQztRQUNyQyxNQUFNLENBQUMsd0JBQXdCLEVBQUUsQ0FBQztRQUNsQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxNQUFNLEVBQUUsQ0FBQztRQUN2QyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxFQUFFLE1BQU0sRUFBRSxDQUFDLENBQUM7SUFDaEMsQ0FBQzt1R0FyQlEsWUFBWTsyRkFBWixZQUFZLDBGQVFELGdCQUFnQixtTkNwQ3hDLHV3QkF1QkEsOHJFRENjLG9CQUFvQjs7MkZBSXJCLFlBQVk7a0JBVHhCLFNBQVM7c0NBQ1csdUJBQXVCLENBQUMsTUFBTSxZQUNyQyxRQUFRLGNBQ04sSUFBSSxXQUVQLENBQUMsb0JBQW9CLENBQUMsaUJBRWhCLGlCQUFpQixDQUFDLElBQUk7d0RBVUcsU0FBUztzQkFBaEQsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRTtnQkFDN0IsS0FBSztzQkFBYixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFFSSxLQUFLO3NCQUFkLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDbG9zZUJ1dHRvbkNvbXBvbmVudCB9IGZyb20gJ0BhZ29yYXB1bHNlL3VpLWNvbXBvbmVudHMvY2xvc2UtYnV0dG9uJztcbmltcG9ydCB7IGFwRGVsZXRlTm9DaXJjbGUsIFN5bWJvbFJlZ2lzdHJ5IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktc3ltYm9sJztcblxuaW1wb3J0IHtcbiAgICBib29sZWFuQXR0cmlidXRlLFxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBjb21wdXRlZCxcbiAgICBFbGVtZW50UmVmLFxuICAgIEV2ZW50RW1pdHRlcixcbiAgICBpbmplY3QsXG4gICAgSW5wdXQsXG4gICAgT3V0cHV0LFxuICAgIHZpZXdDaGlsZCxcbiAgICBWaWV3RW5jYXBzdWxhdGlvbixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCB0eXBlIFRhZ0NvbG9yID0gJ2JsdWUnIHwgJ2dyZXknIHwgJ21lbnRob2wnIHwgJ3RhZ09yYW5nZScgfCAncmVkJyB8ICdncmVlbic7XG5cbkBDb21wb25lbnQoe1xuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIHNlbGVjdG9yOiAnYXAtdGFnJyxcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIHRlbXBsYXRlVXJsOiAnLi90YWcuY29tcG9uZW50Lmh0bWwnLFxuICAgIGltcG9ydHM6IFtDbG9zZUJ1dHRvbkNvbXBvbmVudF0sXG4gICAgc3R5bGVVcmxzOiBbJy4vdGFnLmNvbXBvbmVudC5zY3NzJ10sXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgVGFnQ29tcG9uZW50IHtcbiAgICBwcml2YXRlIHJlYWRvbmx5IGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYgPSBpbmplY3QoRWxlbWVudFJlZik7XG4gICAgcHJpdmF0ZSByZWFkb25seSBzeW1ib2xSZWdpc3RyeTogU3ltYm9sUmVnaXN0cnkgPSBpbmplY3QoU3ltYm9sUmVnaXN0cnkpO1xuXG4gICAgY29uc3RydWN0b3IoKSB7XG4gICAgICAgIHRoaXMuc3ltYm9sUmVnaXN0cnkucmVnaXN0ZXJTeW1ib2xzKFthcERlbGV0ZU5vQ2lyY2xlXSk7XG4gICAgfVxuXG4gICAgQElucHV0KHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pIGNsZWFyYWJsZTogYm9vbGVhbiA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIGNvbG9yOiBUYWdDb2xvciA9ICdibHVlJztcbiAgICBASW5wdXQoKSBtaW5pID0gZmFsc2U7XG5cbiAgICBAT3V0cHV0KCkgY2xlYXIgPSBuZXcgRXZlbnRFbWl0dGVyPHsgJGV2ZW50OiBNb3VzZUV2ZW50IHwgUG9pbnRlckV2ZW50IH0+KCk7XG5cbiAgICBjb250ZW50ID0gdmlld0NoaWxkLnJlcXVpcmVkPEVsZW1lbnRSZWY+KCdjb250ZW50V3JhcHBlcicpO1xuICAgIGNvbnRlbnRUZXh0ID0gY29tcHV0ZWQoKCkgPT4gdGhpcy5jb250ZW50KCkubmF0aXZlRWxlbWVudC5pbm5lclRleHQpO1xuXG4gICAgb25DbGVhcigkZXZlbnQ6IE1vdXNlRXZlbnQgfCBQb2ludGVyRXZlbnQpOiB2b2lkIHtcbiAgICAgICAgJGV2ZW50LnN0b3BJbW1lZGlhdGVQcm9wYWdhdGlvbigpO1xuICAgICAgICB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5yZW1vdmUoKTtcbiAgICAgICAgdGhpcy5jbGVhci5lbWl0KHsgJGV2ZW50IH0pO1xuICAgIH1cbn1cbiIsIjxkaXZcbiAgICBbY2xhc3MuYmx1ZV09XCJjb2xvciA9PT0gJ2JsdWUnXCJcbiAgICBbY2xhc3MubWVudGhvbF09XCJjb2xvciA9PT0gJ21lbnRob2wnXCJcbiAgICBbY2xhc3MuZ3JleV09XCJjb2xvciA9PT0gJ2dyZXknXCJcbiAgICBbY2xhc3MudGFnT3JhbmdlXT1cImNvbG9yID09PSAndGFnT3JhbmdlJ1wiXG4gICAgW2NsYXNzLmdyZWVuXT1cImNvbG9yID09PSAnZ3JlZW4nXCJcbiAgICBbY2xhc3MucmVkXT1cImNvbG9yID09PSAncmVkJ1wiXG4gICAgW2NsYXNzLmNsZWFyYWJsZV09XCJjbGVhcmFibGVcIlxuICAgIFtjbGFzcy5taW5pXT1cIm1pbmlcIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJhcC1zeW1ib2xcIiAvPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImFwLWF2YXRhclwiIC8+XG5cbiAgICA8c3BhbiAjY29udGVudFdyYXBwZXI+XG4gICAgICAgIDxuZy1jb250ZW50IC8+XG4gICAgPC9zcGFuPlxuXG4gICAgQGlmIChjbGVhcmFibGUpIHtcbiAgICAgICAgPCEtLSBGSVhNRSBpbXBsZW1lbnQgYXMgYSBkaXJlY3RpdmUgYW5kIGNvbWJpbmUgd2l0aCBhIGJ1dHRvbiB0YWcgdG8gaGF2ZSB0byBmdWxsIGFjY2VzcyB0byBhbGwgYXR0cmlidXRlcyAoYXJpYS1sYWJlbGxlZGJ5KSAtLT5cbiAgICAgICAgPGFwLWNsb3NlLWJ1dHRvblxuICAgICAgICAgICAgW2FyaWFMYWJlbF09XCInY2xlYXIgJyArIGNvbnRlbnRUZXh0KClcIlxuICAgICAgICAgICAgKGNsb3NlZCk9XCJvbkNsZWFyKCRldmVudClcIiAvPlxuICAgIH1cbjwvZGl2PlxuIl19
33
+ args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-tag', standalone: true, imports: [CloseButtonComponent, SymbolComponent], encapsulation: ViewEncapsulation.None, template: "<div\n [class.blue]=\"color() === 'blue'\"\n [class.menthol]=\"color() === 'menthol'\"\n [class.grey]=\"color() === 'grey'\"\n [class.tagOrange]=\"color() === 'tagOrange'\"\n [class.green]=\"color() === 'green'\"\n [class.red]=\"color() === 'red'\"\n [class.clearable]=\"clearable()\"\n [class.add]=\"add()\"\n [class.mini]=\"mini()\">\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"ap-avatar\" />\n\n <span #contentWrapper>\n <ng-content />\n </span>\n\n @if (clearable()) {\n <!-- FIXME implement as a directive and combine with a button tag to have to full access to all attributes (aria-labelledby) -->\n <ap-close-button\n [ariaLabel]=\"'clear ' + contentText()\"\n (closed)=\"onClear($event)\" />\n } @else if (add()) {\n <button \n class=\"add-button\"\n type=\"button\"\n aria-label=\"Add item\"\n (click)=\"onAdd($event)\">\n <ap-symbol size=\"xs\" symbolId=\"plus\" color=\"#344563\" />\n </button>\n }\n</div>\n", styles: ["ap-tag{--avatar-size: 16px;--button-size: 20px;display:inline-flex;vertical-align:middle}ap-tag>div{display:flex;align-items:center;justify-content:center;height:var(--comp-tag-height);max-height:var(--height);box-sizing:border-box;border-width:1px;border-style:solid;padding:0 var(--comp-tag-padding-right) 0 var(--comp-tag-padding-left);border-radius:var(--comp-tag-border-radius);gap:var(--ref-spacing-xxxs)}ap-tag>div.clearable,ap-tag>div.add{padding:0 calc(var(--comp-tag-closable-padding-right) - 1px) 0 var(--comp-tag-padding-left)}ap-tag>div.mini{height:var(--comp-tag-mini-height);padding:0 var(--comp-tag-mini-padding-right) 0 var(--comp-tag-mini-padding-left)}ap-tag>div span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--comp-tag-text-style-size);line-height:var(--comp-tag-text-style-line-height);font-weight:var(--comp-tag-text-style-font-weight);font-family:var(--comp-tag-text-style-font-family)}ap-tag>div ap-avatar{min-width:var(--avatar-size);width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);height:var(--avatar-size);max-height:var(--avatar-size)}ap-tag>div ap-avatar img{width:var(--avatar-size);height:var(--avatar-size)}ap-tag>div.blue{background-color:var(--comp-tag-blue-background-color);border-color:var(--comp-tag-blue-border-color);color:var(--comp-tag-blue-text-color)}ap-tag>div.grey{background-color:var(--comp-tag-grey-background-color);border-color:var(--comp-tag-grey-border-color);color:var(--comp-tag-grey-text-color)}ap-tag>div.tagOrange{background-color:var(--comp-tag-tag-orange-background-color);border-color:var(--comp-tag-tag-orange-border-color);color:var(--comp-tag-tag-orange-text-color)}ap-tag>div.menthol{background-color:var(--comp-tag-menthol-background-color);border-color:var(--comp-tag-menthol-border-color);color:var(--comp-tag-menthol-text-color)}ap-tag>div.green{background-color:var(--comp-tag-green-background-color);border-color:var(--comp-tag-green-border-color);color:var(--comp-tag-green-text-color)}ap-tag>div.red{background-color:var(--comp-tag-red-background-color);border-color:var(--comp-tag-red-border-color);color:var(--comp-tag-red-text-color)}ap-tag>div .add-button{margin:0;display:flex;justify-content:center;align-items:center;width:var(--comp-close-button-size);max-width:var(--comp-close-button-size);height:var(--comp-close-button-size);max-height:var(--comp-close-button-size);border-radius:50%;background:transparent;border:none;position:relative;transition:border .25s;padding:var(--comp-close-button-padding);outline:none;cursor:pointer}@media (hover: hover){ap-tag>div .add-button:focus:not(.disabled):not(:active){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-tag>div .add-button:hover{background:var(--comp-close-button-hover-background)}ap-tag>div .add-button:active{background:var(--comp-close-button-active-background);outline:none}ap-tag>div .add-button:focus:active{outline:none}\n"] }]
34
+ }], ctorParameters: () => [] });
35
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy90YWcvc3JjL3RhZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvdGFnL3NyYy90YWcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7QUFDOUUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUUsY0FBYyxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFFbEcsT0FBTyxFQUNILGdCQUFnQixFQUNoQix1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFFBQVEsRUFDUixVQUFVLEVBQ1YsTUFBTSxFQUNOLEtBQUssRUFDTCxNQUFNLEVBQ04sU0FBUyxFQUNULGlCQUFpQixHQUNwQixNQUFNLGVBQWUsQ0FBQzs7QUFhdkIsTUFBTSxPQUFPLFlBQVk7SUFDSixVQUFVLEdBQWUsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQzVDLGNBQWMsR0FBbUIsTUFBTSxDQUFDLGNBQWMsQ0FBQyxDQUFDO0lBRXpFO1FBQ0ksSUFBSSxDQUFDLGNBQWMsQ0FBQyxlQUFlLENBQUMsQ0FBQyxnQkFBZ0IsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDO0lBQ3BFLENBQUM7SUFFRCxTQUFTLEdBQUcsS0FBSyxDQUFDLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRSxDQUFDLENBQUM7SUFDMUQsR0FBRyxHQUFHLEtBQUssQ0FBQyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDO0lBQ3BELEtBQUssR0FBRyxLQUFLLENBQVcsTUFBTSxDQUFDLENBQUM7SUFDaEMsSUFBSSxHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUVwQixLQUFLLEdBQUcsTUFBTSxFQUF5QyxDQUFDO0lBQ3hELEtBQUssR0FBRyxNQUFNLEVBQXlELENBQUM7SUFFeEUsT0FBTyxHQUFHLFNBQVMsQ0FBQyxRQUFRLENBQWEsZ0JBQWdCLENBQUMsQ0FBQztJQUMzRCxXQUFXLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQyxhQUFhLENBQUMsU0FBUyxDQUFDLENBQUM7SUFFckUsT0FBTyxDQUFDLE1BQWlDO1FBQ3JDLE1BQU0sQ0FBQyx3QkFBd0IsRUFBRSxDQUFDO1FBQ2xDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQ3ZDLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEVBQUUsTUFBTSxFQUFFLENBQUMsQ0FBQztJQUNoQyxDQUFDO0lBRUQsS0FBSyxDQUFDLE1BQWE7UUFDZixNQUFNLENBQUMsd0JBQXdCLEVBQUUsQ0FBQztRQUNsQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxFQUFFLE1BQU0sRUFBRSxNQUFtRCxFQUFFLENBQUMsQ0FBQztJQUNyRixDQUFDO3VHQTVCUSxZQUFZOzJGQUFaLFlBQVkseXRCQzNCekIsMGtDQWdDQSw2OUZEVGMsb0JBQW9CLGdJQUFFLGVBQWU7OzJGQUl0QyxZQUFZO2tCQVR4QixTQUFTO3NDQUNXLHVCQUF1QixDQUFDLE1BQU0sWUFDckMsUUFBUSxjQUNOLElBQUksV0FFUCxDQUFDLG9CQUFvQixFQUFFLGVBQWUsQ0FBQyxpQkFFakMsaUJBQWlCLENBQUMsSUFBSSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENsb3NlQnV0dG9uQ29tcG9uZW50IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy9jbG9zZS1idXR0b24nO1xuaW1wb3J0IHsgYXBEZWxldGVOb0NpcmNsZSwgYXBQbHVzLCBTeW1ib2xDb21wb25lbnQsIFN5bWJvbFJlZ2lzdHJ5IH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktc3ltYm9sJztcblxuaW1wb3J0IHtcbiAgICBib29sZWFuQXR0cmlidXRlLFxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBjb21wdXRlZCxcbiAgICBFbGVtZW50UmVmLFxuICAgIGluamVjdCxcbiAgICBpbnB1dCxcbiAgICBvdXRwdXQsXG4gICAgdmlld0NoaWxkLFxuICAgIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZXhwb3J0IHR5cGUgVGFnQ29sb3IgPSAnYmx1ZScgfCAnZ3JleScgfCAnbWVudGhvbCcgfCAndGFnT3JhbmdlJyB8ICdyZWQnIHwgJ2dyZWVuJztcblxuQENvbXBvbmVudCh7XG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgc2VsZWN0b3I6ICdhcC10YWcnLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3RhZy5jb21wb25lbnQuaHRtbCcsXG4gICAgaW1wb3J0czogW0Nsb3NlQnV0dG9uQ29tcG9uZW50LCBTeW1ib2xDb21wb25lbnRdLFxuICAgIHN0eWxlVXJsczogWycuL3RhZy5jb21wb25lbnQuc2NzcyddLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIFRhZ0NvbXBvbmVudCB7XG4gICAgcHJpdmF0ZSByZWFkb25seSBlbGVtZW50UmVmOiBFbGVtZW50UmVmID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuICAgIHByaXZhdGUgcmVhZG9ubHkgc3ltYm9sUmVnaXN0cnk6IFN5bWJvbFJlZ2lzdHJ5ID0gaW5qZWN0KFN5bWJvbFJlZ2lzdHJ5KTtcblxuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgICAgICB0aGlzLnN5bWJvbFJlZ2lzdHJ5LnJlZ2lzdGVyU3ltYm9scyhbYXBEZWxldGVOb0NpcmNsZSwgYXBQbHVzXSk7XG4gICAgfVxuXG4gICAgY2xlYXJhYmxlID0gaW5wdXQoZmFsc2UsIHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pO1xuICAgIGFkZCA9IGlucHV0KGZhbHNlLCB7IHRyYW5zZm9ybTogYm9vbGVhbkF0dHJpYnV0ZSB9KTtcbiAgICBjb2xvciA9IGlucHV0PFRhZ0NvbG9yPignYmx1ZScpO1xuICAgIG1pbmkgPSBpbnB1dChmYWxzZSk7XG5cbiAgICBjbGVhciA9IG91dHB1dDx7ICRldmVudDogTW91c2VFdmVudCB8IFBvaW50ZXJFdmVudCB9PigpO1xuICAgIGFkZGVkID0gb3V0cHV0PHsgJGV2ZW50OiBNb3VzZUV2ZW50IHwgUG9pbnRlckV2ZW50IHwgS2V5Ym9hcmRFdmVudCB9PigpO1xuXG4gICAgY29udGVudCA9IHZpZXdDaGlsZC5yZXF1aXJlZDxFbGVtZW50UmVmPignY29udGVudFdyYXBwZXInKTtcbiAgICBjb250ZW50VGV4dCA9IGNvbXB1dGVkKCgpID0+IHRoaXMuY29udGVudCgpLm5hdGl2ZUVsZW1lbnQuaW5uZXJUZXh0KTtcblxuICAgIG9uQ2xlYXIoJGV2ZW50OiBNb3VzZUV2ZW50IHwgUG9pbnRlckV2ZW50KTogdm9pZCB7XG4gICAgICAgICRldmVudC5zdG9wSW1tZWRpYXRlUHJvcGFnYXRpb24oKTtcbiAgICAgICAgdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQucmVtb3ZlKCk7XG4gICAgICAgIHRoaXMuY2xlYXIuZW1pdCh7ICRldmVudCB9KTtcbiAgICB9XG5cbiAgICBvbkFkZCgkZXZlbnQ6IEV2ZW50KTogdm9pZCB7XG4gICAgICAgICRldmVudC5zdG9wSW1tZWRpYXRlUHJvcGFnYXRpb24oKTtcbiAgICAgICAgdGhpcy5hZGRlZC5lbWl0KHsgJGV2ZW50OiAkZXZlbnQgYXMgTW91c2VFdmVudCB8IFBvaW50ZXJFdmVudCB8IEtleWJvYXJkRXZlbnQgfSk7XG4gICAgfVxufVxuIiwiPGRpdlxuICAgIFtjbGFzcy5ibHVlXT1cImNvbG9yKCkgPT09ICdibHVlJ1wiXG4gICAgW2NsYXNzLm1lbnRob2xdPVwiY29sb3IoKSA9PT0gJ21lbnRob2wnXCJcbiAgICBbY2xhc3MuZ3JleV09XCJjb2xvcigpID09PSAnZ3JleSdcIlxuICAgIFtjbGFzcy50YWdPcmFuZ2VdPVwiY29sb3IoKSA9PT0gJ3RhZ09yYW5nZSdcIlxuICAgIFtjbGFzcy5ncmVlbl09XCJjb2xvcigpID09PSAnZ3JlZW4nXCJcbiAgICBbY2xhc3MucmVkXT1cImNvbG9yKCkgPT09ICdyZWQnXCJcbiAgICBbY2xhc3MuY2xlYXJhYmxlXT1cImNsZWFyYWJsZSgpXCJcbiAgICBbY2xhc3MuYWRkXT1cImFkZCgpXCJcbiAgICBbY2xhc3MubWluaV09XCJtaW5pKClcIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJhcC1zeW1ib2xcIiAvPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImFwLWF2YXRhclwiIC8+XG5cbiAgICA8c3BhbiAjY29udGVudFdyYXBwZXI+XG4gICAgICAgIDxuZy1jb250ZW50IC8+XG4gICAgPC9zcGFuPlxuXG4gICAgQGlmIChjbGVhcmFibGUoKSkge1xuICAgICAgICA8IS0tIEZJWE1FIGltcGxlbWVudCBhcyBhIGRpcmVjdGl2ZSBhbmQgY29tYmluZSB3aXRoIGEgYnV0dG9uIHRhZyB0byBoYXZlIHRvIGZ1bGwgYWNjZXNzIHRvIGFsbCBhdHRyaWJ1dGVzIChhcmlhLWxhYmVsbGVkYnkpIC0tPlxuICAgICAgICA8YXAtY2xvc2UtYnV0dG9uXG4gICAgICAgICAgICBbYXJpYUxhYmVsXT1cIidjbGVhciAnICsgY29udGVudFRleHQoKVwiXG4gICAgICAgICAgICAoY2xvc2VkKT1cIm9uQ2xlYXIoJGV2ZW50KVwiIC8+XG4gICAgfSBAZWxzZSBpZiAoYWRkKCkpIHtcbiAgICAgICAgPGJ1dHRvbiBcbiAgICAgICAgICAgIGNsYXNzPVwiYWRkLWJ1dHRvblwiXG4gICAgICAgICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJBZGQgaXRlbVwiXG4gICAgICAgICAgICAoY2xpY2spPVwib25BZGQoJGV2ZW50KVwiPlxuICAgICAgICAgICAgPGFwLXN5bWJvbCBzaXplPVwieHNcIiBzeW1ib2xJZD1cInBsdXNcIiBjb2xvcj1cIiMzNDQ1NjNcIiAvPlxuICAgICAgICA8L2J1dHRvbj5cbiAgICB9XG48L2Rpdj5cbiJdfQ==