@agorapulse/ui-components 21.1.15 → 22.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/agorapulse-ui-components-22.0.0.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 +91 -50
- 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 +168 -96
- 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 +134 -100
- 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-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 -9
- package/types/agorapulse-ui-components-slide-toggle.d.ts +1 -0
- package/agorapulse-ui-components-21.1.15.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,10 @@ 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 */ []));
|
|
108
112
|
selectComponent = inject(NgSelectComponent);
|
|
109
113
|
el = inject(ElementRef);
|
|
110
114
|
renderer = inject(Renderer2);
|
|
@@ -170,10 +174,10 @@ class SelectBaseDirective {
|
|
|
170
174
|
this.labelElement = undefined;
|
|
171
175
|
}
|
|
172
176
|
}
|
|
173
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
174
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
177
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
178
|
+
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 } }, host: { classAttribute: "ap-select" }, ngImport: i0 });
|
|
175
179
|
}
|
|
176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
180
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectBaseDirective, decorators: [{
|
|
177
181
|
type: Directive,
|
|
178
182
|
args: [{
|
|
179
183
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -189,9 +193,11 @@ class SelectMultipleDirective {
|
|
|
189
193
|
selectComponent = inject(NgSelectComponent);
|
|
190
194
|
elementRef = inject(ElementRef);
|
|
191
195
|
originalDisabledState = new WeakMap();
|
|
192
|
-
maxItemsTooltip = input(
|
|
196
|
+
maxItemsTooltip = input(/* @ts-ignore */
|
|
197
|
+
...(ngDevMode ? [undefined, { debugName: "maxItemsTooltip" }] : /* istanbul ignore next */ []));
|
|
193
198
|
/** Pins items selected at open time to the top of the dropdown. Ignored when `groupBy` is set. */
|
|
194
|
-
pinnedItemsEnabled = input(false,
|
|
199
|
+
pinnedItemsEnabled = input(false, /* @ts-ignore */
|
|
200
|
+
...(ngDevMode ? [{ debugName: "pinnedItemsEnabled" }] : /* istanbul ignore next */ []));
|
|
195
201
|
valueContainer = null;
|
|
196
202
|
subs = new Subscription();
|
|
197
203
|
constructor() {
|
|
@@ -281,10 +287,10 @@ class SelectMultipleDirective {
|
|
|
281
287
|
item.disabled = originallyDisabled || (maxReached && !item.selected);
|
|
282
288
|
}
|
|
283
289
|
}
|
|
284
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
285
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
290
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectMultipleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
291
|
+
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"] }], ngImport: i0 });
|
|
286
292
|
}
|
|
287
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
293
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectMultipleDirective, decorators: [{
|
|
288
294
|
type: Directive,
|
|
289
295
|
args: [{
|
|
290
296
|
selector: 'ng-select[apSelectMultiple]',
|
|
@@ -316,11 +322,16 @@ class DropdownItemMultipleOneLineComponent {
|
|
|
316
322
|
dividerEnabled = false;
|
|
317
323
|
onlyEnabled = false;
|
|
318
324
|
onlyText = 'Only';
|
|
319
|
-
isFeatureLocked = input(false,
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
325
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
326
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
327
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
328
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
329
|
+
network = input(/* @ts-ignore */
|
|
330
|
+
...(ngDevMode ? [undefined, { debugName: "network" }] : /* istanbul ignore next */ []));
|
|
331
|
+
symbolColor = input(/* @ts-ignore */
|
|
332
|
+
...(ngDevMode ? [undefined, { debugName: "symbolColor" }] : /* istanbul ignore next */ []));
|
|
333
|
+
symbolTooltipText = input(/* @ts-ignore */
|
|
334
|
+
...(ngDevMode ? [undefined, { debugName: "symbolTooltipText" }] : /* istanbul ignore next */ []));
|
|
324
335
|
selectOnly = output();
|
|
325
336
|
selectionChange = output();
|
|
326
337
|
lockedFeatureClicked = output();
|
|
@@ -340,10 +351,10 @@ class DropdownItemMultipleOneLineComponent {
|
|
|
340
351
|
this.selectionChange.emit(checked);
|
|
341
352
|
}
|
|
342
353
|
}
|
|
343
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
344
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
354
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleOneLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
355
|
+
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
356
|
}
|
|
346
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
357
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleOneLineComponent, decorators: [{
|
|
347
358
|
type: Component,
|
|
348
359
|
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
360
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -399,11 +410,16 @@ class DropdownItemMultipleTwoLinesComponent {
|
|
|
399
410
|
dividerEnabled = false;
|
|
400
411
|
onlyEnabled = false;
|
|
401
412
|
onlyText = 'Only';
|
|
402
|
-
isFeatureLocked = input(false,
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
413
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
414
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
415
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
416
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
417
|
+
network = input(/* @ts-ignore */
|
|
418
|
+
...(ngDevMode ? [undefined, { debugName: "network" }] : /* istanbul ignore next */ []));
|
|
419
|
+
symbolColor = input(/* @ts-ignore */
|
|
420
|
+
...(ngDevMode ? [undefined, { debugName: "symbolColor" }] : /* istanbul ignore next */ []));
|
|
421
|
+
symbolTooltipText = input(/* @ts-ignore */
|
|
422
|
+
...(ngDevMode ? [undefined, { debugName: "symbolTooltipText" }] : /* istanbul ignore next */ []));
|
|
407
423
|
selectOnly = new EventEmitter();
|
|
408
424
|
lockedFeatureClicked = output();
|
|
409
425
|
checkbox;
|
|
@@ -417,10 +433,10 @@ class DropdownItemMultipleTwoLinesComponent {
|
|
|
417
433
|
this.selectOnly.emit();
|
|
418
434
|
this.checkbox.focus();
|
|
419
435
|
}
|
|
420
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
421
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
436
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleTwoLinesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
437
|
+
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
438
|
}
|
|
423
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
439
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemMultipleTwoLinesComponent, decorators: [{
|
|
424
440
|
type: Component,
|
|
425
441
|
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
442
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -476,8 +492,10 @@ class DropdownItemSingleOneLineComponent {
|
|
|
476
492
|
badgeText;
|
|
477
493
|
dividerEnabled = false;
|
|
478
494
|
network = undefined;
|
|
479
|
-
roundedAvatar = input(true,
|
|
480
|
-
|
|
495
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
496
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
497
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
498
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
481
499
|
lockedFeatureClicked = output();
|
|
482
500
|
onClick($event) {
|
|
483
501
|
if (this.isFeatureLocked()) {
|
|
@@ -485,10 +503,10 @@ class DropdownItemSingleOneLineComponent {
|
|
|
485
503
|
this.lockedFeatureClicked.emit();
|
|
486
504
|
}
|
|
487
505
|
}
|
|
488
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
489
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
506
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleOneLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
507
|
+
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
508
|
}
|
|
491
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
509
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleOneLineComponent, decorators: [{
|
|
492
510
|
type: Component,
|
|
493
511
|
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
512
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -533,8 +551,10 @@ class DropdownItemSingleTwoLinesComponent {
|
|
|
533
551
|
badgeText;
|
|
534
552
|
dividerEnabled = false;
|
|
535
553
|
network = undefined;
|
|
536
|
-
roundedAvatar = input(true,
|
|
537
|
-
|
|
554
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
555
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
556
|
+
isFeatureLocked = input(false, /* @ts-ignore */
|
|
557
|
+
...(ngDevMode ? [{ debugName: "isFeatureLocked" }] : /* istanbul ignore next */ []));
|
|
538
558
|
lockedFeatureClicked = output();
|
|
539
559
|
onClick($event) {
|
|
540
560
|
if (this.isFeatureLocked()) {
|
|
@@ -542,10 +562,10 @@ class DropdownItemSingleTwoLinesComponent {
|
|
|
542
562
|
this.lockedFeatureClicked.emit();
|
|
543
563
|
}
|
|
544
564
|
}
|
|
545
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
546
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
565
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleTwoLinesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
566
|
+
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
567
|
}
|
|
548
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
568
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownItemSingleTwoLinesComponent, decorators: [{
|
|
549
569
|
type: Component,
|
|
550
570
|
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
571
|
}], ctorParameters: () => [], propDecorators: { text: [{
|
|
@@ -584,9 +604,10 @@ class DropdownSearchFormComponent {
|
|
|
584
604
|
select;
|
|
585
605
|
inputSearch;
|
|
586
606
|
createNew = new EventEmitter();
|
|
587
|
-
searchTermSignal = signal('',
|
|
607
|
+
searchTermSignal = signal('', /* @ts-ignore */
|
|
608
|
+
...(ngDevMode ? [{ debugName: "searchTermSignal" }] : /* istanbul ignore next */ []));
|
|
588
609
|
searchTerm$ = new BehaviorSubject('');
|
|
589
|
-
|
|
610
|
+
searchInputElement = null;
|
|
590
611
|
constructor() {
|
|
591
612
|
this.searchTerm$
|
|
592
613
|
.pipe(filter(() => !!this.select), takeUntilDestroyed())
|
|
@@ -596,35 +617,29 @@ class DropdownSearchFormComponent {
|
|
|
596
617
|
});
|
|
597
618
|
}
|
|
598
619
|
ngOnDestroy() {
|
|
599
|
-
this.
|
|
620
|
+
this.searchInputElement?.removeEventListener('keydown', this.forwardKeyDown);
|
|
600
621
|
}
|
|
601
622
|
ngAfterViewInit() {
|
|
602
623
|
setTimeout(() => {
|
|
603
624
|
this.inputSearch.focusInput();
|
|
604
|
-
this.
|
|
625
|
+
this.registerKeyboardNavigation();
|
|
605
626
|
}, 100);
|
|
606
627
|
}
|
|
607
|
-
/**
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
* Furthermore: arrow keys currently don't work in the dropdown search form.
|
|
612
|
-
*/
|
|
613
|
-
registerKeyboardSubmit() {
|
|
614
|
-
this.submitSubscription?.unsubscribe();
|
|
615
|
-
this.submitSubscription = this.inputSearch.keyup.subscribe(event => {
|
|
616
|
-
if (event.key === 'Enter') {
|
|
617
|
-
this.select.select(this.select.itemsList.filteredItems[0]);
|
|
618
|
-
}
|
|
619
|
-
else if (event.key === 'Escape') {
|
|
620
|
-
this.select.close();
|
|
621
|
-
}
|
|
622
|
-
});
|
|
628
|
+
/** Forward navigation keys to ng-select's native keyboard handler while the search input holds focus. */
|
|
629
|
+
registerKeyboardNavigation() {
|
|
630
|
+
this.searchInputElement = this.inputSearch.inputElement().nativeElement;
|
|
631
|
+
this.searchInputElement?.addEventListener('keydown', this.forwardKeyDown);
|
|
623
632
|
}
|
|
624
|
-
|
|
625
|
-
|
|
633
|
+
forwardKeyDown = (event) => {
|
|
634
|
+
// Named keys (arrows, Enter, Escape…) drive navigation; single characters keep typing in the search.
|
|
635
|
+
if (event.key.length > 1) {
|
|
636
|
+
this.select.handleKeyDown(event);
|
|
637
|
+
}
|
|
638
|
+
};
|
|
639
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownSearchFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
640
|
+
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 });
|
|
626
641
|
}
|
|
627
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
642
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropdownSearchFormComponent, decorators: [{
|
|
628
643
|
type: Component,
|
|
629
644
|
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"] }]
|
|
630
645
|
}], ctorParameters: () => [], propDecorators: { searchPlaceholder: [{
|
|
@@ -646,16 +661,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
646
661
|
}] } });
|
|
647
662
|
|
|
648
663
|
class SelectLabelMultipleComponent {
|
|
649
|
-
displayType = input('label',
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
664
|
+
displayType = input('label', /* @ts-ignore */
|
|
665
|
+
...(ngDevMode ? [{ debugName: "displayType" }] : /* istanbul ignore next */ []));
|
|
666
|
+
tagColor = input('grey', /* @ts-ignore */
|
|
667
|
+
...(ngDevMode ? [{ debugName: "tagColor" }] : /* istanbul ignore next */ []));
|
|
668
|
+
selectedItems = input.required(/* @ts-ignore */
|
|
669
|
+
...(ngDevMode ? [{ debugName: "selectedItems" }] : /* istanbul ignore next */ []));
|
|
670
|
+
bindLabel = input('', /* @ts-ignore */
|
|
671
|
+
...(ngDevMode ? [{ debugName: "bindLabel" }] : /* istanbul ignore next */ []));
|
|
672
|
+
bindValue = input('', /* @ts-ignore */
|
|
673
|
+
...(ngDevMode ? [{ debugName: "bindValue" }] : /* istanbul ignore next */ []));
|
|
674
|
+
bindAvatarUrl = input('', /* @ts-ignore */
|
|
675
|
+
...(ngDevMode ? [{ debugName: "bindAvatarUrl" }] : /* istanbul ignore next */ []));
|
|
676
|
+
bindSymbolId = input('', /* @ts-ignore */
|
|
677
|
+
...(ngDevMode ? [{ debugName: "bindSymbolId" }] : /* istanbul ignore next */ []));
|
|
678
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
679
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
680
|
+
bindNetwork = input('', /* @ts-ignore */
|
|
681
|
+
...(ngDevMode ? [{ debugName: "bindNetwork" }] : /* istanbul ignore next */ []));
|
|
682
|
+
bindTagColor = input('', /* @ts-ignore */
|
|
683
|
+
...(ngDevMode ? [{ debugName: "bindTagColor" }] : /* istanbul ignore next */ []));
|
|
659
684
|
removeItem = output();
|
|
660
685
|
/**
|
|
661
686
|
* Parent ng-select, resolved through the DI chain of the `ng-multi-label-tmp` template.
|
|
@@ -663,7 +688,8 @@ class SelectLabelMultipleComponent {
|
|
|
663
688
|
*/
|
|
664
689
|
ngSelect = inject(NgSelectComponent, { optional: true });
|
|
665
690
|
/** True when the whole select is disabled/readonly — hides every tag/label remove button. */
|
|
666
|
-
selectDisabled = computed(() => this.ngSelect?.disabled() ?? false,
|
|
691
|
+
selectDisabled = computed(() => this.ngSelect?.disabled() ?? false, /* @ts-ignore */
|
|
692
|
+
...(ngDevMode ? [{ debugName: "selectDisabled" }] : /* istanbul ignore next */ []));
|
|
667
693
|
selectedLabels = computed(() => this.selectedItems().map(item => ({
|
|
668
694
|
label: this.bindLabel() ? item[this.bindLabel()] : item,
|
|
669
695
|
avatarUrl: this.bindAvatarUrl() ? item[this.bindAvatarUrl()] : '',
|
|
@@ -671,8 +697,10 @@ class SelectLabelMultipleComponent {
|
|
|
671
697
|
value: item,
|
|
672
698
|
network: this.bindNetwork() ? item[this.bindNetwork()] : undefined,
|
|
673
699
|
tagColor: this.bindTagColor() ? item[this.bindTagColor()] : undefined,
|
|
674
|
-
})),
|
|
675
|
-
|
|
700
|
+
})), /* @ts-ignore */
|
|
701
|
+
...(ngDevMode ? [{ debugName: "selectedLabels" }] : /* istanbul ignore next */ []));
|
|
702
|
+
hiddenCount = signal(0, /* @ts-ignore */
|
|
703
|
+
...(ngDevMode ? [{ debugName: "hiddenCount" }] : /* istanbul ignore next */ []));
|
|
676
704
|
trackByItem = (_, item) => (this.bindValue() ? item.value[this.bindValue()] : item.value);
|
|
677
705
|
mainContainer = viewChild.required('mainContainer', { read: ElementRef });
|
|
678
706
|
itemsElement = viewChildren('itemElement', { ...(ngDevMode ? { debugName: "itemsElement" } : /* istanbul ignore next */ {}), read: ElementRef });
|
|
@@ -706,25 +734,31 @@ class SelectLabelMultipleComponent {
|
|
|
706
734
|
containerEl.style.maxWidth = `${totalWidth}px`;
|
|
707
735
|
this.hiddenCount.set(hiddenCount);
|
|
708
736
|
});
|
|
709
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
710
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
737
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelMultipleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
738
|
+
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 });
|
|
711
739
|
}
|
|
712
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
740
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelMultipleComponent, decorators: [{
|
|
713
741
|
type: Component,
|
|
714
742
|
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"] }]
|
|
715
743
|
}], 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 }] }] } });
|
|
716
744
|
|
|
717
745
|
class SelectLabelSingleComponent {
|
|
718
|
-
displayType = input('text',
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
746
|
+
displayType = input('text', /* @ts-ignore */
|
|
747
|
+
...(ngDevMode ? [{ debugName: "displayType" }] : /* istanbul ignore next */ []));
|
|
748
|
+
label = input.required(/* @ts-ignore */
|
|
749
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
750
|
+
avatarUrl = input(/* @ts-ignore */
|
|
751
|
+
...(ngDevMode ? [undefined, { debugName: "avatarUrl" }] : /* istanbul ignore next */ []));
|
|
752
|
+
network = input(undefined, /* @ts-ignore */
|
|
753
|
+
...(ngDevMode ? [{ debugName: "network" }] : /* istanbul ignore next */ []));
|
|
754
|
+
showAvatarInitials = input(true, /* @ts-ignore */
|
|
755
|
+
...(ngDevMode ? [{ debugName: "showAvatarInitials" }] : /* istanbul ignore next */ []));
|
|
756
|
+
roundedAvatar = input(true, /* @ts-ignore */
|
|
757
|
+
...(ngDevMode ? [{ debugName: "roundedAvatar" }] : /* istanbul ignore next */ []));
|
|
758
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelSingleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
759
|
+
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 });
|
|
726
760
|
}
|
|
727
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
761
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectLabelSingleComponent, decorators: [{
|
|
728
762
|
type: Component,
|
|
729
763
|
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"] }]
|
|
730
764
|
}], 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 }] }] } });
|
|
@@ -740,10 +774,10 @@ class SelectSingleDirective {
|
|
|
740
774
|
throw new Error('labelTemplate is required for apSelectSingle');
|
|
741
775
|
}
|
|
742
776
|
}
|
|
743
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
744
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
777
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectSingleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
778
|
+
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"] }], ngImport: i0 });
|
|
745
779
|
}
|
|
746
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
780
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectSingleDirective, decorators: [{
|
|
747
781
|
type: Directive,
|
|
748
782
|
args: [{
|
|
749
783
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -759,8 +793,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
759
793
|
}], ctorParameters: () => [] });
|
|
760
794
|
|
|
761
795
|
class ApSelectModule {
|
|
762
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
763
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
796
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
797
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, imports: [SelectMultipleDirective,
|
|
764
798
|
SelectSingleDirective,
|
|
765
799
|
DropdownItemSingleOneLineComponent,
|
|
766
800
|
DropdownItemSingleTwoLinesComponent,
|
|
@@ -783,7 +817,7 @@ class ApSelectModule {
|
|
|
783
817
|
DropdownCreateNewComponent,
|
|
784
818
|
DropdownGroupItemComponent,
|
|
785
819
|
NgSelectModule] });
|
|
786
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
820
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, imports: [DropdownItemSingleOneLineComponent,
|
|
787
821
|
DropdownItemSingleTwoLinesComponent,
|
|
788
822
|
DropdownItemMultipleOneLineComponent,
|
|
789
823
|
DropdownItemMultipleTwoLinesComponent,
|
|
@@ -794,7 +828,7 @@ class ApSelectModule {
|
|
|
794
828
|
DropdownGroupItemComponent,
|
|
795
829
|
NgSelectModule, NgSelectModule] });
|
|
796
830
|
}
|
|
797
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
831
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ApSelectModule, decorators: [{
|
|
798
832
|
type: NgModule,
|
|
799
833
|
args: [{
|
|
800
834
|
imports: [
|