@agorapulse/ui-components 20.0.1 → 20.1.1

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.
@@ -0,0 +1,19 @@
1
+ import { InjectionToken } from '@angular/core';
2
+
3
+ const UI_COMPONENTS_SYMBOLS = new InjectionToken('UI_COMPONENTS_SYMBOLS');
4
+ function provideUiComponentsSymbols(...symbols) {
5
+ return [
6
+ {
7
+ provide: UI_COMPONENTS_SYMBOLS,
8
+ multi: true,
9
+ useValue: symbols,
10
+ },
11
+ ];
12
+ }
13
+
14
+ /**
15
+ * Generated bundle index. Do not edit.
16
+ */
17
+
18
+ export { UI_COMPONENTS_SYMBOLS, provideUiComponentsSymbols };
19
+ //# sourceMappingURL=agorapulse-ui-components-providers.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"agorapulse-ui-components-providers.mjs","sources":["../../../libs/ui-components/providers/src/injection-tokens.ts","../../../libs/ui-components/providers/src/agorapulse-ui-components-providers.ts"],"sourcesContent":["import { AgorapulseSymbol } from '@agorapulse/ui-symbol';\nimport { InjectionToken } from '@angular/core';\n\nexport const UI_COMPONENTS_SYMBOLS = new InjectionToken<AgorapulseSymbol[]>('UI_COMPONENTS_SYMBOLS');\n\nexport function provideUiComponentsSymbols(...symbols: AgorapulseSymbol[]) {\n return [\n {\n provide: UI_COMPONENTS_SYMBOLS,\n multi: true,\n useValue: symbols,\n },\n ];\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;MAGa,qBAAqB,GAAG,IAAI,cAAc,CAAqB,uBAAuB;AAE7F,SAAU,0BAA0B,CAAC,GAAG,OAA2B,EAAA;IACrE,OAAO;AACH,QAAA;AACI,YAAA,OAAO,EAAE,qBAAqB;AAC9B,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,QAAQ,EAAE,OAAO;AACpB,SAAA;KACJ;AACL;;ACbA;;AAEG;;;;"}
@@ -75,6 +75,9 @@ class DropdownItemMultipleOneLineComponent {
75
75
  onlyText = 'Only';
76
76
  isFeatureLocked = input(false, ...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : []));
77
77
  roundedAvatar = input(true, ...(ngDevMode ? [{ debugName: "roundedAvatar" }] : []));
78
+ network = input(...(ngDevMode ? [undefined, { debugName: "network" }] : []));
79
+ symbolColor = input(...(ngDevMode ? [undefined, { debugName: "symbolColor" }] : []));
80
+ symbolTooltipText = input(...(ngDevMode ? [undefined, { debugName: "symbolTooltipText" }] : []));
78
81
  selectOnly = new EventEmitter();
79
82
  lockedFeatureClicked = output();
80
83
  checkbox;
@@ -89,11 +92,11 @@ class DropdownItemMultipleOneLineComponent {
89
92
  this.checkbox.focus();
90
93
  }
