@agorapulse/ui-components 21.1.16 → 22.0.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.
- package/agorapulse-ui-components-22.0.1.tgz +0 -0
- package/fesm2022/agorapulse-ui-components-action-dropdown.mjs +26 -16
- package/fesm2022/agorapulse-ui-components-action-dropdown.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-add-comment.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-add-comment.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-autocomplete.mjs +11 -7
- package/fesm2022/agorapulse-ui-components-autocomplete.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-avatar-group.mjs +17 -10
- package/fesm2022/agorapulse-ui-components-avatar-group.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-avatar.mjs +33 -18
- package/fesm2022/agorapulse-ui-components-avatar.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-badge.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-badge.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-button.mjs +17 -10
- package/fesm2022/agorapulse-ui-components-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-checkbox.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-checkbox.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-close-button.mjs +9 -6
- package/fesm2022/agorapulse-ui-components-close-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-confirm-modal.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-confirm-modal.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-counter.mjs +11 -7
- package/fesm2022/agorapulse-ui-components-counter.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-datepicker.mjs +106 -53
- package/fesm2022/agorapulse-ui-components-datepicker.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-directives.mjs +28 -26
- package/fesm2022/agorapulse-ui-components-directives.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-dot-stepper.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-dot-stepper.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-dropdown-base.mjs +7 -5
- package/fesm2022/agorapulse-ui-components-dropdown-base.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-filter-chips-list.mjs +28 -17
- package/fesm2022/agorapulse-ui-components-filter-chips-list.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-filter-dropdown.mjs +174 -99
- package/fesm2022/agorapulse-ui-components-filter-dropdown.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-form-field.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-form-field.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-form-message.mjs +7 -5
- package/fesm2022/agorapulse-ui-components-form-message.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-icon-button.mjs +5 -4
- package/fesm2022/agorapulse-ui-components-icon-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-infobox.mjs +5 -4
- package/fesm2022/agorapulse-ui-components-infobox.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-input-group.mjs +6 -6
- package/fesm2022/agorapulse-ui-components-input-group.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-input-search.mjs +16 -10
- package/fesm2022/agorapulse-ui-components-input-search.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-input.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-labels-selector.mjs +7 -5
- package/fesm2022/agorapulse-ui-components-labels-selector.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-labels.mjs +6 -6
- package/fesm2022/agorapulse-ui-components-labels.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-legacy-input.mjs +6 -5
- package/fesm2022/agorapulse-ui-components-legacy-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-legacy-select.mjs +33 -17
- package/fesm2022/agorapulse-ui-components-legacy-select.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-legacy-textarea.mjs +6 -5
- package/fesm2022/agorapulse-ui-components-legacy-textarea.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-media-display-overlay.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-media-display-overlay.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-modal.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-modal.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-nav-selector.mjs +241 -146
- package/fesm2022/agorapulse-ui-components-nav-selector.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-neo-datepicker.mjs +6 -6
- package/fesm2022/agorapulse-ui-components-neo-datepicker.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-notification.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-notification.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-paginator.mjs +6 -6
- package/fesm2022/agorapulse-ui-components-paginator.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-password-input.mjs +7 -5
- package/fesm2022/agorapulse-ui-components-password-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-phone-number-input.mjs +8 -6
- package/fesm2022/agorapulse-ui-components-phone-number-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-popmenu.mjs +19 -16
- package/fesm2022/agorapulse-ui-components-popmenu.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-radio-button-card.mjs +47 -25
- package/fesm2022/agorapulse-ui-components-radio-button-card.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-radio.mjs +6 -6
- package/fesm2022/agorapulse-ui-components-radio.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-range-slider.mjs +8 -6
- package/fesm2022/agorapulse-ui-components-range-slider.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-segmented-control.mjs +15 -9
- package/fesm2022/agorapulse-ui-components-segmented-control.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-select.mjs +129 -85
- package/fesm2022/agorapulse-ui-components-select.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-selection-dropdown.mjs +60 -33
- package/fesm2022/agorapulse-ui-components-selection-dropdown.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-slide-toggle.mjs +8 -6
- package/fesm2022/agorapulse-ui-components-slide-toggle.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-snackbars-thread.mjs +10 -8
- package/fesm2022/agorapulse-ui-components-snackbars-thread.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-social-button.mjs +7 -5
- package/fesm2022/agorapulse-ui-components-social-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-split-button.mjs +21 -12
- package/fesm2022/agorapulse-ui-components-split-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-status-card.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-status-card.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-status.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-status.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-stepper.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-stepper.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-tabs.mjs +36 -21
- package/fesm2022/agorapulse-ui-components-tabs.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-tag.mjs +9 -6
- package/fesm2022/agorapulse-ui-components-tag.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-text-measurement.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-text-measurement.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-textarea.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-textarea.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-toggle.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-toggle.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-tooltip.mjs +56 -34
- package/fesm2022/agorapulse-ui-components-tooltip.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components.mjs +4 -4
- package/fesm2022/agorapulse-ui-components.mjs.map +1 -1
- package/package.json +11 -11
- package/types/agorapulse-ui-components-datepicker.d.ts +5 -1
- package/types/agorapulse-ui-components-filter-dropdown.d.ts +1 -1
- package/types/agorapulse-ui-components-password-input.d.ts +1 -0
- package/types/agorapulse-ui-components-phone-number-input.d.ts +1 -0
- package/types/agorapulse-ui-components-popmenu.d.ts +3 -3
- package/types/agorapulse-ui-components-range-slider.d.ts +1 -0
- package/types/agorapulse-ui-components-select.d.ts +5 -3
- package/types/agorapulse-ui-components-slide-toggle.d.ts +1 -0
- package/agorapulse-ui-components-21.1.16.tgz +0 -0
|
@@ -17,8 +17,10 @@ import { TagComponent } from '@agorapulse/ui-components/tag';
|
|
|
17
17
|
|
|
18
18
|
class DropdownCreateNewComponent {
|
|
19
19
|
symbolRegistry = inject(SymbolRegistry);
|
|
20
|
-
text = input('',
|
|
21
|
-
|
|
20
|
+
text = input('', /* @ts-ignore */
|
|
21
|
+
...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
22
|
+
searchTerm = input(/* @ts-ignore */
|
|
23
|
+
...(ngDevMode ? [undefined, { debugName: "searchTerm" }] : /* istanbul ignore next */ []));
|
|
22
24
|
createNew = output();
|
|
23
25
|
constructor() {
|
|
24
26
|
this.symbolRegistry.registerSymbols([apPlus]);
|
|
@@ -26,10 +28,10 @@ class DropdownCreateNewComponent {
|
|
|
26
28
|
onClick() {
|
|
27
29
|
this.createNew.emit(this.searchTerm() ?? '');
|
|
28
30
|
}
|
|
29
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
30
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
31
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownCreateNewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropdownCreateNewComponent, isStandalone: true, selector: "ap-dropdown-create-new", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, searchTerm: { classPropertyName: "searchTerm", publicName: "searchTerm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { createNew: "createNew" }, ngImport: i0, template: "<button\n class=\"create-new\"\n type=\"button\"\n (click)=\"onClick()\">\n <ap-symbol\n symbolId=\"plus\"\n size=\"sm\" />\n <span>\n {{ text() }}\n @if (searchTerm()) {\n {{ '"' + searchTerm() + '"' }}\n }\n </span>\n</button>\n", styles: ["ap-dropdown-create-new .create-new{display:flex;align-items:center;border:none;width:100%;background-color:transparent;gap:var(--ref-spacing-xxxs);color:var(--ref-color-electric-blue-150);font-weight:var(--ref-font-weight-bold);font-family:var(--ref-font-family);cursor:pointer;padding:var(--comp-select-search-bar-bottom-link-margin-top) var(--comp-select-search-bar-bottom-link-padding-horizontal) var(--comp-select-search-bar-bottom-link-padding-bottom) var(--comp-select-search-bar-bottom-link-padding-horizontal);line-height:var(--ref-font-line-height-sm);font-size:var(--ref-font-size-sm)}ap-dropdown-create-new .create-new:hover{color:var(--ref-color-electric-blue-100)}ap-dropdown-create-new .create-new:active{color:var(--ref-color-electric-blue-150)}ap-dropdown-create-new .create-new span{text-align:left}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
31
33
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownCreateNewComponent, decorators: [{
|
|
33
35
|
type: Component,
|
|
34
36
|
args: [{ selector: 'ap-dropdown-create-new', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent], template: "<button\n class=\"create-new\"\n type=\"button\"\n (click)=\"onClick()\">\n <ap-symbol\n symbolId=\"plus\"\n size=\"sm\" />\n <span>\n {{ text() }}\n @if (searchTerm()) {\n {{ '"' + searchTerm() + '"' }}\n }\n </span>\n</button>\n", styles: ["ap-dropdown-create-new .create-new{display:flex;align-items:center;border:none;width:100%;background-color:transparent;gap:var(--ref-spacing-xxxs);color:var(--ref-color-electric-blue-150);font-weight:var(--ref-font-weight-bold);font-family:var(--ref-font-family);cursor:pointer;padding:var(--comp-select-search-bar-bottom-link-margin-top) var(--comp-select-search-bar-bottom-link-padding-horizontal) var(--comp-select-search-bar-bottom-link-padding-bottom) var(--comp-select-search-bar-bottom-link-padding-horizontal);line-height:var(--ref-font-line-height-sm);font-size:var(--ref-font-size-sm)}ap-dropdown-create-new .create-new:hover{color:var(--ref-color-electric-blue-100)}ap-dropdown-create-new .create-new:active{color:var(--ref-color-electric-blue-150)}ap-dropdown-create-new .create-new span{text-align:left}\n"] }]
|
|
35
37
|
}], ctorParameters: () => [], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], searchTerm: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchTerm", required: false }] }], createNew: [{ type: i0.Output, args: ["createNew"] }] } });
|
|
@@ -75,12 +77,12 @@ class DropdownGroupItemComponent {
|
|
|
75
77
|
}
|
|
76
78
|
}
|
|
77
79
|
}
|
|
78
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
79
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
80
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownGroupItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
81
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropdownGroupItemComponent, isStandalone: true, selector: "ap-dropdown-group-item", inputs: { groupLabel: "groupLabel", groupTag: "groupTag", selectableGroup: "selectableGroup", children: "children", select: "select", disabled: "disabled", disabledTooltip: "disabledTooltip" }, ngImport: i0, template: "<div\n class=\"group\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"\n (click)=\"onGroupClick($event)\">\n @if (selectableGroup) {\n <ap-checkbox\n [name]=\"'option-group-selection-' + groupLabel\"\n [disabled]=\"isGroupDisabled() || disabled\"\n [indeterminate]=\"isGroupIntermediate()\"\n [checked]=\"isGroupChecked()\">\n <span class=\"group-label\">\n {{ groupLabel }}\n </span>\n @if (groupTag) {\n <ap-badge color=\"blue\">\n {{ groupTag }}\n </ap-badge>\n }\n </ap-checkbox>\n } @else {\n <span\n class=\"group-label\"\n [title]=\"groupLabel\">\n {{ groupLabel }}\n </span>\n @if (groupTag) {\n <ap-badge color=\"blue\">\n {{ groupTag }}\n </ap-badge>\n }\n }\n</div>\n", styles: ["ap-dropdown-group-item{display:block;width:100%}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "component", type: CheckboxComponent, selector: "ap-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "disabled", "indeterminate", "checked", "required", "name"], outputs: ["change"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems", "apTooltipShowAvatarCaption"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
80
82
|
}
|
|
81
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
83
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownGroupItemComponent, decorators: [{
|
|
82
84
|
type: Component,
|
|
83
|
-
args: [{ selector: 'ap-dropdown-group-item', encapsulation: ViewEncapsulation.None, imports: [BadgeComponent, CheckboxComponent, TooltipDirective], template: "<div\n class=\"group\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"\n (click)=\"onGroupClick($event)\">\n @if (selectableGroup) {\n <ap-checkbox\n [name]=\"'option-group-selection-' + groupLabel\"\n [disabled]=\"isGroupDisabled() || disabled\"\n [indeterminate]=\"isGroupIntermediate()\"\n [checked]=\"isGroupChecked()\">\n <span class=\"group-label\">\n {{ groupLabel }}\n </span>\n @if (groupTag) {\n <ap-badge color=\"blue\">\n {{ groupTag }}\n </ap-badge>\n }\n </ap-checkbox>\n } @else {\n <span\n class=\"group-label\"\n [title]=\"groupLabel\">\n {{ groupLabel }}\n </span>\n @if (groupTag) {\n <ap-badge color=\"blue\">\n {{ groupTag }}\n </ap-badge>\n }\n }\n</div>\n", styles: ["ap-dropdown-group-item{display:block;width:100%}\n"] }]
|
|
85
|
+
args: [{ selector: 'ap-dropdown-group-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [BadgeComponent, CheckboxComponent, TooltipDirective], template: "<div\n class=\"group\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"\n (click)=\"onGroupClick($event)\">\n @if (selectableGroup) {\n <ap-checkbox\n [name]=\"'option-group-selection-' + groupLabel\"\n [disabled]=\"isGroupDisabled() || disabled\"\n [indeterminate]=\"isGroupIntermediate()\"\n [checked]=\"isGroupChecked()\">\n <span class=\"group-label\">\n {{ groupLabel }}\n </span>\n @if (groupTag) {\n <ap-badge color=\"blue\">\n {{ groupTag }}\n </ap-badge>\n }\n </ap-checkbox>\n } @else {\n <span\n class=\"group-label\"\n [title]=\"groupLabel\">\n {{ groupLabel }}\n </span>\n @if (groupTag) {\n <ap-badge color=\"blue\">\n {{ groupTag }}\n </ap-badge>\n }\n }\n</div>\n", styles: ["ap-dropdown-group-item{display:block;width:100%}\n"] }]
|
|
84
86
|
}], propDecorators: { groupLabel: [{
|
|
85
87
|
type: Input,
|
|
86
88
|
args: [{ required: true }]
|
|
@@ -103,8 +105,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
103
105
|
}] } });
|
|
104
106
|
|
|
105
107
|
class SelectBaseDirective {
|
|
106
|
-
inlineLabel = input(
|
|
107
|
-
|
|
108
|
+
inlineLabel = input(/* @ts-ignore */
|
|
109
|
+
...(ngDevMode ? [undefined, { debugName: "inlineLabel" }] : /* istanbul ignore next */ []));
|
|
110
|
+
symbolId = input(/* @ts-ignore */
|
|
111
|
+
...(ngDevMode ? [undefined, { debugName: "symbolId" }] : /* istanbul ignore next */ []));
|
|
112
|
+
/** Show ng-select's native clear (X) inside the input when a value is selected. Off by default. */
|
|
113
|
+
clearable = input(false, /* @ts-ignore */
|
|
114
|
+
...(ngDevMode ? [{ debugName: "clearable" }] : /* istanbul ignore next */ []));
|
|
108
115
|
selectComponent = inject(NgSelectComponent);
|
|
109
116
|
el = inject(ElementRef);
|
|
110
117
|
renderer = inject(Renderer2);
|
|
@@ -115,12 +122,13 @@ class SelectBaseDirective {
|
|
|
115
122
|
constructor() {
|
|
116
123
|
this.selectComponent.appendTo.set('body');
|
|
117
124
|
this.selectComponent.searchable.set(false);
|
|
118
|
-
this.selectComponent.clearable.set(false);
|
|
119
125
|
this.selectComponent.markFirst.set(false);
|
|
120
126
|
this.selectComponent.selectableGroupAsModel.set(false);
|
|
121
127
|
this.selectComponent.tabIndex.set(0);
|
|
122
128
|
this.symbolRegistry.registerSymbols([apCheck, apPlus]);
|
|
123
129
|
this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));
|
|
130
|
+
// Off by default (opt-in via the `clearable` input); enables ng-select's native clear (X).
|
|
131
|
+
effect(() => this.selectComponent.clearable.set(this.clearable()));
|
|
124
132
|
// Handle symbolId changes
|
|
125
133
|
effect(() => {
|
|
126
134
|
const symbolId = this.symbolId();
|
|
@@ -170,10 +178,10 @@ class SelectBaseDirective {
|
|
|
170
178
|
this.labelElement = undefined;
|
|
171
179
|
}
|
|
172
180
|
}
|
|
173
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
174
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
181
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
182
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: SelectBaseDirective, isStandalone: true, selector: "ng-select[apSelect]", inputs: { inlineLabel: { classPropertyName: "inlineLabel", publicName: "inlineLabel", isSignal: true, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ap-select" }, ngImport: i0 });
|
|
175
183
|
}
|
|
176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
184
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectBaseDirective, decorators: [{
|
|
177
185
|
type: Directive,
|
|
178
186
|
args: [{
|
|
179
187
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -183,15 +191,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
183
191
|
class: 'ap-select',
|
|
184
192
|
},
|
|
185
193
|
}]
|
|
186
|
-
}], ctorParameters: () => [], propDecorators: { inlineLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineLabel", required: false }] }], symbolId: [{ type: i0.Input, args: [{ isSignal: true, alias: "symbolId", required: false }] }] } });
|
|
194
|
+
}], ctorParameters: () => [], propDecorators: { inlineLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineLabel", required: false }] }], symbolId: [{ type: i0.Input, args: [{ isSignal: true, alias: "symbolId", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }] } });
|
|
187
195
|
|
|
188
196
|
class SelectMultipleDirective {
|
|
189
197
|
selectComponent = inject(NgSelectComponent);
|
|
190
198
|
elementRef = inject(ElementRef);
|
|
191
199
|
originalDisabledState = new WeakMap();
|
|
192
|
-
maxItemsTooltip = input(
|
|
200
|
+
maxItemsTooltip = input(/* @ts-ignore */
|
|
201
|
+
...(ngDevMode ? [undefined, { debugName: "maxItemsTooltip" }] : /* istanbul ignore next */ []));
|
|
193
202
|
/** Pins items selected at open time to the top of the dropdown. Ignored when `groupBy` is set. */
|
|
194
|
-
pinnedItemsEnabled = input(false,
|
|
203
|
+
pinnedItemsEnabled = input(false, /* @ts-ignore */
|
|
204
|
+
...(ngDevMode ? [{ debugName: "pinnedItemsEnabled" }] : /* istanbul ignore next */ []));
|
|
195
205
|
valueContainer = null;
|
|
196
206
|
subs = new Subscription();
|
|
197
207
|
constructor() {
|
|
@@ -281,10 +291,10 @@ class SelectMultipleDirective {
|
|
|
281
291
|
item.disabled = originallyDisabled || (maxReached && !item.selected);
|
|
282
292
|
}
|
|
283
293
|
}
|
|
284
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
285
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
294
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectMultipleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
295
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: SelectMultipleDirective, isStandalone: true, selector: "ng-select[apSelectMultiple]", inputs: { maxItemsTooltip: { classPropertyName: "maxItemsTooltip", publicName: "maxItemsTooltip", isSignal: true, isRequired: false, transformFunction: null }, pinnedItemsEnabled: { classPropertyName: "pinnedItemsEnabled", publicName: "pinnedItemsEnabled", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: SelectBaseDirective, inputs: ["inlineLabel", "inlineLabel", "symbolId", "symbolId", "clearable", "clearable"] }], ngImport: i0 });
|
|
286
296
|
}
|
|
287
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
297
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectMultipleDirective, decorators: [{
|
|
288
298
|
type: Directive,
|
|
289
299
|
args: [{
|
|
290
300
|
selector: 'ng-select[apSelectMultiple]',
|
|
@@ -292,7 +302,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
292
302
|
hostDirectives: [
|
|
293
303
|
{
|
|
294
304
|
directive: SelectBaseDirective,
|
|
295
|
-
inputs: ['inlineLabel', 'symbolId'],
|
|
305
|
+
inputs: ['inlineLabel', 'symbolId', 'clearable'],
|
|
296
306
|
},
|
|
297
307
|
],
|
|
298
308
|
}]
|
|
@@ -316,11 +326,16 @@ class DropdownItemMultipleOneLineComponent {
|
|
|
316
326
|
dividerEnabled = false;
|
|
317
327
|
onlyEnabled = false;
|
|
318
328
|
onlyText = 'Only';
|
|
319
|
-
isFeatureLocked = input(false,
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
329
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
330
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
331
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
332
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
333
|
+
network = input(/* @ts-ignore */
|
|
334
|
+
...(ngDevMode ? [undefined, { debugName: "network" }] : /* istanbul ignore next */ []));
|
|
335
|
+
symbolColor = input(/* @ts-ignore */
|
|
336
|
+
...(ngDevMode ? [undefined, { debugName: "symbolColor" }] : /* istanbul ignore next */ []));
|
|
337
|
+
symbolTooltipText = input(/* @ts-ignore */
|
|
338
|
+
...(ngDevMode ? [undefined, { debugName: "symbolTooltipText" }] : /* istanbul ignore next */ []));
|
|
324
339
|
selectOnly = output();
|
|
325
340
|
selectionChange = output();
|
|
326
341
|
lockedFeatureClicked = output();
|
|
@@ -340,10 +355,10 @@ class DropdownItemMultipleOneLineComponent {
|
|
|
340
355
|
this.selectionChange.emit(checked);
|
|
341
356
|
}
|
|
342
357
|
}
|
|
343
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
344
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
358
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleOneLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
359
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", 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 }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: false, isRequired: false, 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", selectionChange: "selectionChange", 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 ?? selectMultiple?.maxItemsTooltip()\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div\n class=\"option multiple\"\n [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n #checkbox\n [checked]=\"selected\"\n [indeterminate]=\"indeterminate\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\"\n (change)=\"onCheckboxChange($event)\">\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 </ap-checkbox>\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</div>\n\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);width:100%}ap-dropdown-item-multiple-one-line .option ap-checkbox{width:100%}ap-dropdown-item-multiple-one-line .option ap-checkbox label{display:flex;flex-direction:row;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-one-line .option-item{width:100%;word-break:break-word}\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", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems", "apTooltipShowAvatarCaption"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
345
360
|
}
|
|
346
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
361
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleOneLineComponent, decorators: [{
|
|
347
362
|
type: Component,
|
|
348
363
|
args: [{ selector: 'ap-dropdown-item-multiple-one-line', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, CheckboxComponent, AvatarComponent, BadgeComponent, TooltipDirective], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip ?? selectMultiple?.maxItemsTooltip()\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div\n class=\"option multiple\"\n [class.feature-locked-option]=\"isFeatureLocked()\">\n <ap-checkbox\n #checkbox\n [checked]=\"selected\"\n [indeterminate]=\"indeterminate\"\n [disabled]=\"disabled || isFeatureLocked()\"\n [name]=\"'option-selection-' + htmlId\"\n (change)=\"onCheckboxChange($event)\">\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 </ap-checkbox>\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</div>\n\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);width:100%}ap-dropdown-item-multiple-one-line .option ap-checkbox{width:100%}ap-dropdown-item-multiple-one-line .option ap-checkbox label{display:flex;flex-direction:row;gap:var(--ref-spacing-xxs);align-items:center}ap-dropdown-item-multiple-one-line .option-item{width:100%;word-break:break-word}\n"] }]
|
|
349
364
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -399,11 +414,16 @@ class DropdownItemMultipleTwoLinesComponent {
|
|
|
399
414
|
dividerEnabled = false;
|
|
400
415
|
onlyEnabled = false;
|
|
401
416
|
onlyText = 'Only';
|
|
402
|
-
isFeatureLocked = input(false,
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
417
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
418
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
419
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
420
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
421
|
+
network = input(/* @ts-ignore */
|
|
422
|
+
...(ngDevMode ? [undefined, { debugName: "network" }] : /* istanbul ignore next */ []));
|
|
423
|
+
symbolColor = input(/* @ts-ignore */
|
|
424
|
+
...(ngDevMode ? [undefined, { debugName: "symbolColor" }] : /* istanbul ignore next */ []));
|
|
425
|
+
symbolTooltipText = input(/* @ts-ignore */
|
|
426
|
+
...(ngDevMode ? [undefined, { debugName: "symbolTooltipText" }] : /* istanbul ignore next */ []));
|
|
407
427
|
selectOnly = new EventEmitter();
|
|
408
428
|
lockedFeatureClicked = output();
|
|
409
429
|
checkbox;
|
|
@@ -417,10 +437,10 @@ class DropdownItemMultipleTwoLinesComponent {
|
|
|
417
437
|
this.selectOnly.emit();
|
|
418
438
|
this.checkbox.focus();
|
|
419
439
|
}
|
|
420
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
421
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
440
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleTwoLinesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
441
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", 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 ?? selectMultiple?.maxItemsTooltip()\"\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", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems", "apTooltipShowAvatarCaption"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
422
442
|
}
|
|
423
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
443
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleTwoLinesComponent, decorators: [{
|
|
424
444
|
type: Component,
|
|
425
445
|
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 ?? selectMultiple?.maxItemsTooltip()\"\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"] }]
|
|
426
446
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -476,8 +496,10 @@ class DropdownItemSingleOneLineComponent {
|
|
|
476
496
|
badgeText;
|
|
477
497
|
dividerEnabled = false;
|
|
478
498
|
network = undefined;
|
|
479
|
-
roundedAvatar = input(true,
|
|
480
|
-
|
|
499
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
500
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
501
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
502
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
481
503
|
lockedFeatureClicked = output();
|
|
482
504
|
onClick($event) {
|
|
483
505
|
if (this.isFeatureLocked()) {
|
|
@@ -485,10 +507,10 @@ class DropdownItemSingleOneLineComponent {
|
|
|
485
507
|
this.lockedFeatureClicked.emit();
|
|
486
508
|
}
|
|
487
509
|
}
|
|
488
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
489
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
510
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleOneLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
511
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropdownItemSingleOneLineComponent, isStandalone: true, selector: "ap-dropdown-item-single-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 }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: false, isRequired: false, transformFunction: null }, showAvatarInitials: { classPropertyName: "showAvatarInitials", publicName: "showAvatarInitials", 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 }, network: { classPropertyName: "network", publicName: "network", isSignal: false, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null }, isFeatureLocked: { classPropertyName: "isFeatureLocked", publicName: "isFeatureLocked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { lockedFeatureClicked: "lockedFeatureClicked" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0, template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option\" [class.feature-locked-option]=\"isFeatureLocked()\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"showAvatarInitials\"\n [network]=\"network\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\" />\n }\n <span\n class=\"option-item\"\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n } @else if (selected) {\n <ap-symbol\n class=\"option-selected\"\n symbolId=\"check\"\n color=\"electric-blue\"\n size=\"sm\" />\n }\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-single-one-line .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-single-one-line .option .option-selected{margin-left:auto}ap-dropdown-item-single-one-line .option-item{width:100%}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { 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", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems", "apTooltipShowAvatarCaption"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
490
512
|
}
|
|
491
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
513
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleOneLineComponent, decorators: [{
|
|
492
514
|
type: Component,
|
|
493
515
|
args: [{ selector: 'ap-dropdown-item-single-one-line', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, AvatarComponent, BadgeComponent, TooltipDirective], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option\" [class.feature-locked-option]=\"isFeatureLocked()\">\n @if (avatarUrl !== undefined) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [profilePicture]=\"avatarUrl\"\n [username]=\"text\"\n [showInitials]=\"showAvatarInitials\"\n [network]=\"network\" />\n }\n @if (symbolId) {\n <ap-symbol\n size=\"sm\"\n [symbolId]=\"symbolId\" />\n }\n <span\n class=\"option-item\"\n [title]=\"text\">\n {{ text }}\n </span>\n @if (badgeText) {\n <ap-badge color=\"blue\">\n {{ badgeText }}\n </ap-badge>\n }\n @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n } @else if (selected) {\n <ap-symbol\n class=\"option-selected\"\n symbolId=\"check\"\n color=\"electric-blue\"\n size=\"sm\" />\n }\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-single-one-line .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-single-one-line .option .option-selected{margin-left:auto}ap-dropdown-item-single-one-line .option-item{width:100%}\n"] }]
|
|
494
516
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -533,8 +555,10 @@ class DropdownItemSingleTwoLinesComponent {
|
|
|
533
555
|
badgeText;
|
|
534
556
|
dividerEnabled = false;
|
|
535
557
|
network = undefined;
|
|
536
|
-
roundedAvatar = input(true,
|
|
537
|
-
|
|
558
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
559
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
560
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
561
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
538
562
|
lockedFeatureClicked = output();
|
|
539
563
|
onClick($event) {
|
|
540
564
|
if (this.isFeatureLocked()) {
|
|
@@ -542,10 +566,10 @@ class DropdownItemSingleTwoLinesComponent {
|
|
|
542
566
|
this.lockedFeatureClicked.emit();
|
|
543
567
|
}
|
|
544
568
|
}
|
|
545
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
546
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
569
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleTwoLinesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
570
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropdownItemSingleTwoLinesComponent, isStandalone: true, selector: "ap-dropdown-item-single-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 }, 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 }, network: { classPropertyName: "network", publicName: "network", isSignal: false, isRequired: false, transformFunction: null }, roundedAvatar: { classPropertyName: "roundedAvatar", publicName: "roundedAvatar", isSignal: true, isRequired: false, transformFunction: null }, isFeatureLocked: { classPropertyName: "isFeatureLocked", publicName: "isFeatureLocked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { lockedFeatureClicked: "lockedFeatureClicked" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0, template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option with-caption\" [class.feature-locked-option]=\"isFeatureLocked()\">\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 }\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\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 @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n } @else if (selected) {\n <ap-symbol\n class=\"option-selected\"\n symbolId=\"check\"\n color=\"electric-blue\"\n size=\"sm\" />\n }\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-single-two-lines .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-single-two-lines .option .option-selected{margin-left:auto}ap-dropdown-item-single-two-lines .option .texts{flex:1;overflow:auto;display:flex;flex-direction:column}ap-dropdown-item-single-two-lines .option .texts .first-line{display:flex;align-items:center;gap:var(--ref-spacing-xxs)}ap-dropdown-item-single-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: 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", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems", "apTooltipShowAvatarCaption"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
547
571
|
}
|
|
548
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
572
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleTwoLinesComponent, decorators: [{
|
|
549
573
|
type: Component,
|
|
550
574
|
args: [{ selector: 'ap-dropdown-item-single-two-lines', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [SymbolComponent, AvatarComponent, BadgeComponent, TooltipDirective], template: "<div\n class=\"disabled-opaque\"\n [apTooltip]=\"disabledTooltip\"\n [apTooltipDisabled]=\"!disabled\"></div>\n<div class=\"option with-caption\" [class.feature-locked-option]=\"isFeatureLocked()\">\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 }\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\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 @if (isFeatureLocked()) {\n <ap-symbol\n symbolId=\"feature-lock\"\n color=\"purple\"\n size=\"sm\"/>\n } @else if (selected) {\n <ap-symbol\n class=\"option-selected\"\n symbolId=\"check\"\n color=\"electric-blue\"\n size=\"sm\" />\n }\n</div>\n@if (dividerEnabled) {\n <div class=\"divider\"></div>\n}\n", styles: ["ap-dropdown-item-single-two-lines .option{display:flex;gap:var(--ref-spacing-xxs)}ap-dropdown-item-single-two-lines .option .option-selected{margin-left:auto}ap-dropdown-item-single-two-lines .option .texts{flex:1;overflow:auto;display:flex;flex-direction:column}ap-dropdown-item-single-two-lines .option .texts .first-line{display:flex;align-items:center;gap:var(--ref-spacing-xxs)}ap-dropdown-item-single-two-lines .option .texts .first-line .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"] }]
|
|
551
575
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -584,7 +608,8 @@ class DropdownSearchFormComponent {
|
|
|
584
608
|
select;
|
|
585
609
|
inputSearch;
|
|
586
610
|
createNew = new EventEmitter();
|
|
587
|
-
searchTermSignal = signal('',
|
|
611
|
+
searchTermSignal = signal('', /* @ts-ignore */
|
|
612
|
+
...(ngDevMode ? [{ debugName: "searchTermSignal" }] : /* istanbul ignore next */ []));
|
|
588
613
|
searchTerm$ = new BehaviorSubject('');
|
|
589
614
|
searchInputElement = null;
|
|
590
615
|
constructor() {
|
|
@@ -615,10 +640,10 @@ class DropdownSearchFormComponent {
|
|
|
615
640
|
this.select.handleKeyDown(event);
|
|
616
641
|
}
|
|
617
642
|
};
|
|
618
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
619
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
643
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownSearchFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
644
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropdownSearchFormComponent, isStandalone: true, selector: "ap-dropdown-search-form", inputs: { searchPlaceholder: "searchPlaceholder", createNewEnabled: "createNewEnabled", createText: "createText", select: "select" }, outputs: { createNew: "createNew" }, viewQueries: [{ propertyName: "inputSearch", first: true, predicate: InputSearchComponent, descendants: true }], ngImport: i0, template: "<ap-input-search\n class=\"dropdown-search-input\"\n [ngModel]=\"searchTermSignal()\"\n [placeholder]=\"searchPlaceholder\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n\n@if (createNewEnabled) {\n <ap-dropdown-create-new\n [text]=\"createText\"\n [searchTerm]=\"searchTermSignal()\"\n (createNew)=\"createNew.emit($event)\" />\n}\n\n", styles: ["ap-dropdown-search-form .dropdown-search-input .ap-input-group{width:100%}ap-dropdown-search-form .dropdown-search-input .ap-input-group input{width:100%}ap-dropdown-search-form .dropdown-search-input .ap-input-group input:placeholder-shown{text-overflow:ellipsis}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: InputSearchComponent, selector: "ap-input-search", inputs: ["id", "placeholder", "clearable"], outputs: ["focus", "blur", "keyup"] }, { kind: "component", type: DropdownCreateNewComponent, selector: "ap-dropdown-create-new", inputs: ["text", "searchTerm"], outputs: ["createNew"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
620
645
|
}
|
|
621
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
646
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownSearchFormComponent, decorators: [{
|
|
622
647
|
type: Component,
|
|
623
648
|
args: [{ selector: 'ap-dropdown-search-form', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [FormsModule, InputSearchComponent, DropdownCreateNewComponent], template: "<ap-input-search\n class=\"dropdown-search-input\"\n [ngModel]=\"searchTermSignal()\"\n [placeholder]=\"searchPlaceholder\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n\n@if (createNewEnabled) {\n <ap-dropdown-create-new\n [text]=\"createText\"\n [searchTerm]=\"searchTermSignal()\"\n (createNew)=\"createNew.emit($event)\" />\n}\n\n", styles: ["ap-dropdown-search-form .dropdown-search-input .ap-input-group{width:100%}ap-dropdown-search-form .dropdown-search-input .ap-input-group input{width:100%}ap-dropdown-search-form .dropdown-search-input .ap-input-group input:placeholder-shown{text-overflow:ellipsis}\n"] }]
|
|
624
649
|
}], ctorParameters: () => [], propDecorators: { searchPlaceholder: [{
|
|
@@ -640,16 +665,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
640
665
|
}] } });
|
|
641
666
|
|
|
642
667
|
class SelectLabelMultipleComponent {
|
|
643
|
-
displayType = input('label',
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
668
|
+
displayType = input('label', /* @ts-ignore */
|
|
669
|
+
...(ngDevMode ? [{ debugName: "displayType" }] : /* istanbul ignore next */ []));
|
|
670
|
+
tagColor = input('grey', /* @ts-ignore */
|
|
671
|
+
...(ngDevMode ? [{ debugName: "tagColor" }] : /* istanbul ignore next */ []));
|
|
672
|
+
selectedItems = input.required(/* @ts-ignore */
|
|
673
|
+
...(ngDevMode ? [{ debugName: "selectedItems" }] : /* istanbul ignore next */ []));
|
|
674
|
+
bindLabel = input('', /* @ts-ignore */
|
|
675
|
+
...(ngDevMode ? [{ debugName: "bindLabel" }] : /* istanbul ignore next */ []));
|
|
676
|
+
bindValue = input('', /* @ts-ignore */
|
|
677
|
+
...(ngDevMode ? [{ debugName: "bindValue" }] : /* istanbul ignore next */ []));
|
|
678
|
+
bindAvatarUrl = input('', /* @ts-ignore */
|
|
679
|
+
...(ngDevMode ? [{ debugName: "bindAvatarUrl" }] : /* istanbul ignore next */ []));
|
|
680
|
+
bindSymbolId = input('', /* @ts-ignore */
|
|
681
|
+
...(ngDevMode ? [{ debugName: "bindSymbolId" }] : /* istanbul ignore next */ []));
|
|
682
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
683
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
684
|
+
bindNetwork = input('', /* @ts-ignore */
|
|
685
|
+
...(ngDevMode ? [{ debugName: "bindNetwork" }] : /* istanbul ignore next */ []));
|
|
686
|
+
bindTagColor = input('', /* @ts-ignore */
|
|
687
|
+
...(ngDevMode ? [{ debugName: "bindTagColor" }] : /* istanbul ignore next */ []));
|
|
653
688
|
removeItem = output();
|
|
654
689
|
/**
|
|
655
690
|
* Parent ng-select, resolved through the DI chain of the `ng-multi-label-tmp` template.
|
|
@@ -657,7 +692,8 @@ class SelectLabelMultipleComponent {
|
|
|
657
692
|
*/
|
|
658
693
|
ngSelect = inject(NgSelectComponent, { optional: true });
|
|
659
694
|
/** True when the whole select is disabled/readonly — hides every tag/label remove button. */
|
|
660
|
-
selectDisabled = computed(() => this.ngSelect?.disabled() ?? false,
|
|
695
|
+
selectDisabled = computed(() => this.ngSelect?.disabled() ?? false, /* @ts-ignore */
|
|
696
|
+
...(ngDevMode ? [{ debugName: "selectDisabled" }] : /* istanbul ignore next */ []));
|
|
661
697
|
selectedLabels = computed(() => this.selectedItems().map(item => ({
|
|
662
698
|
label: this.bindLabel() ? item[this.bindLabel()] : item,
|
|
663
699
|
avatarUrl: this.bindAvatarUrl() ? item[this.bindAvatarUrl()] : '',
|
|
@@ -665,8 +701,10 @@ class SelectLabelMultipleComponent {
|
|
|
665
701
|
value: item,
|
|
666
702
|
network: this.bindNetwork() ? item[this.bindNetwork()] : undefined,
|
|
667
703
|
tagColor: this.bindTagColor() ? item[this.bindTagColor()] : undefined,
|
|
668
|
-
})),
|
|
669
|
-
|
|
704
|
+
})), /* @ts-ignore */
|
|
705
|
+
...(ngDevMode ? [{ debugName: "selectedLabels" }] : /* istanbul ignore next */ []));
|
|
706
|
+
hiddenCount = signal(0, /* @ts-ignore */
|
|
707
|
+
...(ngDevMode ? [{ debugName: "hiddenCount" }] : /* istanbul ignore next */ []));
|
|
670
708
|
trackByItem = (_, item) => (this.bindValue() ? item.value[this.bindValue()] : item.value);
|
|
671
709
|
mainContainer = viewChild.required('mainContainer', { read: ElementRef });
|
|
672
710
|
itemsElement = viewChildren('itemElement', { ...(ngDevMode ? { debugName: "itemsElement" } : /* istanbul ignore next */ {}), read: ElementRef });
|
|
@@ -700,25 +738,31 @@ class SelectLabelMultipleComponent {
|
|
|
700
738
|
containerEl.style.maxWidth = `${totalWidth}px`;
|
|
701
739
|
this.hiddenCount.set(hiddenCount);
|
|
702
740
|
});
|
|
703
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
704
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
741
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelMultipleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
742
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SelectLabelMultipleComponent, isStandalone: true, selector: "ap-select-label-multiple", inputs: { displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, tagColor: { classPropertyName: "tagColor", publicName: "tagColor", 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 }, bindTagColor: { classPropertyName: "bindTagColor", publicName: "bindTagColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removeItem: "removeItem" }, viewQueries: [{ propertyName: "mainContainer", first: true, predicate: ["mainContainer"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "itemsElement", predicate: ["itemElement"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<div #mainContainer class=\"multiple-item\">\n @for (item of selectedLabels(); track trackByItem($index, item)) {\n @if (displayType() === 'label') {\n <ap-label\n #itemElement\n class=\"item\"\n color=\"blue\"\n [removable]=\"!item.value.disabled && !selectDisabled()\"\n [content]=\"item.label\"\n (remove)=\"removeItem.emit(item.value)\" />\n }\n\n @if (displayType() === 'tag') {\n <ap-tag\n #itemElement\n class=\"item text-item\"\n [clearable]=\"!item.value.disabled && !selectDisabled()\"\n [color]=\"item.tagColor ?? tagColor()\"\n (clear)=\"removeItem.emit(item.value)\">\n @if (item.avatarUrl || item.network) {\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 clearable=\"false\"\n [color]=\"tagColor()\">\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;width:100%}\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 });
|
|
705
743
|
}
|
|
706
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
744
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelMultipleComponent, decorators: [{
|
|
707
745
|
type: Component,
|
|
708
746
|
args: [{ selector: 'ap-select-label-multiple', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LabelComponent, TagComponent, AvatarComponent, SymbolComponent], template: "<div #mainContainer class=\"multiple-item\">\n @for (item of selectedLabels(); track trackByItem($index, item)) {\n @if (displayType() === 'label') {\n <ap-label\n #itemElement\n class=\"item\"\n color=\"blue\"\n [removable]=\"!item.value.disabled && !selectDisabled()\"\n [content]=\"item.label\"\n (remove)=\"removeItem.emit(item.value)\" />\n }\n\n @if (displayType() === 'tag') {\n <ap-tag\n #itemElement\n class=\"item text-item\"\n [clearable]=\"!item.value.disabled && !selectDisabled()\"\n [color]=\"item.tagColor ?? tagColor()\"\n (clear)=\"removeItem.emit(item.value)\">\n @if (item.avatarUrl || item.network) {\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 clearable=\"false\"\n [color]=\"tagColor()\">\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;width:100%}\n"] }]
|
|
709
747
|
}], propDecorators: { displayType: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayType", required: false }] }], tagColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagColor", required: false }] }], selectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItems", required: true }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }], bindAvatarUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindAvatarUrl", required: false }] }], bindSymbolId: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindSymbolId", required: false }] }], roundedAvatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "roundedAvatar", required: false }] }], bindNetwork: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindNetwork", required: false }] }], bindTagColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindTagColor", required: false }] }], removeItem: [{ type: i0.Output, args: ["removeItem"] }], mainContainer: [{ type: i0.ViewChild, args: ['mainContainer', { ...{ read: ElementRef }, isSignal: true }] }], itemsElement: [{ type: i0.ViewChildren, args: ['itemElement', { ...{ read: ElementRef }, isSignal: true }] }] } });
|
|
710
748
|
|
|
711
749
|
class SelectLabelSingleComponent {
|
|
712
|
-
displayType = input('text',
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
750
|
+
displayType = input('text', /* @ts-ignore */
|
|
751
|
+
...(ngDevMode ? [{ debugName: "displayType" }] : /* istanbul ignore next */ []));
|
|
752
|
+
label = input.required(/* @ts-ignore */
|
|
753
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
754
|
+
avatarUrl = input(/* @ts-ignore */
|
|
755
|
+
...(ngDevMode ? [undefined, { debugName: "avatarUrl" }] : /* istanbul ignore next */ []));
|
|
756
|
+
network = input(undefined, /* @ts-ignore */
|
|
757
|
+
...(ngDevMode ? [{ debugName: "network" }] : /* istanbul ignore next */ []));
|
|
758
|
+
showAvatarInitials = input(true, /* @ts-ignore */
|
|
759
|
+
...(ngDevMode ? [{ debugName: "showAvatarInitials" }] : /* istanbul ignore next */ []));
|
|
760
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
761
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
762
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelSingleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
763
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SelectLabelSingleComponent, isStandalone: true, selector: "ap-select-label-single", inputs: { displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: true, isRequired: false, transformFunction: null }, network: { classPropertyName: "network", publicName: "network", isSignal: true, isRequired: false, transformFunction: null }, showAvatarInitials: { classPropertyName: "showAvatarInitials", publicName: "showAvatarInitials", isSignal: true, 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 @if (avatarUrl()) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [username]=\"label()\"\n [showInitials]=\"showAvatarInitials()\"\n [profilePicture]=\"avatarUrl()\"\n [network]=\"network()\" />\n }\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 });
|
|
720
764
|
}
|
|
721
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
765
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelSingleComponent, decorators: [{
|
|
722
766
|
type: Component,
|
|
723
767
|
args: [{ selector: 'ap-select-label-single', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LabelComponent, TagComponent, AvatarComponent], 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 @if (avatarUrl()) {\n <ap-avatar\n [rounded]=\"roundedAvatar()\"\n [size]=\"24\"\n [username]=\"label()\"\n [showInitials]=\"showAvatarInitials()\"\n [profilePicture]=\"avatarUrl()\"\n [network]=\"network()\" />\n }\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"] }]
|
|
724
768
|
}], propDecorators: { displayType: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayType", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], avatarUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarUrl", required: false }] }], network: [{ type: i0.Input, args: [{ isSignal: true, alias: "network", required: false }] }], showAvatarInitials: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAvatarInitials", required: false }] }], roundedAvatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "roundedAvatar", required: false }] }] } });
|
|
@@ -734,10 +778,10 @@ class SelectSingleDirective {
|
|
|
734
778
|
throw new Error('labelTemplate is required for apSelectSingle');
|
|
735
779
|
}
|
|
736
780
|
}
|
|
737
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
738
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
781
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectSingleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
782
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: SelectSingleDirective, isStandalone: true, selector: "ng-select[apSelectSingle]", hostDirectives: [{ directive: SelectBaseDirective, inputs: ["inlineLabel", "inlineLabel", "symbolId", "symbolId", "clearable", "clearable"] }], ngImport: i0 });
|
|
739
783
|
}
|
|
740
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
784
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectSingleDirective, decorators: [{
|
|
741
785
|
type: Directive,
|
|
742
786
|
args: [{
|
|
743
787
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -746,15 +790,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
746
790
|
hostDirectives: [
|
|
747
791
|
{
|
|
748
792
|
directive: SelectBaseDirective,
|
|
749
|
-
inputs: ['inlineLabel', 'symbolId'],
|
|
793
|
+
inputs: ['inlineLabel', 'symbolId', 'clearable'],
|
|
750
794
|
},
|
|
751
795
|
],
|
|
752
796
|
}]
|
|
753
797
|
}], ctorParameters: () => [] });
|
|
754
798
|
|
|
755
799
|
class ApSelectModule {
|
|
756
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
757
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
800
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
801
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, imports: [SelectMultipleDirective,
|
|
758
802
|
SelectSingleDirective,
|
|
759
803
|
DropdownItemSingleOneLineComponent,
|
|
760
804
|
DropdownItemSingleTwoLinesComponent,
|
|
@@ -777,7 +821,7 @@ class ApSelectModule {
|
|
|
777
821
|
DropdownCreateNewComponent,
|
|
778
822
|
DropdownGroupItemComponent,
|
|
779
823
|
NgSelectModule] });
|
|
780
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
824
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, imports: [DropdownItemSingleOneLineComponent,
|
|
781
825
|
DropdownItemSingleTwoLinesComponent,
|
|
782
826
|
DropdownItemMultipleOneLineComponent,
|
|
783
827
|
DropdownItemMultipleTwoLinesComponent,
|
|
@@ -788,7 +832,7 @@ class ApSelectModule {
|
|
|
788
832
|
DropdownGroupItemComponent,
|
|
789
833
|
NgSelectModule, NgSelectModule] });
|
|
790
834
|
}
|
|
791
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
835
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, decorators: [{
|
|
792
836
|
type: NgModule,
|
|
793
837
|
args: [{
|
|
794
838
|
imports: [
|