91
94
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DropdownItemMultipleOneLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
92
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DropdownItemMultipleOneLineComponent, isStandalone: true, selector: "ap-dropdown-item-multiple-one-line", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: true, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: false, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: false, isRequired: false, transformFunction: null }, disabledTooltip: { classPropertyName: "disabledTooltip", publicName: "disabledTooltip", isSignal: false, isRequired: false, transformFunction: null }, badgeText: { classPropertyName: "badgeText", publicName: "badgeText", isSignal: false, isRequired: false, transformFunction: null }, dividerEnabled: { classPropertyName: "dividerEnabled", publicName: "dividerEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyEnabled: { classPropertyName: "onlyEnabled", publicName: "onlyEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyText: { classPropertyName: "onlyText", publicName: "onlyText", isSignal: false, isRequired: false, transformFunction: null }, isFeatureLocked: { classPropertyName: "isFeatureLocked", publicName: "isFeatureLocked", isSignal: true, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectOnly: "selectOnly", lockedFeatureClicked: "lockedFeatureClicked" }, host: { listeners: { "click": "onClick($event)" } }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: CheckboxComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n #checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\" />\n }\n <span\n class=\"option-item\"\n [class.feature-locked-label]=\"isFeatureLocked()\"\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled && !isFeatureLocked()) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-one-line .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-one-line .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-one-line .option-item{width:100%}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "component", type: CheckboxComponent, selector: "ap-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "disabled", "indeterminate", "checked", "required", "name"], outputs: ["change"] }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }, { kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
95
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DropdownItemMultipleOneLineComponent, isStandalone: true, selector: "ap-dropdown-item-multiple-one-line", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: true, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: false, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: false, isRequired: false, transformFunction: null }, disabledTooltip: { classPropertyName: "disabledTooltip", publicName: "disabledTooltip", isSignal: false, isRequired: false, transformFunction: null }, badgeText: { classPropertyName: "badgeText", publicName: "badgeText", isSignal: false, isRequired: false, transformFunction: null }, dividerEnabled: { classPropertyName: "dividerEnabled", publicName: "dividerEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyEnabled: { classPropertyName: "onlyEnabled", publicName: "onlyEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyText: { classPropertyName: "onlyText", publicName: "onlyText", isSignal: false, isRequired: false, transformFunction: null }, isFeatureLocked: { classPropertyName: "isFeatureLocked", publicName: "isFeatureLocked", isSignal: true, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null }, network: { classPropertyName: "network", publicName: "network", isSignal: true, isRequired: false, transformFunction: null }, symbolColor: { classPropertyName: "symbolColor", publicName: "symbolColor", isSignal: true, isRequired: false, transformFunction: null }, symbolTooltipText: { classPropertyName: "symbolTooltipText", publicName: "symbolTooltipText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectOnly: "selectOnly", lockedFeatureClicked: "lockedFeatureClicked" }, host: { listeners: { "click": "onClick($event)" } }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: CheckboxComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n #checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\"\n [network]=\"network()\"/>\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\"\n [color]=\"symbolColor() ?? ''\"\n [apTooltip]=\"symbolTooltipText() ? symbolTooltipText() : undefined\" />\n }\n <span\n class=\"option-item\"\n [class.feature-locked-label]=\"isFeatureLocked()\"\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled && !isFeatureLocked()) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-one-line .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-one-line .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-one-line .option-item{width:100%}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "component", type: CheckboxComponent, selector: "ap-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "disabled", "indeterminate", "checked", "required", "name"], outputs: ["change"] }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }, { kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
93
96
  }
94
97
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DropdownItemMultipleOneLineComponent, decorators: [{
95
98
  type: Component,
96
- args: [{ selector: 'ap-dropdown-item-multiple-one-line', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, CheckboxComponent, AvatarComponent, BadgeComponent, TooltipDirective, SymbolComponent, SymbolComponent], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n #checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\" />\n }\n <span\n class=\"option-item\"\n [class.feature-locked-label]=\"isFeatureLocked()\"\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled && !isFeatureLocked()) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-one-line .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-one-line .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-one-line .option-item{width:100%}\n"] }]
99
+ args: [{ selector: 'ap-dropdown-item-multiple-one-line', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, CheckboxComponent, AvatarComponent, BadgeComponent, TooltipDirective, SymbolComponent, SymbolComponent], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n #checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\"\n [network]=\"network()\"/>\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\"\n [color]=\"symbolColor() ?? ''\"\n [apTooltip]=\"symbolTooltipText() ? symbolTooltipText() : undefined\" />\n }\n <span\n class=\"option-item\"\n [class.feature-locked-label]=\"isFeatureLocked()\"\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled && !isFeatureLocked()) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-one-line .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-one-line .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-one-line .option-item{width:100%}\n"] }]
97
100
  }], propDecorators: { text: [{
98
101
  type: Input,
99
102
  args: [{ required: true }]
@@ -144,6 +147,9 @@ class DropdownItemMultipleTwoLinesComponent {
144
147
  onlyText = 'Only';
145
148
  isFeatureLocked = input(false, ...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : []));
146
149
  roundedAvatar = input(true, ...(ngDevMode ? [{ debugName: "roundedAvatar" }] : []));
150
+ network = input(...(ngDevMode ? [undefined, { debugName: "network" }] : []));
151
+ symbolColor = input(...(ngDevMode ? [undefined, { debugName: "symbolColor" }] : []));
152
+ symbolTooltipText = input(...(ngDevMode ? [undefined, { debugName: "symbolTooltipText" }] : []));
147
153
  selectOnly = new EventEmitter();
148
154
  lockedFeatureClicked = output();
149
155
  checkbox;
@@ -158,11 +164,11 @@ class DropdownItemMultipleTwoLinesComponent {
158
164
  this.checkbox.focus();
159
165
  }
160
166
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DropdownItemMultipleTwoLinesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
161
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DropdownItemMultipleTwoLinesComponent, isStandalone: true, selector: "ap-dropdown-item-multiple-two-lines", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: true, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: false, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: true, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: false, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: false, isRequired: false, transformFunction: null }, disabledTooltip: { classPropertyName: "disabledTooltip", publicName: "disabledTooltip", isSignal: false, isRequired: false, transformFunction: null }, badgeText: { classPropertyName: "badgeText", publicName: "badgeText", isSignal: false, isRequired: false, transformFunction: null }, dividerEnabled: { classPropertyName: "dividerEnabled", publicName: "dividerEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyEnabled: { classPropertyName: "onlyEnabled", publicName: "onlyEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyText: { classPropertyName: "onlyText", publicName: "onlyText", isSignal: false, isRequired: false, transformFunction: null }, isFeatureLocked: { classPropertyName: "isFeatureLocked", publicName: "isFeatureLocked", isSignal: true, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectOnly: "selectOnly", lockedFeatureClicked: "lockedFeatureClicked" }, host: { listeners: { "click": "onClick($event)" } }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: CheckboxComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple with-caption\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\" />\n }\n <div class=\"texts\" [class.feature-locked-label]=\"isFeatureLocked()\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n </div>\n <span\n class=\"caption\"\n [title]=\"caption\">\n {{ caption }}\n </span>\n </div>\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-two-lines .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-two-lines .option .texts{flex:1;overflow:auto;display:flex;flex-direction:column}ap-dropdown-item-multiple-two-lines .option .texts .first-line{display:flex;align-items:center;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option .texts .first-line .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "component", type: CheckboxComponent, selector: "ap-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "disabled", "indeterminate", "checked", "required", "name"], outputs: ["change"] }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }, { kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
167
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DropdownItemMultipleTwoLinesComponent, isStandalone: true, selector: "ap-dropdown-item-multiple-two-lines", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: true, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: false, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: true, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: false, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: false, isRequired: false, transformFunction: null }, disabledTooltip: { classPropertyName: "disabledTooltip", publicName: "disabledTooltip", isSignal: false, isRequired: false, transformFunction: null }, badgeText: { classPropertyName: "badgeText", publicName: "badgeText", isSignal: false, isRequired: false, transformFunction: null }, dividerEnabled: { classPropertyName: "dividerEnabled", publicName: "dividerEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyEnabled: { classPropertyName: "onlyEnabled", publicName: "onlyEnabled", isSignal: false, isRequired: false, transformFunction: null }, onlyText: { classPropertyName: "onlyText", publicName: "onlyText", isSignal: false, isRequired: false, transformFunction: null }, isFeatureLocked: { classPropertyName: "isFeatureLocked", publicName: "isFeatureLocked", isSignal: true, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null }, network: { classPropertyName: "network", publicName: "network", isSignal: true, isRequired: false, transformFunction: null }, symbolColor: { classPropertyName: "symbolColor", publicName: "symbolColor", isSignal: true, isRequired: false, transformFunction: null }, symbolTooltipText: { classPropertyName: "symbolTooltipText", publicName: "symbolTooltipText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectOnly: "selectOnly", lockedFeatureClicked: "lockedFeatureClicked" }, host: { listeners: { "click": "onClick($event)" } }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: CheckboxComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple with-caption\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\"\n [network]=\"network()\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\"\n [color]=\"symbolColor() ?? ''\"\n [apTooltip]=\"symbolTooltipText() ? symbolTooltipText() : undefined\" />\n }\n <div class=\"texts\" [class.feature-locked-label]=\"isFeatureLocked()\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n </div>\n <span\n class=\"caption\"\n [title]=\"caption\">\n {{ caption }}\n </span>\n </div>\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-two-lines .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-two-lines .option .texts{flex:1;overflow:auto;display:flex;flex-direction:column}ap-dropdown-item-multiple-two-lines .option .texts .first-line{display:flex;align-items:center;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option .texts .first-line .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "component", type: CheckboxComponent, selector: "ap-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "disabled", "indeterminate", "checked", "required", "name"], outputs: ["change"] }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }, { kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
162
168
  }
163
169
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DropdownItemMultipleTwoLinesComponent, decorators: [{
164
170
  type: Component,
165
- args: [{ selector: 'ap-dropdown-item-multiple-two-lines', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, CheckboxComponent, AvatarComponent, BadgeComponent, TooltipDirective], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple with-caption\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\" />\n }\n <div class=\"texts\" [class.feature-locked-label]=\"isFeatureLocked()\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n </div>\n <span\n class=\"caption\"\n [title]=\"caption\">\n {{ caption }}\n </span>\n </div>\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-two-lines .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-two-lines .option .texts{flex:1;overflow:auto;display:flex;flex-direction:column}ap-dropdown-item-multiple-two-lines .option .texts .first-line{display:flex;align-items:center;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option .texts .first-line .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"] }]
171
+ args: [{ selector: 'ap-dropdown-item-multiple-two-lines', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, CheckboxComponent, AvatarComponent, BadgeComponent, TooltipDirective], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option multiple with-caption\" [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n [checked]=\"selected\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"true\"\n [network]=\"network()\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\"\n [color]=\"symbolColor() ?? ''\"\n [apTooltip]=\"symbolTooltipText() ? symbolTooltipText() : undefined\" />\n }\n <div class=\"texts\" [class.feature-locked-label]=\"isFeatureLocked()\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n </div>\n <span\n class=\"caption\"\n [title]=\"caption\">\n {{ caption }}\n </span>\n </div>\n\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n }\n\n @if (onlyEnabled && !disabled) {\n <button\n class=\"standalone-link\"\n type=\"button\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); onSelectOnly()\">\n {{ onlyText }}\n </button>\n }\n </ap-checkbox>\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-multiple-two-lines .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option ap-checkbox label{display:flex;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-two-lines .option .texts{flex:1;overflow:auto;display:flex;flex-direction:column}ap-dropdown-item-multiple-two-lines .option .texts .first-line{display:flex;align-items:center;gap:var(--ref-spacing-xxs)}ap-dropdown-item-multiple-two-lines .option .texts .first-line .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"] }]
166
172
  }], propDecorators: { text: [{
167
173
  type: Input,
168
174
  args: [{ required: true }]
@@ -405,6 +411,7 @@ class SelectLabelMultipleComponent {
405
411
  bindAvatarUrl = input('', ...(ngDevMode ? [{ debugName: "bindAvatarUrl" }] : []));
406
412
  bindSymbolId = input('', ...(ngDevMode ? [{ debugName: "bindSymbolId" }] : []));
407
413
  roundedAvatar = input(true, ...(ngDevMode ? [{ debugName: "roundedAvatar" }] : []));
414
+ bindNetwork = input('', ...(ngDevMode ? [{ debugName: "bindNetwork" }] : []));
408
415
  removeItem = output();
409
416
  elementRef = inject(ElementRef);
410
417
  injector = inject(EnvironmentInjector);
@@ -434,6 +441,7 @@ class SelectLabelMultipleComponent {
434
441
  avatarUrl: this.bindAvatarUrl() ? item[this.bindAvatarUrl()] : '',
435
442
  symbolId: this.bindSymbolId() ? item[this.bindSymbolId()] : null,
436
443
  value: item,
444
+ network: this.bindNetwork() ? item[this.bindNetwork()] : undefined,
437
445
  };
438
446
  }), ...(ngDevMode ? [{ debugName: "selectedLabels" }] : []));
439
447
  valueContainerWidth = signal(0, ...(ngDevMode ? [{ debugName: "valueContainerWidth" }] : []));
@@ -479,11 +487,11 @@ class SelectLabelMultipleComponent {
479
487
  this.hiddenCount.set(hiddenCount);
480
488
  }
481
489
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: SelectLabelMultipleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
482
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: SelectLabelMultipleComponent, isStandalone: true, selector: "ap-select-label-multiple", inputs: { displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: true, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, bindAvatarUrl: { classPropertyName: "bindAvatarUrl", publicName: "bindAvatarUrl", isSignal: true, isRequired: false, transformFunction: null }, bindSymbolId: { classPropertyName: "bindSymbolId", publicName: "bindSymbolId", isSignal: true, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removeItem: "removeItem" }, ngImport: i0, template: "<div class=\"multiple-item\">\n @for (item of selectedLabels(); track trackByItem($index, item)) {\n @if (displayType() === 'label') {\n <ap-label\n class=\"item\"\n color=\"blue\"\n removable=\"true\"\n [content]=\"item.label\"\n (remove)=\"removeItem.emit(item.value)\" />\n }\n\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"item text-item\"\n clearable=\"true\"\n color=\"grey\"\n (clear)=\"removeItem.emit(item.value)\">\n @if (item.avatarUrl) {\n <ap-avatar\n [size]=\"16\"\n [rounded]=\"roundedAvatar()\"\n [profilePicture]=\"item.avatarUrl\"\n [username]=\"item.label\"\n [showInitials]=\"true\" />\n } @else if (item.symbolId) {\n <ap-symbol\n size=\"sm\"\n [attr.symbol-id]=\"item.symbolId\"\n [symbolId]=\"item.symbolId\" />\n }\n {{ item.label }}\n </ap-tag>\n }\n }\n</div>\n\n@if (hiddenCount() > 0) {\n <div class=\"remaining\">\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"text-item\"\n color=\"grey\"\n clearable=\"false\">\n +{{ hiddenCount() }}\n </ap-tag>\n }\n @if (displayType() === 'label') {\n <ap-label\n color=\"blue\"\n removable=\"false\"\n [content]=\"'+' + hiddenCount()\" />\n }\n </div>\n}\n", styles: ["ap-select-label-multiple{display:flex}\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"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
490
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: SelectLabelMultipleComponent, isStandalone: true, selector: "ap-select-label-multiple", inputs: { displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: true, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, bindAvatarUrl: { classPropertyName: "bindAvatarUrl", publicName: "bindAvatarUrl", isSignal: true, isRequired: false, transformFunction: null }, bindSymbolId: { classPropertyName: "bindSymbolId", publicName: "bindSymbolId", isSignal: true, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null }, bindNetwork: { classPropertyName: "bindNetwork", publicName: "bindNetwork", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removeItem: "removeItem" }, ngImport: i0, template: "<div class=\"multiple-item\">\n @for (item of selectedLabels(); track trackByItem($index, item)) {\n @if (displayType() === 'label') {\n <ap-label\n class=\"item\"\n color=\"blue\"\n removable=\"true\"\n [content]=\"item.label\"\n (remove)=\"removeItem.emit(item.value)\" />\n }\n\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"item text-item\"\n clearable=\"true\"\n color=\"grey\"\n (clear)=\"removeItem.emit(item.value)\">\n @if (item.avatarUrl) {\n <ap-avatar\n [size]=\"16\"\n [rounded]=\"roundedAvatar()\"\n [profilePicture]=\"item.avatarUrl\"\n [username]=\"item.label\"\n [showInitials]=\"true\"\n [network]=\"item.network\"/>\n } @else if (item.symbolId) {\n <ap-symbol\n size=\"sm\"\n [attr.symbol-id]=\"item.symbolId\"\n [symbolId]=\"item.symbolId\" />\n }\n {{ item.label }}\n </ap-tag>\n }\n }\n</div>\n\n@if (hiddenCount() > 0) {\n <div class=\"remaining\">\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"text-item\"\n color=\"grey\"\n clearable=\"false\">\n +{{ hiddenCount() }}\n </ap-tag>\n }\n @if (displayType() === 'label') {\n <ap-label\n color=\"blue\"\n removable=\"false\"\n [content]=\"'+' + hiddenCount()\" />\n }\n </div>\n}\n", styles: ["ap-select-label-multiple{display:flex}\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"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
483
491
  }
484
492
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: SelectLabelMultipleComponent, decorators: [{
485
493
  type: Component,
486
- args: [{ selector: 'ap-select-label-multiple', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LabelComponent, TagComponent, AvatarComponent, SymbolComponent], template: "<div class=\"multiple-item\">\n @for (item of selectedLabels(); track trackByItem($index, item)) {\n @if (displayType() === 'label') {\n <ap-label\n class=\"item\"\n color=\"blue\"\n removable=\"true\"\n [content]=\"item.label\"\n (remove)=\"removeItem.emit(item.value)\" />\n }\n\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"item text-item\"\n clearable=\"true\"\n color=\"grey\"\n (clear)=\"removeItem.emit(item.value)\">\n @if (item.avatarUrl) {\n <ap-avatar\n [size]=\"16\"\n [rounded]=\"roundedAvatar()\"\n [profilePicture]=\"item.avatarUrl\"\n [username]=\"item.label\"\n [showInitials]=\"true\" />\n } @else if (item.symbolId) {\n <ap-symbol\n size=\"sm\"\n [attr.symbol-id]=\"item.symbolId\"\n [symbolId]=\"item.symbolId\" />\n }\n {{ item.label }}\n </ap-tag>\n }\n }\n</div>\n\n@if (hiddenCount() > 0) {\n <div class=\"remaining\">\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"text-item\"\n color=\"grey\"\n clearable=\"false\">\n +{{ hiddenCount() }}\n </ap-tag>\n }\n @if (displayType() === 'label') {\n <ap-label\n color=\"blue\"\n removable=\"false\"\n [content]=\"'+' + hiddenCount()\" />\n }\n </div>\n}\n", styles: ["ap-select-label-multiple{display:flex}\n"] }]
494
+ args: [{ selector: 'ap-select-label-multiple', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LabelComponent, TagComponent, AvatarComponent, SymbolComponent], template: "<div class=\"multiple-item\">\n @for (item of selectedLabels(); track trackByItem($index, item)) {\n @if (displayType() === 'label') {\n <ap-label\n class=\"item\"\n color=\"blue\"\n removable=\"true\"\n [content]=\"item.label\"\n (remove)=\"removeItem.emit(item.value)\" />\n }\n\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"item text-item\"\n clearable=\"true\"\n color=\"grey\"\n (clear)=\"removeItem.emit(item.value)\">\n @if (item.avatarUrl) {\n <ap-avatar\n [size]=\"16\"\n [rounded]=\"roundedAvatar()\"\n [profilePicture]=\"item.avatarUrl\"\n [username]=\"item.label\"\n [showInitials]=\"true\"\n [network]=\"item.network\"/>\n } @else if (item.symbolId) {\n <ap-symbol\n size=\"sm\"\n [attr.symbol-id]=\"item.symbolId\"\n [symbolId]=\"item.symbolId\" />\n }\n {{ item.label }}\n </ap-tag>\n }\n }\n</div>\n\n@if (hiddenCount() > 0) {\n <div class=\"remaining\">\n @if (displayType() === 'tag') {\n <ap-tag\n class=\"text-item\"\n color=\"grey\"\n clearable=\"false\">\n +{{ hiddenCount() }}\n </ap-tag>\n }\n @if (displayType() === 'label') {\n <ap-label\n color=\"blue\"\n removable=\"false\"\n [content]=\"'+' + hiddenCount()\" />\n }\n </div>\n}\n", styles: ["ap-select-label-multiple{display:flex}\n"] }]
487
495
  }] });
488
496
 
489
497
  class SelectLabelSingleComponent {