@skyux/lookup 12.22.0 → 13.0.0-alpha.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/fesm2022/skyux-lookup-testing.mjs +8 -8
- package/fesm2022/skyux-lookup-testing.mjs.map +1 -1
- package/fesm2022/skyux-lookup.mjs +73 -73
- package/fesm2022/skyux-lookup.mjs.map +1 -1
- package/index.d.ts +1239 -41
- package/package.json +17 -17
- package/testing/index.d.ts +742 -3
- package/lib/modules/autocomplete/autocomplete-adapter.service.d.ts +0 -26
- package/lib/modules/autocomplete/autocomplete-default-search-function.d.ts +0 -3
- package/lib/modules/autocomplete/autocomplete-input.directive.d.ts +0 -51
- package/lib/modules/autocomplete/autocomplete-search-async-disabled.pipe.d.ts +0 -11
- package/lib/modules/autocomplete/autocomplete.component.d.ts +0 -202
- package/lib/modules/autocomplete/autocomplete.module.d.ts +0 -16
- package/lib/modules/autocomplete/types/autocomplete-default-search-function-options.d.ts +0 -10
- package/lib/modules/autocomplete/types/autocomplete-input-text-change.d.ts +0 -6
- package/lib/modules/autocomplete/types/autocomplete-message-type.d.ts +0 -13
- package/lib/modules/autocomplete/types/autocomplete-message.d.ts +0 -10
- package/lib/modules/autocomplete/types/autocomplete-search-args.d.ts +0 -4
- package/lib/modules/autocomplete/types/autocomplete-search-async-args.d.ts +0 -35
- package/lib/modules/autocomplete/types/autocomplete-search-async-function.d.ts +0 -4
- package/lib/modules/autocomplete/types/autocomplete-search-async-result-display-type.d.ts +0 -1
- package/lib/modules/autocomplete/types/autocomplete-search-async-result.d.ts +0 -25
- package/lib/modules/autocomplete/types/autocomplete-search-context.d.ts +0 -1
- package/lib/modules/autocomplete/types/autocomplete-search-function-filter.d.ts +0 -2
- package/lib/modules/autocomplete/types/autocomplete-search-function-response.d.ts +0 -1
- package/lib/modules/autocomplete/types/autocomplete-search-function.d.ts +0 -3
- package/lib/modules/autocomplete/types/autocomplete-selection-change.d.ts +0 -6
- package/lib/modules/autocomplete/types/autocomplete-show-more-args.d.ts +0 -9
- package/lib/modules/country-field/clone-country-data.d.ts +0 -7
- package/lib/modules/country-field/country-field.component.d.ts +0 -97
- package/lib/modules/country-field/country-field.module.d.ts +0 -13
- package/lib/modules/country-field/types/country-field-context-token.d.ts +0 -6
- package/lib/modules/country-field/types/country-field-context.d.ts +0 -6
- package/lib/modules/country-field/types/country.d.ts +0 -29
- package/lib/modules/lookup/lookup-adapter.service.d.ts +0 -10
- package/lib/modules/lookup/lookup-autocomplete-adapter.d.ts +0 -78
- package/lib/modules/lookup/lookup-show-more-modal.component.d.ts +0 -57
- package/lib/modules/lookup/lookup.component.d.ts +0 -161
- package/lib/modules/lookup/lookup.module.d.ts +0 -13
- package/lib/modules/lookup/types/lookup-add-click-callback-args.d.ts +0 -16
- package/lib/modules/lookup/types/lookup-add-click-event-args.d.ts +0 -11
- package/lib/modules/lookup/types/lookup-select-mode-type.d.ts +0 -1
- package/lib/modules/lookup/types/lookup-select-mode.d.ts +0 -14
- package/lib/modules/lookup/types/lookup-show-more-config.d.ts +0 -18
- package/lib/modules/lookup/types/lookup-show-more-custom-picker-context.d.ts +0 -18
- package/lib/modules/lookup/types/lookup-show-more-custom-picker.d.ts +0 -7
- package/lib/modules/lookup/types/lookup-show-more-native-picker-config.d.ts +0 -26
- package/lib/modules/lookup/types/lookup-show-more-native-picker-context.d.ts +0 -18
- package/lib/modules/search/search-adapter.service.d.ts +0 -15
- package/lib/modules/search/search.component.d.ts +0 -90
- package/lib/modules/search/search.module.d.ts +0 -14
- package/lib/modules/selection-modal/selection-modal-item-selected.pipe.d.ts +0 -10
- package/lib/modules/selection-modal/selection-modal.component.d.ts +0 -46
- package/lib/modules/selection-modal/selection-modal.module.d.ts +0 -10
- package/lib/modules/selection-modal/selection-modal.service.d.ts +0 -18
- package/lib/modules/selection-modal/types/selection-modal-add-click-callback-args.d.ts +0 -9
- package/lib/modules/selection-modal/types/selection-modal-add-click-event-args.d.ts +0 -11
- package/lib/modules/selection-modal/types/selection-modal-close-args.d.ts +0 -14
- package/lib/modules/selection-modal/types/selection-modal-context.d.ts +0 -19
- package/lib/modules/selection-modal/types/selection-modal-instance.d.ts +0 -33
- package/lib/modules/selection-modal/types/selection-modal-open-args.d.ts +0 -70
- package/lib/modules/selection-modal/types/selection-modal-result.d.ts +0 -14
- package/lib/modules/selection-modal/types/selection-modal-search-args.d.ts +0 -21
- package/lib/modules/selection-modal/types/selection-modal-search-result.d.ts +0 -25
- package/lib/modules/shared/sky-lookup-resources.module.d.ts +0 -10
- package/lib/modules/shared/sky-lookup-string-utils.d.ts +0 -5
- package/testing/legacy/country-field/country-field-fixture.d.ts +0 -37
- package/testing/legacy/country-field/country-field-testing.module.d.ts +0 -10
- package/testing/legacy/search/search-fixture.d.ts +0 -29
- package/testing/legacy/search/search-testing.module.d.ts +0 -11
- package/testing/modules/autocomplete/autocomplete-harness-filters.d.ts +0 -6
- package/testing/modules/autocomplete/autocomplete-harness.d.ts +0 -104
- package/testing/modules/autocomplete/autocomplete-input-harness.d.ts +0 -14
- package/testing/modules/autocomplete/autocomplete-search-result-harness-filters.d.ts +0 -10
- package/testing/modules/autocomplete/autocomplete-search-result-harness.d.ts +0 -30
- package/testing/modules/country-field/country-field-harness-filters.d.ts +0 -6
- package/testing/modules/country-field/country-field-harness.d.ts +0 -92
- package/testing/modules/country-field/country-field-search-result-harness-filters.d.ts +0 -6
- package/testing/modules/country-field/country-field-search-result-harness.d.ts +0 -20
- package/testing/modules/lookup/lookup-harness-filters.d.ts +0 -6
- package/testing/modules/lookup/lookup-harness.d.ts +0 -114
- package/testing/modules/lookup/lookup-search-result-harness-filters.d.ts +0 -6
- package/testing/modules/lookup/lookup-search-result-harness.d.ts +0 -17
- package/testing/modules/lookup/lookup-selection-harness.d.ts +0 -6
- package/testing/modules/lookup/lookup-selections-list-harness.d.ts +0 -20
- package/testing/modules/lookup/lookup-show-more-picker-harness-filters.d.ts +0 -6
- package/testing/modules/lookup/lookup-show-more-picker-harness.d.ts +0 -23
- package/testing/modules/lookup/lookup-show-more-picker-search-result-harness-filters.d.ts +0 -6
- package/testing/modules/lookup/lookup-show-more-picker-search-result-harness.d.ts +0 -6
- package/testing/modules/search/search-harness-filters.d.ts +0 -6
- package/testing/modules/search/search-harness.d.ts +0 -78
- package/testing/modules/selection-modal/selection-modal-harness.d.ts +0 -85
- package/testing/modules/selection-modal/selection-modal-search-result-harness-filters.d.ts +0 -6
- package/testing/modules/selection-modal/selection-modal-search-result-harness.d.ts +0 -6
- package/testing/public-api.d.ts +0 -28
package/index.d.ts
CHANGED
|
@@ -1,41 +1,1239 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { RendererFactory2, ElementRef, OnInit, OnDestroy, AfterViewInit, TemplateRef, EventEmitter, ChangeDetectorRef, PipeTransform, Injector, InjectionToken, Renderer2, OnChanges, SimpleChanges } from '@angular/core';
|
|
3
|
+
import * as i6 from '@skyux/core';
|
|
4
|
+
import { SkyCoreAdapterService, SkyOverlayInstance, SkyAffixService, SkyOverlayService, SkyStackingContext, SkyContentInfo } from '@skyux/core';
|
|
5
|
+
import * as i3$1 from '@skyux/forms';
|
|
6
|
+
import { SkyInputBoxHostService } from '@skyux/forms';
|
|
7
|
+
import { Observable, Subject } from 'rxjs';
|
|
8
|
+
import * as i3 from '@angular/forms';
|
|
9
|
+
import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors, UntypedFormControl, NgControl } from '@angular/forms';
|
|
10
|
+
import * as i2 from '@angular/common';
|
|
11
|
+
import * as i7 from '@skyux/indicators';
|
|
12
|
+
import { SkyToken, SkyTokensMessage } from '@skyux/indicators';
|
|
13
|
+
import * as i8 from '@skyux/icon';
|
|
14
|
+
import * as i1 from '@skyux/i18n';
|
|
15
|
+
import * as i7$1 from '@skyux/theme';
|
|
16
|
+
import { SkyThemeService } from '@skyux/theme';
|
|
17
|
+
import { AnimationEvent } from '@angular/animations';
|
|
18
|
+
import { SkyModalService } from '@skyux/modals';
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* @internal
|
|
22
|
+
*/
|
|
23
|
+
declare class SkyAutocompleteAdapterService {
|
|
24
|
+
#private;
|
|
25
|
+
constructor(coreAdapterService: SkyCoreAdapterService, rendererFactory: RendererFactory2);
|
|
26
|
+
/**
|
|
27
|
+
* Adds the className for the provided element.
|
|
28
|
+
*/
|
|
29
|
+
addCSSClass(element: HTMLElement, className: string): void;
|
|
30
|
+
getOverlayFocusableElements(overlay: SkyOverlayInstance): HTMLElement[];
|
|
31
|
+
/**
|
|
32
|
+
* Removes the className for the provided element.
|
|
33
|
+
*/
|
|
34
|
+
removeCSSClass(element: HTMLElement, className: string): void;
|
|
35
|
+
setDropdownWidth(elementRef: ElementRef, dropdownRef: ElementRef, isInputBox: boolean): void;
|
|
36
|
+
/**
|
|
37
|
+
* Sets the `tabIndex` of the `element` to the provided `tabIndex`.
|
|
38
|
+
*/
|
|
39
|
+
setTabIndex(element: HTMLElement, tabIndex: number): void;
|
|
40
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyAutocompleteAdapterService, never>;
|
|
41
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<SkyAutocompleteAdapterService>;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* @internal
|
|
46
|
+
*/
|
|
47
|
+
interface SkyAutocompleteInputTextChange {
|
|
48
|
+
value?: string;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
declare class SkyAutocompleteInputDirective implements OnInit, OnDestroy, ControlValueAccessor, Validator {
|
|
52
|
+
#private;
|
|
53
|
+
/**
|
|
54
|
+
* The value for the `autocomplete` attribute on the form input.
|
|
55
|
+
* @default "off"
|
|
56
|
+
* @deprecated SKY UX only supports browser autofill on components where the direct input matches the return value. This input may not behave as expected due to the dropdown selection interaction.
|
|
57
|
+
*/
|
|
58
|
+
set autocompleteAttribute(value: string | undefined);
|
|
59
|
+
get autocompleteAttribute(): string;
|
|
60
|
+
/**
|
|
61
|
+
* Whether to disable the autocomplete field on template-driven forms. Don't use this input on reactive forms because they may overwrite the input or leave the control out of sync.
|
|
62
|
+
* To set the disabled state on reactive forms, use the `FormControl` instead.
|
|
63
|
+
* @default false
|
|
64
|
+
*/
|
|
65
|
+
set disabled(value: boolean | undefined);
|
|
66
|
+
get disabled(): boolean;
|
|
67
|
+
get blur(): Observable<void>;
|
|
68
|
+
get displayWith(): string;
|
|
69
|
+
set displayWith(value: string);
|
|
70
|
+
get focus(): Observable<void>;
|
|
71
|
+
get inputTextValue(): string;
|
|
72
|
+
set inputTextValue(value: string);
|
|
73
|
+
get textChanges(): Observable<SkyAutocompleteInputTextChange>;
|
|
74
|
+
get value(): any;
|
|
75
|
+
set value(value: any);
|
|
76
|
+
constructor();
|
|
77
|
+
ngOnInit(): void;
|
|
78
|
+
ngOnDestroy(): void;
|
|
79
|
+
writeValue(value: any): void;
|
|
80
|
+
registerOnChange(fn: (value: any) => void): void;
|
|
81
|
+
registerOnTouched(fn: () => void): void;
|
|
82
|
+
registerOnValidatorChange(fn: () => void): void;
|
|
83
|
+
restoreInputTextValueToPreviousState(): void;
|
|
84
|
+
setDisabledState(disabled: boolean): void;
|
|
85
|
+
validate(control: AbstractControl): ValidationErrors | null;
|
|
86
|
+
setActiveDescendant(descendantId: string | null): void;
|
|
87
|
+
/**
|
|
88
|
+
* Used to connect the input to the overlay.
|
|
89
|
+
*/
|
|
90
|
+
setAriaControls(overlayId: string | null): void;
|
|
91
|
+
onChange(value: any): void;
|
|
92
|
+
onTouched(): void;
|
|
93
|
+
onValidatorChange: () => void;
|
|
94
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyAutocompleteInputDirective, never>;
|
|
95
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<SkyAutocompleteInputDirective, "input[skyAutocomplete], textarea[skyAutocomplete]", never, { "autocompleteAttribute": { "alias": "autocompleteAttribute"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, false, never>;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
/**
|
|
99
|
+
* @internal
|
|
100
|
+
*/
|
|
101
|
+
declare enum SkyAutocompleteMessageType {
|
|
102
|
+
/**
|
|
103
|
+
* Closes the dropdown.
|
|
104
|
+
*/
|
|
105
|
+
CloseDropdown = 0,
|
|
106
|
+
/**
|
|
107
|
+
* Repositions the dropdown.
|
|
108
|
+
*/
|
|
109
|
+
RepositionDropdown = 1
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
/**
|
|
113
|
+
* @internal
|
|
114
|
+
*/
|
|
115
|
+
interface SkyAutocompleteMessage {
|
|
116
|
+
/**
|
|
117
|
+
* The type of message.
|
|
118
|
+
*/
|
|
119
|
+
type?: SkyAutocompleteMessageType;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
/**
|
|
123
|
+
* The result of searching for items to display in an autocomplete or lookup field.
|
|
124
|
+
*/
|
|
125
|
+
interface SkyAutocompleteSearchAsyncResult {
|
|
126
|
+
/**
|
|
127
|
+
* Data provided on "load more" search result requests. Use this property for
|
|
128
|
+
* information such as a continuation token for paged database queries.
|
|
129
|
+
*/
|
|
130
|
+
continuationData?: unknown;
|
|
131
|
+
/**
|
|
132
|
+
* Whether there are more results that match the search criteria.
|
|
133
|
+
*/
|
|
134
|
+
hasMore?: boolean;
|
|
135
|
+
/**
|
|
136
|
+
* A list of items matching the search criteria. When there are more items that match
|
|
137
|
+
* the search criteria, set the `hasMore` property to `true` more records can be lazy-loaded
|
|
138
|
+
* as the user scrolls through the search results.
|
|
139
|
+
*/
|
|
140
|
+
items: unknown[];
|
|
141
|
+
/**
|
|
142
|
+
* The total number of records that match the search criteria, including items not returned in
|
|
143
|
+
* the current list of items.
|
|
144
|
+
*/
|
|
145
|
+
totalCount: number;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
type AutocompleteSearchAsyncResultDisplayType = 'popover' | 'modal';
|
|
149
|
+
|
|
150
|
+
/**
|
|
151
|
+
* Arguments passed when an asynchronous search is executed from the
|
|
152
|
+
* autocomplete or lookup component.
|
|
153
|
+
*/
|
|
154
|
+
interface SkyAutocompleteSearchAsyncArgs {
|
|
155
|
+
/**
|
|
156
|
+
* The search text entered by the user.
|
|
157
|
+
*/
|
|
158
|
+
searchText: string;
|
|
159
|
+
/**
|
|
160
|
+
* How the search results will be displayed. Use this value to determine
|
|
161
|
+
* how many results to return.
|
|
162
|
+
*/
|
|
163
|
+
displayType: AutocompleteSearchAsyncResultDisplayType;
|
|
164
|
+
/**
|
|
165
|
+
* The offset index of the first result to return. When search is executed
|
|
166
|
+
* as a result of an infinite scroll event, for example, offset will be set
|
|
167
|
+
* to the number of items already displayed.
|
|
168
|
+
*/
|
|
169
|
+
offset: number;
|
|
170
|
+
/**
|
|
171
|
+
* A continuation token which can be set and then will be passed back with any future searches.
|
|
172
|
+
* This is helpful for applications which utilize a token instead of an offset when fetching data.
|
|
173
|
+
*/
|
|
174
|
+
continuationData?: unknown;
|
|
175
|
+
/**
|
|
176
|
+
* An Observable representing the search results. Consumers should set this
|
|
177
|
+
* when the event fires so the autocomplete or lookup component can subscribe
|
|
178
|
+
* to it and then display the results.
|
|
179
|
+
*/
|
|
180
|
+
result?: Observable<SkyAutocompleteSearchAsyncResult>;
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
type SkyAutocompleteSearchContext = 'popover' | 'modal';
|
|
184
|
+
|
|
185
|
+
interface SkyAutocompleteSearchArgs {
|
|
186
|
+
context?: SkyAutocompleteSearchContext;
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
type SkyAutocompleteSearchFunctionResponse = any[] | Promise<any[]>;
|
|
190
|
+
|
|
191
|
+
type SkyAutocompleteSearchFunction = (searchText: string, data: any[], args?: SkyAutocompleteSearchArgs) => SkyAutocompleteSearchFunctionResponse;
|
|
192
|
+
|
|
193
|
+
type SkyAutocompleteSearchFunctionFilter = (searchText: string, item: any, args?: SkyAutocompleteSearchArgs) => boolean;
|
|
194
|
+
|
|
195
|
+
interface SkyAutocompleteSelectionChange {
|
|
196
|
+
/**
|
|
197
|
+
* The search result object that users select in the dropdown list.
|
|
198
|
+
*/
|
|
199
|
+
selectedItem?: any;
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
/**
|
|
203
|
+
* @internal
|
|
204
|
+
*/
|
|
205
|
+
interface SkyAutocompleteShowMoreArgs {
|
|
206
|
+
/**
|
|
207
|
+
* Returns the value of the input element when the show more event is triggered.
|
|
208
|
+
*/
|
|
209
|
+
inputValue: string;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
/**
|
|
213
|
+
* @internal
|
|
214
|
+
*/
|
|
215
|
+
interface SkyAutocompleteSearchResult {
|
|
216
|
+
elementId: string;
|
|
217
|
+
data: any;
|
|
218
|
+
}
|
|
219
|
+
declare class SkyAutocompleteComponent implements OnDestroy, AfterViewInit {
|
|
220
|
+
#private;
|
|
221
|
+
/**
|
|
222
|
+
* The HTML element ID of the element that labels
|
|
223
|
+
* the autocomplete text input. This sets the input's `aria-labelledby` attribute to provide a text equivalent for screen readers
|
|
224
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
225
|
+
* For more information about the `aria-labelledby` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-labelledby).
|
|
226
|
+
*/
|
|
227
|
+
ariaLabelledBy: string | undefined;
|
|
228
|
+
/**
|
|
229
|
+
* The static data source for the autocomplete component to search
|
|
230
|
+
* when users enter text. For a dynamic data source such as an array that
|
|
231
|
+
* changes due to server calls, use `search` or `searchAsync` instead.
|
|
232
|
+
*/
|
|
233
|
+
set data(value: any[] | undefined);
|
|
234
|
+
get data(): any[];
|
|
235
|
+
/**
|
|
236
|
+
* How many milliseconds to wait before searching while users
|
|
237
|
+
* enter text in the autocomplete field.
|
|
238
|
+
* @default 0
|
|
239
|
+
*/
|
|
240
|
+
set debounceTime(value: number | undefined);
|
|
241
|
+
get debounceTime(): number;
|
|
242
|
+
/**
|
|
243
|
+
* The object property to display in the text input after users
|
|
244
|
+
* select an item in the dropdown list.
|
|
245
|
+
* @default "name"
|
|
246
|
+
*/
|
|
247
|
+
set descriptorProperty(value: string | undefined);
|
|
248
|
+
get descriptorProperty(): string;
|
|
249
|
+
/**
|
|
250
|
+
* Hint text to show in the dropdown
|
|
251
|
+
* @internal
|
|
252
|
+
*/
|
|
253
|
+
dropdownHintText: string | undefined;
|
|
254
|
+
/**
|
|
255
|
+
* @internal
|
|
256
|
+
* Whether to display a button in the dropdown that opens a picker where users can view all options.
|
|
257
|
+
*/
|
|
258
|
+
set enableShowMore(value: boolean | undefined);
|
|
259
|
+
get enableShowMore(): boolean;
|
|
260
|
+
/**
|
|
261
|
+
* The observable of `SkyAutocompleteMessage` that can close the dropdown.
|
|
262
|
+
* @internal
|
|
263
|
+
*/
|
|
264
|
+
set messageStream(value: Subject<SkyAutocompleteMessage> | undefined);
|
|
265
|
+
get messageStream(): Subject<SkyAutocompleteMessage>;
|
|
266
|
+
/**
|
|
267
|
+
* @internal
|
|
268
|
+
*/
|
|
269
|
+
wrapperClass: string | undefined;
|
|
270
|
+
/**
|
|
271
|
+
* The object properties to search.
|
|
272
|
+
* @default ["name"]
|
|
273
|
+
* @deprecated We recommend against using this property. To search specific properties, use the `searchAsync` event instead.
|
|
274
|
+
*/
|
|
275
|
+
set propertiesToSearch(value: string[] | undefined);
|
|
276
|
+
get propertiesToSearch(): string[];
|
|
277
|
+
/**
|
|
278
|
+
* The function that dynamically manages the data source when users
|
|
279
|
+
* change the text in the autocomplete field. The search function must return
|
|
280
|
+
* an array or a promise of an array. The `search` property is particularly
|
|
281
|
+
* useful when the data source does not live in the source code.
|
|
282
|
+
* @deprecated We recommend against using this property. To call a remote data source, use the `searchAsync` event instead.
|
|
283
|
+
*/
|
|
284
|
+
set search(value: SkyAutocompleteSearchFunction | undefined);
|
|
285
|
+
get search(): SkyAutocompleteSearchFunction | undefined;
|
|
286
|
+
/**
|
|
287
|
+
* The template that formats each search result in the dropdown list.
|
|
288
|
+
* The autocomplete component injects search result values into the template
|
|
289
|
+
* as `item` variables that reference all of the object properties of the search results.
|
|
290
|
+
*/
|
|
291
|
+
searchResultTemplate: TemplateRef<unknown> | undefined;
|
|
292
|
+
/**
|
|
293
|
+
* The minimum number of characters that users must enter before
|
|
294
|
+
* the autocomplete component searches the data source and displays search
|
|
295
|
+
* results in the dropdown list.
|
|
296
|
+
* @default 1
|
|
297
|
+
*/
|
|
298
|
+
set searchTextMinimumCharacters(value: number | undefined);
|
|
299
|
+
get searchTextMinimumCharacters(): number;
|
|
300
|
+
/**
|
|
301
|
+
* The array of functions to call against each search result in order
|
|
302
|
+
* to filter the search results when using the default search function. When
|
|
303
|
+
* using the `search` property to specify a custom search function, you must
|
|
304
|
+
* manually apply filters inside that function. The function must return `true`
|
|
305
|
+
* or `false` for each result to indicate whether to display it in the dropdown list.
|
|
306
|
+
* @deprecated We recommend against using this property. To filter results, use the `searchAsync` event instead.
|
|
307
|
+
*/
|
|
308
|
+
set searchFilters(value: SkyAutocompleteSearchFunctionFilter[] | undefined);
|
|
309
|
+
get searchFilters(): SkyAutocompleteSearchFunctionFilter[] | undefined;
|
|
310
|
+
/**
|
|
311
|
+
* The maximum number of search results to display in the dropdown list.
|
|
312
|
+
* By default, the component displays all matching results.
|
|
313
|
+
*/
|
|
314
|
+
set searchResultsLimit(value: number | undefined);
|
|
315
|
+
get searchResultsLimit(): number;
|
|
316
|
+
/**
|
|
317
|
+
* @internal
|
|
318
|
+
* Whether to display a button that lets users add options to the data source.
|
|
319
|
+
* @default false
|
|
320
|
+
*/
|
|
321
|
+
set showAddButton(value: boolean | undefined);
|
|
322
|
+
get showAddButton(): boolean;
|
|
323
|
+
/**
|
|
324
|
+
* The text to display when no search results are found.
|
|
325
|
+
* @default "No matches found"
|
|
326
|
+
*/
|
|
327
|
+
noResultsFoundText: string | undefined;
|
|
328
|
+
/**
|
|
329
|
+
* @internal
|
|
330
|
+
* Allows async search to be disabled even when a listener is specified for
|
|
331
|
+
* the `searchAsync` output.
|
|
332
|
+
* @default false
|
|
333
|
+
*/
|
|
334
|
+
searchAsyncDisabled: boolean | undefined;
|
|
335
|
+
/**
|
|
336
|
+
* Allows the user to specify arbitrary values not in the search results.
|
|
337
|
+
* @default false
|
|
338
|
+
*/
|
|
339
|
+
allowAnyValue: i0.InputSignalWithTransform<boolean, unknown>;
|
|
340
|
+
/**
|
|
341
|
+
* Highlights the search text in each search result. Set this to false
|
|
342
|
+
* when your search finds results that are not exact text matches, e.g.
|
|
343
|
+
* returning "Bob" for the term "Robert."
|
|
344
|
+
* @default true
|
|
345
|
+
*/
|
|
346
|
+
highlightSearchText: i0.InputSignalWithTransform<boolean, unknown>;
|
|
347
|
+
/**
|
|
348
|
+
* @internal
|
|
349
|
+
* Fires when users select the button to add options to the data source.
|
|
350
|
+
*/
|
|
351
|
+
addClick: EventEmitter<void>;
|
|
352
|
+
/**
|
|
353
|
+
* @internal
|
|
354
|
+
* Fires when users select the button to view all options.
|
|
355
|
+
*/
|
|
356
|
+
showMoreClick: EventEmitter<SkyAutocompleteShowMoreArgs>;
|
|
357
|
+
/**
|
|
358
|
+
* Fires when users select items in the dropdown list.
|
|
359
|
+
*/
|
|
360
|
+
selectionChange: EventEmitter<SkyAutocompleteSelectionChange>;
|
|
361
|
+
/**
|
|
362
|
+
* Fires when users enter new search information and allows results to be
|
|
363
|
+
* returned via an observable.
|
|
364
|
+
*/
|
|
365
|
+
searchAsync: EventEmitter<SkyAutocompleteSearchAsyncArgs>;
|
|
366
|
+
/**
|
|
367
|
+
* @internal
|
|
368
|
+
*/
|
|
369
|
+
openChange: EventEmitter<boolean>;
|
|
370
|
+
get searchResults(): SkyAutocompleteSearchResult[];
|
|
371
|
+
set searchResults(value: SkyAutocompleteSearchResult[]);
|
|
372
|
+
get highlightText(): string[];
|
|
373
|
+
set highlightText(value: string[]);
|
|
374
|
+
isOpen: boolean;
|
|
375
|
+
resultsListId: string;
|
|
376
|
+
resultsWrapperId: string;
|
|
377
|
+
searchText: string;
|
|
378
|
+
get showActionsArea(): boolean;
|
|
379
|
+
isSearchingAsync: boolean;
|
|
380
|
+
searchResultsCount: number | undefined;
|
|
381
|
+
set inputDirective(directive: SkyAutocompleteInputDirective | undefined);
|
|
382
|
+
get inputDirective(): SkyAutocompleteInputDirective | undefined;
|
|
383
|
+
resultsTemplateRef: TemplateRef<unknown> | undefined;
|
|
384
|
+
set resultsRef(value: ElementRef | undefined);
|
|
385
|
+
get resultsRef(): ElementRef | undefined;
|
|
386
|
+
searchOrDefault: SkyAutocompleteSearchFunction;
|
|
387
|
+
protected isResultsVisible: Observable<boolean>;
|
|
388
|
+
constructor(changeDetector: ChangeDetectorRef, elementRef: ElementRef, affixService: SkyAffixService, adapterService: SkyAutocompleteAdapterService, overlayService: SkyOverlayService, inputBoxHostSvc?: SkyInputBoxHostService, stackingContext?: SkyStackingContext);
|
|
389
|
+
ngAfterViewInit(): void;
|
|
390
|
+
ngOnDestroy(): void;
|
|
391
|
+
addButtonClicked(): void;
|
|
392
|
+
handleKeydown(event: KeyboardEvent): void;
|
|
393
|
+
moreButtonClicked(): void;
|
|
394
|
+
onResultClick(id: string, event: MouseEvent): void;
|
|
395
|
+
onResultMouseMove(id: number): void;
|
|
396
|
+
isElementFocused(ref: HTMLElement): boolean;
|
|
397
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyAutocompleteComponent, [null, null, null, null, null, { optional: true; }, { optional: true; }]>;
|
|
398
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkyAutocompleteComponent, "sky-autocomplete", never, { "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "data": { "alias": "data"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "descriptorProperty": { "alias": "descriptorProperty"; "required": false; }; "dropdownHintText": { "alias": "dropdownHintText"; "required": false; }; "enableShowMore": { "alias": "enableShowMore"; "required": false; }; "messageStream": { "alias": "messageStream"; "required": false; }; "wrapperClass": { "alias": "wrapperClass"; "required": false; }; "propertiesToSearch": { "alias": "propertiesToSearch"; "required": false; }; "search": { "alias": "search"; "required": false; }; "searchResultTemplate": { "alias": "searchResultTemplate"; "required": false; }; "searchTextMinimumCharacters": { "alias": "searchTextMinimumCharacters"; "required": false; }; "searchFilters": { "alias": "searchFilters"; "required": false; }; "searchResultsLimit": { "alias": "searchResultsLimit"; "required": false; }; "showAddButton": { "alias": "showAddButton"; "required": false; }; "noResultsFoundText": { "alias": "noResultsFoundText"; "required": false; }; "searchAsyncDisabled": { "alias": "searchAsyncDisabled"; "required": false; }; "allowAnyValue": { "alias": "allowAnyValue"; "required": false; "isSignal": true; }; "highlightSearchText": { "alias": "highlightSearchText"; "required": false; "isSignal": true; }; }, { "addClick": "addClick"; "showMoreClick": "showMoreClick"; "selectionChange": "selectionChange"; "searchAsync": "searchAsync"; "openChange": "openChange"; }, ["inputDirective"], ["*"], false, never>;
|
|
399
|
+
}
|
|
400
|
+
|
|
401
|
+
/**
|
|
402
|
+
* @internal
|
|
403
|
+
*/
|
|
404
|
+
declare class SkyAutocompleteSearchAsyncDisabledPipe implements PipeTransform {
|
|
405
|
+
transform(searchAsync: EventEmitter<SkyAutocompleteSearchAsyncArgs>, searchAsyncDisabled: boolean | undefined): boolean;
|
|
406
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyAutocompleteSearchAsyncDisabledPipe, never>;
|
|
407
|
+
static ɵpipe: i0.ɵɵPipeDeclaration<SkyAutocompleteSearchAsyncDisabledPipe, "skyAutocompleteSearchAsyncDisabled", false>;
|
|
408
|
+
}
|
|
409
|
+
|
|
410
|
+
/**
|
|
411
|
+
* Import into any component library module that needs to use resource strings.
|
|
412
|
+
*/
|
|
413
|
+
declare class SkyLookupResourcesModule {
|
|
414
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyLookupResourcesModule, never>;
|
|
415
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkyLookupResourcesModule, never, never, [typeof i1.SkyI18nModule]>;
|
|
416
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkyLookupResourcesModule>;
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
declare class SkyAutocompleteModule {
|
|
420
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyAutocompleteModule, never>;
|
|
421
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkyAutocompleteModule, [typeof SkyAutocompleteComponent, typeof SkyAutocompleteInputDirective, typeof SkyAutocompleteSearchAsyncDisabledPipe], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i6.SkyAffixModule, typeof i7.SkyTextHighlightModule, typeof i8.SkyIconModule, typeof i6.SkyIdModule, typeof SkyLookupResourcesModule, typeof i6.SkyNumericModule, typeof i7$1.SkyThemeModule, typeof i7.SkyWaitModule], [typeof SkyAutocompleteComponent, typeof SkyAutocompleteInputDirective]>;
|
|
422
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkyAutocompleteModule>;
|
|
423
|
+
}
|
|
424
|
+
|
|
425
|
+
/**
|
|
426
|
+
* @internal
|
|
427
|
+
*/
|
|
428
|
+
interface SkyAutocompleteDefaultSearchFunctionOptions {
|
|
429
|
+
propertiesToSearch: string[];
|
|
430
|
+
searchFilters?: SkyAutocompleteSearchFunctionFilter[];
|
|
431
|
+
/** @deprecated */
|
|
432
|
+
searchResultsLimit?: number;
|
|
433
|
+
}
|
|
434
|
+
|
|
435
|
+
/**
|
|
436
|
+
* Represents the data for a given country.
|
|
437
|
+
*/
|
|
438
|
+
interface SkyCountryFieldCountry {
|
|
439
|
+
/**
|
|
440
|
+
* The [International Organization for Standardization Alpha 2](https://www.nationsonline.org/oneworld/country_code_list.htm)
|
|
441
|
+
* country code for the country.
|
|
442
|
+
* @required
|
|
443
|
+
*/
|
|
444
|
+
iso2: string;
|
|
445
|
+
/**
|
|
446
|
+
* The name of the country.
|
|
447
|
+
*/
|
|
448
|
+
name?: string;
|
|
449
|
+
/**
|
|
450
|
+
* The country's international dial code.
|
|
451
|
+
* This property is only set when the country field is within a phone field.
|
|
452
|
+
* @internal
|
|
453
|
+
*/
|
|
454
|
+
dialCode?: string;
|
|
455
|
+
/**
|
|
456
|
+
* @internal
|
|
457
|
+
*/
|
|
458
|
+
areaCodes?: string[];
|
|
459
|
+
/**
|
|
460
|
+
* @internal
|
|
461
|
+
*/
|
|
462
|
+
priority?: number;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
/**
|
|
466
|
+
* @internal
|
|
467
|
+
*/
|
|
468
|
+
interface SkyCountryFieldContext {
|
|
469
|
+
inPhoneField: boolean;
|
|
470
|
+
}
|
|
471
|
+
|
|
472
|
+
declare class SkyCountryFieldComponent implements ControlValueAccessor, OnDestroy, OnInit, Validator {
|
|
473
|
+
#private;
|
|
474
|
+
inputBoxHostSvc?: SkyInputBoxHostService | undefined;
|
|
475
|
+
/**
|
|
476
|
+
* The value for the HTML `autocomplete` attribute on the form input.
|
|
477
|
+
* @default 'off'
|
|
478
|
+
* @deprecated SKY UX only supports browser autofill on components where the direct input matches the return value. This input may not behave as expected due to the dropdown selection interaction.
|
|
479
|
+
*/
|
|
480
|
+
autocompleteAttribute: string | undefined;
|
|
481
|
+
/**
|
|
482
|
+
* The [International Organization for Standardization Alpha 2](https://www.nationsonline.org/oneworld/country_code_list.htm)
|
|
483
|
+
* country code for the default country.
|
|
484
|
+
* When search results include the default country, it appears at the top of the list.
|
|
485
|
+
* @default "us"
|
|
486
|
+
*/
|
|
487
|
+
set defaultCountry(value: string | undefined);
|
|
488
|
+
get defaultCountry(): string | undefined;
|
|
489
|
+
/**
|
|
490
|
+
* Whether to disable the country field on template-driven forms. Don't use this input on reactive forms because they may overwrite the input or leave the control out of sync.
|
|
491
|
+
* To set the disabled state on reactive forms, use the `FormControl` instead.
|
|
492
|
+
* @default false
|
|
493
|
+
*/
|
|
494
|
+
set disabled(isDisabled: boolean | undefined);
|
|
495
|
+
get disabled(): boolean;
|
|
496
|
+
/**
|
|
497
|
+
* The [International Organization for Standardization Alpha 2](https://www.nationsonline.org/oneworld/country_code_list.htm)
|
|
498
|
+
* country codes for the countries that users can select. By default, all countries are available.
|
|
499
|
+
*/
|
|
500
|
+
set supportedCountryISOs(value: string[] | undefined);
|
|
501
|
+
get supportedCountryISOs(): string[];
|
|
502
|
+
/**
|
|
503
|
+
* Fires when the selected country changes.
|
|
504
|
+
*/
|
|
505
|
+
selectedCountryChange: EventEmitter<SkyCountryFieldCountry>;
|
|
506
|
+
/**
|
|
507
|
+
* Fires when the country field is focused out.
|
|
508
|
+
* @internal
|
|
509
|
+
*/
|
|
510
|
+
countryFieldFocusout: EventEmitter<FocusEvent>;
|
|
511
|
+
countries: SkyCountryFieldCountry[];
|
|
512
|
+
countrySearchFormControl: UntypedFormControl;
|
|
513
|
+
searchTextMinimumCharacters: number;
|
|
514
|
+
countrySearchAutocompleteDirective: SkyAutocompleteInputDirective | undefined;
|
|
515
|
+
set selectedCountry(newCountry: SkyCountryFieldCountry | undefined);
|
|
516
|
+
get selectedCountry(): SkyCountryFieldCountry | undefined;
|
|
517
|
+
context: SkyCountryFieldContext | null;
|
|
518
|
+
inputId: string;
|
|
519
|
+
protected ariaDescribedBy: Observable<string | undefined> | undefined;
|
|
520
|
+
inputTemplateRef: TemplateRef<unknown> | undefined;
|
|
521
|
+
constructor(changeDetector: ChangeDetectorRef, injector: Injector, inputBoxHostSvc?: SkyInputBoxHostService | undefined);
|
|
522
|
+
/**
|
|
523
|
+
* Angular lifecycle hook for when the component is initialized
|
|
524
|
+
* @internal
|
|
525
|
+
*/
|
|
526
|
+
ngOnInit(): void;
|
|
527
|
+
/**
|
|
528
|
+
* Angular lifecycle hook for when the component is destructed.
|
|
529
|
+
* @internal
|
|
530
|
+
*/
|
|
531
|
+
ngOnDestroy(): void;
|
|
532
|
+
/**
|
|
533
|
+
* Sets the component's touched value when the autocomplete is blurred
|
|
534
|
+
* @internal
|
|
535
|
+
*/
|
|
536
|
+
onAutocompleteBlur(): void;
|
|
537
|
+
/**
|
|
538
|
+
* Sets the country to validate against based on the county's iso2 code.
|
|
539
|
+
* @param newCountry The International Organization for Standardization's two-letter code
|
|
540
|
+
* for the default country.
|
|
541
|
+
* @internal
|
|
542
|
+
*/
|
|
543
|
+
onCountrySelected(newCountry: SkyAutocompleteSelectionChange): void;
|
|
544
|
+
/**
|
|
545
|
+
* Called when the Autocomplete textarea loses focus
|
|
546
|
+
* @internal
|
|
547
|
+
*/
|
|
548
|
+
onAutocompleteFocusout(e: FocusEvent): void;
|
|
549
|
+
onChange: (value: SkyCountryFieldCountry | undefined) => void;
|
|
550
|
+
onTouched: () => void;
|
|
551
|
+
registerOnChange(fn: (value: SkyCountryFieldCountry | undefined) => void): void;
|
|
552
|
+
registerOnTouched(fn: () => void): void;
|
|
553
|
+
setDisabledState(disabled: boolean): void;
|
|
554
|
+
validate(control: AbstractControl): ValidationErrors | null;
|
|
555
|
+
writeValue(value: SkyCountryFieldCountry | undefined): void;
|
|
556
|
+
protected onFocus($event: FocusEvent): void;
|
|
557
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyCountryFieldComponent, [null, null, { optional: true; }]>;
|
|
558
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkyCountryFieldComponent, "sky-country-field", never, { "autocompleteAttribute": { "alias": "autocompleteAttribute"; "required": false; }; "defaultCountry": { "alias": "defaultCountry"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "supportedCountryISOs": { "alias": "supportedCountryISOs"; "required": false; }; }, { "selectedCountryChange": "selectedCountryChange"; "countryFieldFocusout": "countryFieldFocusout"; }, never, never, false, never>;
|
|
559
|
+
}
|
|
560
|
+
|
|
561
|
+
declare class SkyCountryFieldModule {
|
|
562
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyCountryFieldModule, never>;
|
|
563
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkyCountryFieldModule, [typeof SkyCountryFieldComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i3.ReactiveFormsModule, typeof SkyAutocompleteModule, typeof i8.SkyIconModule, typeof SkyLookupResourcesModule, typeof i7$1.SkyThemeModule], [typeof SkyCountryFieldComponent]>;
|
|
564
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkyCountryFieldModule>;
|
|
565
|
+
}
|
|
566
|
+
|
|
567
|
+
/**
|
|
568
|
+
* @internal
|
|
569
|
+
*/
|
|
570
|
+
declare const SKY_COUNTRY_FIELD_CONTEXT: InjectionToken<SkyCountryFieldContext>;
|
|
571
|
+
|
|
572
|
+
/**
|
|
573
|
+
* @internal
|
|
574
|
+
*/
|
|
575
|
+
declare class SkyLookupAutocompleteAdapter {
|
|
576
|
+
#private;
|
|
577
|
+
/**
|
|
578
|
+
* How many milliseconds to wait before searching while users
|
|
579
|
+
* enter text in the lookup field.
|
|
580
|
+
* @default 0
|
|
581
|
+
*/
|
|
582
|
+
debounceTime: number | undefined;
|
|
583
|
+
/**
|
|
584
|
+
* The object property to display in the text input after users
|
|
585
|
+
* select an item in the dropdown list.
|
|
586
|
+
* @default "name"
|
|
587
|
+
*/
|
|
588
|
+
set descriptorProperty(value: string | undefined);
|
|
589
|
+
get descriptorProperty(): string;
|
|
590
|
+
/**
|
|
591
|
+
* The array of object properties to search when utilizing the `data` property and the built-in search function.
|
|
592
|
+
* @default ["name"]
|
|
593
|
+
* @deprecated Use the `searchAsync` event emitter and callback instead to provide data to the lookup component.
|
|
594
|
+
*/
|
|
595
|
+
set propertiesToSearch(value: string[] | undefined);
|
|
596
|
+
get propertiesToSearch(): string[];
|
|
597
|
+
/**
|
|
598
|
+
* The function to dynamically manage the data source when users
|
|
599
|
+
* change the text in the lookup field. The search function must return
|
|
600
|
+
* an array or a promise of an array. The `search` property is particularly
|
|
601
|
+
* useful when the data source does not live in the source code.
|
|
602
|
+
* @deprecated Use the `searchAsync` event emitter and callback instead to provide searched data to the lookup component.
|
|
603
|
+
*/
|
|
604
|
+
set search(value: SkyAutocompleteSearchFunction | undefined);
|
|
605
|
+
get search(): SkyAutocompleteSearchFunction | undefined;
|
|
606
|
+
/**
|
|
607
|
+
* The template that formats each option in the dropdown list. The lookup component
|
|
608
|
+
* injects values into the template as `item` variables that reference all the object
|
|
609
|
+
* properties of the options.
|
|
610
|
+
*/
|
|
611
|
+
searchResultTemplate: TemplateRef<unknown> | undefined;
|
|
612
|
+
/**
|
|
613
|
+
* The minimum number of characters that users must enter before
|
|
614
|
+
* the lookup component searches the data source and displays search results
|
|
615
|
+
* in the dropdown list.
|
|
616
|
+
* @default 1
|
|
617
|
+
*/
|
|
618
|
+
searchTextMinimumCharacters: number | undefined;
|
|
619
|
+
/**
|
|
620
|
+
* The array of functions to call against each search result in order
|
|
621
|
+
* to filter the search results when using the `data` input and the default search function. When
|
|
622
|
+
* using a custom search function via the `search` property filters must be
|
|
623
|
+
* applied manually inside that function. The function must return `true` or
|
|
624
|
+
* `false` for each result to indicate whether to display it in the dropdown list.
|
|
625
|
+
* @deprecated Use the `searchAsync` event emitter and callback instead to provide searched data to the lookup component.
|
|
626
|
+
*/
|
|
627
|
+
set searchFilters(value: SkyAutocompleteSearchFunctionFilter[] | undefined);
|
|
628
|
+
get searchFilters(): SkyAutocompleteSearchFunctionFilter[] | undefined;
|
|
629
|
+
/**
|
|
630
|
+
* The maximum number of search results to display in the dropdown
|
|
631
|
+
* list. By default, the lookup component displays all matching results.
|
|
632
|
+
* This property has no effect on the results in the "Show more" picker.
|
|
633
|
+
*/
|
|
634
|
+
searchResultsLimit: number | undefined;
|
|
635
|
+
/**
|
|
636
|
+
* Fires when users enter new search information and allows results to be
|
|
637
|
+
* returned via an observable. The event is also fired with empty search text
|
|
638
|
+
* when the "Show more" picker is opened without search text.
|
|
639
|
+
*/
|
|
640
|
+
searchAsync: EventEmitter<SkyAutocompleteSearchAsyncArgs>;
|
|
641
|
+
searchOrDefault: SkyAutocompleteSearchFunction;
|
|
642
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyLookupAutocompleteAdapter, never>;
|
|
643
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<SkyLookupAutocompleteAdapter, never, never, { "debounceTime": { "alias": "debounceTime"; "required": false; }; "descriptorProperty": { "alias": "descriptorProperty"; "required": false; }; "propertiesToSearch": { "alias": "propertiesToSearch"; "required": false; }; "search": { "alias": "search"; "required": false; }; "searchResultTemplate": { "alias": "searchResultTemplate"; "required": false; }; "searchTextMinimumCharacters": { "alias": "searchTextMinimumCharacters"; "required": false; }; "searchFilters": { "alias": "searchFilters"; "required": false; }; "searchResultsLimit": { "alias": "searchResultsLimit"; "required": false; }; }, { "searchAsync": "searchAsync"; }, never, never, true, never>;
|
|
644
|
+
}
|
|
645
|
+
|
|
646
|
+
/**
|
|
647
|
+
* Specifies the information for the callback used when adding a new item to the lookup component.
|
|
648
|
+
*/
|
|
649
|
+
interface SkyLookupAddCallbackArgs {
|
|
650
|
+
/**
|
|
651
|
+
* The new item which has been added to the data. This item will be automatically selected.
|
|
652
|
+
*/
|
|
653
|
+
item: any;
|
|
654
|
+
/**
|
|
655
|
+
* The new state of the data source for the lookup component to search when users
|
|
656
|
+
* enter text. If not specified, the component will use the current state of the lookup
|
|
657
|
+
* component's `data` input; however, if this is not yet updated the new item will not be
|
|
658
|
+
* automatically selected.
|
|
659
|
+
*/
|
|
660
|
+
data?: any[];
|
|
661
|
+
}
|
|
662
|
+
|
|
663
|
+
/**
|
|
664
|
+
* Specifies a callback function for the consumer to use to notify the lookup that a new item has been added.
|
|
665
|
+
*/
|
|
666
|
+
interface SkyLookupAddClickEventArgs {
|
|
667
|
+
/**
|
|
668
|
+
* A callback function for the consumer to use to notify the lookup that a new item has been added.
|
|
669
|
+
* @param args Specifies information about the item that was added.
|
|
670
|
+
*/
|
|
671
|
+
itemAdded: (args: SkyLookupAddCallbackArgs) => void;
|
|
672
|
+
}
|
|
673
|
+
|
|
674
|
+
type SkyLookupSelectModeType = 'single' | 'multiple';
|
|
675
|
+
|
|
676
|
+
/**
|
|
677
|
+
* Specifies configuration options to launch a custom picker when users select
|
|
678
|
+
* the button to view all options.
|
|
679
|
+
*/
|
|
680
|
+
declare class SkyLookupShowMoreCustomPickerContext {
|
|
681
|
+
/**
|
|
682
|
+
* The options that users can select in the custom picker.
|
|
683
|
+
*/
|
|
684
|
+
items: any[];
|
|
685
|
+
/**
|
|
686
|
+
* Search text to filter the contents of the custom picker.
|
|
687
|
+
*/
|
|
688
|
+
initialSearch: string;
|
|
689
|
+
/**
|
|
690
|
+
* The current selections in the lookup field.
|
|
691
|
+
*/
|
|
692
|
+
initialValue: any;
|
|
693
|
+
}
|
|
694
|
+
|
|
695
|
+
/**
|
|
696
|
+
* Defines a custom picker to display when users select the button to view all options.
|
|
697
|
+
*/
|
|
698
|
+
interface SkyLookupShowMoreCustomPicker {
|
|
699
|
+
open: (pickerContext: SkyLookupShowMoreCustomPickerContext) => void;
|
|
700
|
+
}
|
|
701
|
+
|
|
702
|
+
/**
|
|
703
|
+
* Specifies configuration options to display the native picker when users select
|
|
704
|
+
* the button to view all options.
|
|
705
|
+
*/
|
|
706
|
+
interface SkyLookupShowMoreNativePickerConfig {
|
|
707
|
+
/**
|
|
708
|
+
* The template that formats each option in the picker. The lookup component
|
|
709
|
+
* injects values into the template as `item` variables that reference all the object
|
|
710
|
+
* properties of the options. If you do not specify a template, the picker uses
|
|
711
|
+
* the same template as the dropdown list.
|
|
712
|
+
*/
|
|
713
|
+
itemTemplate?: TemplateRef<unknown>;
|
|
714
|
+
/**
|
|
715
|
+
* The title for the picker.
|
|
716
|
+
* @default "Select an option/Select options"
|
|
717
|
+
* @deprecated Use the `selectionDescriptor` input to give context to the title and accessibility labels instead.
|
|
718
|
+
*/
|
|
719
|
+
title?: string;
|
|
720
|
+
/**
|
|
721
|
+
* A descriptor for the item or items being selected. Use a plural term when the lookup's `selectMode` is set to `'multiple'`; otherwise, use a singular term. The descriptor helps set the picker's `aria-label` attributes for the multiselect toolbar controls, the search input, and the save button to provide text equivalents for screen readers [to support accessibility](https://developer.blackbaud.com/skyux/components/checkbox#accessibility).
|
|
722
|
+
* For example, when the descriptor is "constituents," the search input's `aria-label` is "Search constituents." For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
723
|
+
* @default "item"/"items"
|
|
724
|
+
*/
|
|
725
|
+
selectionDescriptor?: string;
|
|
726
|
+
}
|
|
727
|
+
|
|
728
|
+
/**
|
|
729
|
+
* Specifies configuration options for the picker to display when users select the button
|
|
730
|
+
* to view all options. You can use a native, out-of-the-box modal picker, or you can create
|
|
731
|
+
* a custom picker. If you provide configuration options for both, the lookup component uses
|
|
732
|
+
* the custom configuration.
|
|
733
|
+
*/
|
|
734
|
+
interface SkyLookupShowMoreConfig {
|
|
735
|
+
/**
|
|
736
|
+
* The configuration object to display a custom picker.
|
|
737
|
+
*/
|
|
738
|
+
customPicker?: SkyLookupShowMoreCustomPicker;
|
|
739
|
+
/**
|
|
740
|
+
* Configuration options for the native picker.
|
|
741
|
+
*/
|
|
742
|
+
nativePickerConfig?: SkyLookupShowMoreNativePickerConfig;
|
|
743
|
+
}
|
|
744
|
+
|
|
745
|
+
declare class SkyLookupComponent extends SkyLookupAutocompleteAdapter implements OnInit, AfterViewInit, OnDestroy, ControlValueAccessor {
|
|
746
|
+
#private;
|
|
747
|
+
inputBoxHostSvc?: SkyInputBoxHostService | undefined;
|
|
748
|
+
themeSvc?: SkyThemeService | undefined;
|
|
749
|
+
/**
|
|
750
|
+
* The ARIA label for the typeahead search input. This sets the input's `aria-label` attribute to provide a text equivalent for
|
|
751
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
752
|
+
* If the input includes a visible label, use `ariaLabelledBy` instead.
|
|
753
|
+
* For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
754
|
+
* @deprecated Use the input box `labelText` input instead.
|
|
755
|
+
*/
|
|
756
|
+
ariaLabel: string | undefined;
|
|
757
|
+
/**
|
|
758
|
+
* The HTML element ID of the element that labels
|
|
759
|
+
* the typeahead search input. This sets the input's `aria-labelledby` attribute to provide a text equivalent for
|
|
760
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
761
|
+
* If the input does not include a visible label, use `ariaLabel` instead.
|
|
762
|
+
* For more information about the `aria-labelledby` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-labelledby).
|
|
763
|
+
* @deprecated Use the input box `labelText` input instead.
|
|
764
|
+
*/
|
|
765
|
+
ariaLabelledBy: string | undefined;
|
|
766
|
+
/**
|
|
767
|
+
* The value for the `autocomplete` attribute on the form input.
|
|
768
|
+
* @default 'off'
|
|
769
|
+
* @deprecated SKY UX only supports browser autofill on components where the direct input matches the return value. This input may not behave as expected due to the dropdown selection interaction.
|
|
770
|
+
*/
|
|
771
|
+
autocompleteAttribute: string | undefined;
|
|
772
|
+
/**
|
|
773
|
+
* The data source for the lookup component to search when users
|
|
774
|
+
* enter text. You can specify static data such as an array of objects, or
|
|
775
|
+
* you can pull data from a database.
|
|
776
|
+
* @default []
|
|
777
|
+
* @deprecated Use the `searchAsync` event emitter and callback instead to provide data to the lookup component.
|
|
778
|
+
*/
|
|
779
|
+
set data(value: any[] | undefined);
|
|
780
|
+
get data(): any[];
|
|
781
|
+
/**
|
|
782
|
+
* Whether to disable the lookup field on template-driven forms. Don't use this input on reactive forms because they may overwrite the input or leave the control out of sync.
|
|
783
|
+
* To set the disabled state on reactive forms, use the `FormControl` instead.
|
|
784
|
+
* @default false
|
|
785
|
+
*/
|
|
786
|
+
set disabled(value: boolean | undefined);
|
|
787
|
+
get disabled(): boolean;
|
|
788
|
+
/**
|
|
789
|
+
* Whether the lookup field is required.
|
|
790
|
+
* @default false
|
|
791
|
+
*/
|
|
792
|
+
set required(value: boolean);
|
|
793
|
+
get required(): boolean;
|
|
794
|
+
/**
|
|
795
|
+
* Whether to enable users to open a picker where they can view all options.
|
|
796
|
+
* @default false
|
|
797
|
+
*/
|
|
798
|
+
set enableShowMore(value: boolean | undefined);
|
|
799
|
+
get enableShowMore(): boolean;
|
|
800
|
+
/**
|
|
801
|
+
* Placeholder text to display in the lookup field.
|
|
802
|
+
*/
|
|
803
|
+
placeholderText: string | undefined;
|
|
804
|
+
/**
|
|
805
|
+
* The object property that represents the object's unique identifier.
|
|
806
|
+
* Specifying this property enables token animations and more efficient rendering.
|
|
807
|
+
* This property is required when using `enableShowMore` and `searchAsync` together.
|
|
808
|
+
*/
|
|
809
|
+
idProperty: string | undefined;
|
|
810
|
+
/**
|
|
811
|
+
* Whether to display a button that lets users add options to the list.
|
|
812
|
+
* @default false
|
|
813
|
+
*/
|
|
814
|
+
set showAddButton(value: boolean | undefined);
|
|
815
|
+
get showAddButton(): boolean;
|
|
816
|
+
/**
|
|
817
|
+
* Configuration options for the picker that displays all options.
|
|
818
|
+
*/
|
|
819
|
+
showMoreConfig: SkyLookupShowMoreConfig | undefined;
|
|
820
|
+
/**
|
|
821
|
+
* The ability for users to select one option or multiple options.
|
|
822
|
+
* @default "multiple"
|
|
823
|
+
*/
|
|
824
|
+
set selectMode(value: SkyLookupSelectModeType | undefined);
|
|
825
|
+
get selectMode(): SkyLookupSelectModeType;
|
|
826
|
+
/**
|
|
827
|
+
* @internal
|
|
828
|
+
*/
|
|
829
|
+
wrapperClass: string | undefined;
|
|
830
|
+
/**
|
|
831
|
+
* Fires when users select the button to add options to the list.
|
|
832
|
+
*/
|
|
833
|
+
addClick: EventEmitter<SkyLookupAddClickEventArgs>;
|
|
834
|
+
/**
|
|
835
|
+
* @internal
|
|
836
|
+
*/
|
|
837
|
+
openChange: EventEmitter<boolean>;
|
|
838
|
+
/**
|
|
839
|
+
* @internal
|
|
840
|
+
*/
|
|
841
|
+
selectionModalOpenChange: EventEmitter<boolean>;
|
|
842
|
+
get tokens(): SkyToken[] | undefined;
|
|
843
|
+
set tokens(tokens: SkyToken[] | undefined);
|
|
844
|
+
/**
|
|
845
|
+
* @internal
|
|
846
|
+
* @deprecated This is exposed for unit tests only; refactor unit tests to
|
|
847
|
+
* derive the control value a different way.
|
|
848
|
+
*/
|
|
849
|
+
get value(): any[];
|
|
850
|
+
autocompleteController: Subject<SkyAutocompleteMessage>;
|
|
851
|
+
isInputFocused: boolean;
|
|
852
|
+
showMorePickerId: string | undefined;
|
|
853
|
+
tokensController: Subject<SkyTokensMessage>;
|
|
854
|
+
protected controlId: string | undefined;
|
|
855
|
+
protected ariaDescribedBy: Observable<string | undefined> | undefined;
|
|
856
|
+
set autocompleteInputDirective(value: SkyAutocompleteInputDirective | undefined);
|
|
857
|
+
get autocompleteInputDirective(): SkyAutocompleteInputDirective | undefined;
|
|
858
|
+
showMoreButtonTemplateRef: TemplateRef<unknown> | undefined;
|
|
859
|
+
inputTemplateRef: TemplateRef<unknown> | undefined;
|
|
860
|
+
lookupWrapperRef: ElementRef | undefined;
|
|
861
|
+
searchIconTemplateRef: TemplateRef<unknown> | undefined;
|
|
862
|
+
constructor(ngControl?: NgControl, inputBoxHostSvc?: SkyInputBoxHostService | undefined, themeSvc?: SkyThemeService | undefined);
|
|
863
|
+
ngOnInit(): void;
|
|
864
|
+
ngAfterViewInit(): void;
|
|
865
|
+
ngOnDestroy(): void;
|
|
866
|
+
addButtonClicked(): void;
|
|
867
|
+
onAutocompleteSelectionChange(change: SkyAutocompleteSelectionChange): void;
|
|
868
|
+
onAutocompleteBlur(): void;
|
|
869
|
+
onTokensChange(change: SkyToken[]): void;
|
|
870
|
+
onTokensFocusIndexOverRange(): void;
|
|
871
|
+
onTokensKeyUp(event: KeyboardEvent): void;
|
|
872
|
+
onTokensRendered(): void;
|
|
873
|
+
writeValue(value: any[]): void;
|
|
874
|
+
registerOnChange(fn: (value: any[]) => void): void;
|
|
875
|
+
registerOnTouched(fn: () => void): void;
|
|
876
|
+
setDisabledState(disabled: boolean): void;
|
|
877
|
+
clearSearchText(): void;
|
|
878
|
+
inputKeydown(event: KeyboardEvent): void;
|
|
879
|
+
inputKeyup(event: KeyboardEvent): void;
|
|
880
|
+
onSearchButtonClick(): void;
|
|
881
|
+
onShowMoreClick(event: SkyAutocompleteShowMoreArgs): void;
|
|
882
|
+
openPicker(initialSearch: string): void;
|
|
883
|
+
protected onAutocompleteOpenChange($event: boolean): void;
|
|
884
|
+
protected onFocus($event: FocusEvent): void;
|
|
885
|
+
onSearchAsync(args: SkyAutocompleteSearchAsyncArgs): void;
|
|
886
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyLookupComponent, [{ optional: true; self: true; }, { optional: true; }, { optional: true; }]>;
|
|
887
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkyLookupComponent, "sky-lookup", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "autocompleteAttribute": { "alias": "autocompleteAttribute"; "required": false; }; "data": { "alias": "data"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "enableShowMore": { "alias": "enableShowMore"; "required": false; }; "placeholderText": { "alias": "placeholderText"; "required": false; }; "idProperty": { "alias": "idProperty"; "required": false; }; "showAddButton": { "alias": "showAddButton"; "required": false; }; "showMoreConfig": { "alias": "showMoreConfig"; "required": false; }; "selectMode": { "alias": "selectMode"; "required": false; }; "wrapperClass": { "alias": "wrapperClass"; "required": false; }; }, { "addClick": "addClick"; "openChange": "openChange"; "selectionModalOpenChange": "selectionModalOpenChange"; }, never, never, false, never>;
|
|
888
|
+
static ngAcceptInputType_required: unknown;
|
|
889
|
+
}
|
|
890
|
+
|
|
891
|
+
declare class SkyLookupModule {
|
|
892
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkyLookupModule, never>;
|
|
893
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkyLookupModule, [typeof SkyLookupComponent], [typeof i2.CommonModule, typeof SkyAutocompleteModule, typeof i8.SkyIconModule, typeof SkyLookupResourcesModule, typeof i7$1.SkyThemeModule, typeof i7.SkyTokensModule], [typeof SkyLookupComponent]>;
|
|
894
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkyLookupModule>;
|
|
895
|
+
}
|
|
896
|
+
|
|
897
|
+
/**
|
|
898
|
+
* @deprecated Use `SkyLookupSelectModeType` instead.
|
|
899
|
+
* @internal
|
|
900
|
+
*/
|
|
901
|
+
declare enum SkyLookupSelectMode {
|
|
902
|
+
/**
|
|
903
|
+
* Restricts users to a single selection.
|
|
904
|
+
*/
|
|
905
|
+
single = "single",
|
|
906
|
+
/**
|
|
907
|
+
* Allows users to select multiple items.
|
|
908
|
+
*/
|
|
909
|
+
multiple = "multiple"
|
|
910
|
+
}
|
|
911
|
+
|
|
912
|
+
/**
|
|
913
|
+
* @internal
|
|
914
|
+
*/
|
|
915
|
+
declare class SkySearchAdapterService {
|
|
916
|
+
#private;
|
|
917
|
+
constructor(renderer: Renderer2);
|
|
918
|
+
selectInput(searchEl: ElementRef): void;
|
|
919
|
+
focusInput(searchEl: ElementRef): void;
|
|
920
|
+
startInputAnimation(searchEl: ElementRef): void;
|
|
921
|
+
endInputAnimation(searchEl: ElementRef): void;
|
|
922
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySearchAdapterService, never>;
|
|
923
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<SkySearchAdapterService>;
|
|
924
|
+
}
|
|
925
|
+
|
|
926
|
+
declare class SkySearchComponent implements OnDestroy, OnInit, OnChanges {
|
|
927
|
+
#private;
|
|
928
|
+
/**
|
|
929
|
+
* The ARIA label for the search input. This sets the search input's `aria-label` attribute to provide a text equivalent for screen readers
|
|
930
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
931
|
+
* Use a context-sensitive label, such as "Search constituents." Context is especially important when multiple search inputs are in close proximity.
|
|
932
|
+
* In toolbars, search inputs use the `listDescriptor` to provide context, and the ARIA label defaults to "Search <listDescriptor>."
|
|
933
|
+
* If the box includes a visible label, use `ariaLabelledBy` instead.
|
|
934
|
+
* For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
935
|
+
*/
|
|
936
|
+
ariaLabel: string | undefined;
|
|
937
|
+
/**
|
|
938
|
+
* The HTML element ID of the element that labels
|
|
939
|
+
* the search. This sets the search's `aria-labelledby` attribute to provide a text equivalent for screen readers
|
|
940
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
941
|
+
* If the box does not include a visible label, use `ariaLabel` instead.
|
|
942
|
+
* For more information about the `aria-labelledby` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-labelledby).
|
|
943
|
+
*/
|
|
944
|
+
ariaLabelledBy: string | undefined;
|
|
945
|
+
/**
|
|
946
|
+
* Fires when the search text is applied.
|
|
947
|
+
*/
|
|
948
|
+
searchApply: EventEmitter<string>;
|
|
949
|
+
/**
|
|
950
|
+
* Fires when the search text is changed.
|
|
951
|
+
*/
|
|
952
|
+
searchChange: EventEmitter<string>;
|
|
953
|
+
/**
|
|
954
|
+
* Fires when the search text is cleared.
|
|
955
|
+
*/
|
|
956
|
+
searchClear: EventEmitter<void>;
|
|
957
|
+
/**
|
|
958
|
+
* Default search criteria for the input.
|
|
959
|
+
*/
|
|
960
|
+
searchText: string | undefined;
|
|
961
|
+
/**
|
|
962
|
+
* The expand mode for the search input. The valid options
|
|
963
|
+
* include `"responsive"` to collapse the search input into a button on
|
|
964
|
+
* mobile devices, `"none"` to *not* collapse the search input on mobile
|
|
965
|
+
* devices, and `"fit"` to extend the search input to fit the width of its container.
|
|
966
|
+
* @default "responsive"
|
|
967
|
+
*/
|
|
968
|
+
set expandMode(value: string | undefined);
|
|
969
|
+
get expandMode(): string;
|
|
970
|
+
/**
|
|
971
|
+
* How many milliseconds to wait before searching after users enter text in the search input.
|
|
972
|
+
* @default 0
|
|
973
|
+
*/
|
|
974
|
+
set debounceTime(value: number | undefined);
|
|
975
|
+
get debounceTime(): number;
|
|
976
|
+
/**
|
|
977
|
+
* Whether to disable the filter button.
|
|
978
|
+
* @default false
|
|
979
|
+
*/
|
|
980
|
+
set disabled(value: boolean | undefined);
|
|
981
|
+
get disabled(): boolean;
|
|
982
|
+
/**
|
|
983
|
+
* Placeholder text to display in the search input until users
|
|
984
|
+
* enter search criteria.
|
|
985
|
+
* @default "Find in this list"
|
|
986
|
+
*/
|
|
987
|
+
placeholderText: string | undefined;
|
|
988
|
+
clearButtonShown: boolean;
|
|
989
|
+
dismissButtonShown: boolean;
|
|
990
|
+
inputAnimate: string;
|
|
991
|
+
isCollapsible: boolean;
|
|
992
|
+
isFullWidth: boolean;
|
|
993
|
+
mobileSearchShown: boolean;
|
|
994
|
+
searchButtonShown: boolean;
|
|
995
|
+
protected contentInfoObs: Observable<SkyContentInfo> | undefined;
|
|
996
|
+
constructor(elRef: ElementRef, searchAdapter: SkySearchAdapterService, changeRef: ChangeDetectorRef);
|
|
997
|
+
ngOnInit(): void;
|
|
998
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
999
|
+
clearSearchText(): void;
|
|
1000
|
+
enterPress(event: KeyboardEvent, searchText: string | undefined): void;
|
|
1001
|
+
applySearchText(searchText: string | undefined): void;
|
|
1002
|
+
searchTextChanged(searchText: string): void;
|
|
1003
|
+
toggleSearchInput(showInput: boolean): void;
|
|
1004
|
+
inputAnimationStart(event: AnimationEvent): void;
|
|
1005
|
+
inputAnimationEnd(event: AnimationEvent): void;
|
|
1006
|
+
ngOnDestroy(): void;
|
|
1007
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySearchComponent, never>;
|
|
1008
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySearchComponent, "sky-search", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "searchText": { "alias": "searchText"; "required": false; }; "expandMode": { "alias": "expandMode"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "placeholderText": { "alias": "placeholderText"; "required": false; }; }, { "searchApply": "searchApply"; "searchChange": "searchChange"; "searchClear": "searchClear"; }, never, never, false, never>;
|
|
1009
|
+
}
|
|
1010
|
+
|
|
1011
|
+
declare class SkySearchModule {
|
|
1012
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySearchModule, never>;
|
|
1013
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkySearchModule, [typeof SkySearchComponent], [typeof i2.CommonModule, typeof i3$1.SkyInputBoxModule, typeof SkyLookupResourcesModule, typeof i3.FormsModule, typeof i8.SkyIconModule, typeof i7$1.SkyThemeModule, typeof i6.SkyIdModule], [typeof SkySearchComponent]>;
|
|
1014
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkySearchModule>;
|
|
1015
|
+
}
|
|
1016
|
+
|
|
1017
|
+
/**
|
|
1018
|
+
* @deprecated The `SkySelectionModalModule` is no longer needed and can be removed from your application.
|
|
1019
|
+
* @internal
|
|
1020
|
+
*/
|
|
1021
|
+
declare class SkySelectionModalModule {
|
|
1022
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySelectionModalModule, never>;
|
|
1023
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkySelectionModalModule, never, never, never>;
|
|
1024
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkySelectionModalModule>;
|
|
1025
|
+
}
|
|
1026
|
+
|
|
1027
|
+
/**
|
|
1028
|
+
* The result from the selection modal.
|
|
1029
|
+
*/
|
|
1030
|
+
interface SkySelectionModalCloseArgs {
|
|
1031
|
+
/**
|
|
1032
|
+
* Indicates why the selection modal was closed.
|
|
1033
|
+
*/
|
|
1034
|
+
reason: 'cancel' | 'close' | 'save';
|
|
1035
|
+
/**
|
|
1036
|
+
* A collection of items the user selected. This property is only
|
|
1037
|
+
* set when the `result` property is set to `save`.
|
|
1038
|
+
*/
|
|
1039
|
+
selectedItems?: unknown[];
|
|
1040
|
+
}
|
|
1041
|
+
|
|
1042
|
+
/**
|
|
1043
|
+
* Represents an instance of a selection modal.
|
|
1044
|
+
*/
|
|
1045
|
+
declare class SkySelectionModalInstance {
|
|
1046
|
+
#private;
|
|
1047
|
+
/**
|
|
1048
|
+
* An event that the selection modal instance emits when it closes.
|
|
1049
|
+
* It emits a `SkySelectionModalCloseArgs` object with a `selectedItems` property that includes
|
|
1050
|
+
* items selected by users on close or save and a `reason` property that indicates
|
|
1051
|
+
* whether the selection modal was saved or closed without saving.
|
|
1052
|
+
* The `reason` property accepts `"cancel"`, `"close"`, and `"save"`.
|
|
1053
|
+
*/
|
|
1054
|
+
get closed(): Observable<SkySelectionModalCloseArgs>;
|
|
1055
|
+
/**
|
|
1056
|
+
* @internal
|
|
1057
|
+
*/
|
|
1058
|
+
get itemAdded(): Observable<unknown>;
|
|
1059
|
+
/**
|
|
1060
|
+
* @internal
|
|
1061
|
+
*/
|
|
1062
|
+
id: string;
|
|
1063
|
+
constructor(id: string);
|
|
1064
|
+
/**
|
|
1065
|
+
* @internal
|
|
1066
|
+
*/
|
|
1067
|
+
close(args: SkySelectionModalCloseArgs): void;
|
|
1068
|
+
/**
|
|
1069
|
+
* @internal
|
|
1070
|
+
*/
|
|
1071
|
+
addItem(itemToAdd: unknown): void;
|
|
1072
|
+
}
|
|
1073
|
+
|
|
1074
|
+
/**
|
|
1075
|
+
* Specifies the information for the callback used when adding a new item to a selection modal instance.
|
|
1076
|
+
*/
|
|
1077
|
+
interface SkySelectionModalAddCallbackArgs {
|
|
1078
|
+
/**
|
|
1079
|
+
* The new item which has been added to the data. This item will be automatically selected.
|
|
1080
|
+
*/
|
|
1081
|
+
item: any;
|
|
1082
|
+
}
|
|
1083
|
+
|
|
1084
|
+
/**
|
|
1085
|
+
* Specifies a callback function for the consumer to use to notify the selection modal that a new item has been added.
|
|
1086
|
+
*/
|
|
1087
|
+
interface SkySelectionModalAddClickEventArgs {
|
|
1088
|
+
/**
|
|
1089
|
+
* A callback function for the consumer to use to notify the selection modal that a new item has been added.
|
|
1090
|
+
* @param args Specifies information about the item that was added.
|
|
1091
|
+
*/
|
|
1092
|
+
itemAdded: (args: SkySelectionModalAddCallbackArgs) => void;
|
|
1093
|
+
}
|
|
1094
|
+
|
|
1095
|
+
/**
|
|
1096
|
+
* Arguments passed when an asynchronous search is executed from the
|
|
1097
|
+
* selection modal service.
|
|
1098
|
+
*/
|
|
1099
|
+
interface SkySelectionModalSearchArgs {
|
|
1100
|
+
/**
|
|
1101
|
+
* The search text entered by the user.
|
|
1102
|
+
*/
|
|
1103
|
+
searchText: string;
|
|
1104
|
+
/**
|
|
1105
|
+
* The offset index of the first result to return. When search is executed
|
|
1106
|
+
* as a result of an infinite scroll event, for example, offset will be set
|
|
1107
|
+
* to the number of items already displayed.
|
|
1108
|
+
*/
|
|
1109
|
+
offset: number;
|
|
1110
|
+
/**
|
|
1111
|
+
* A continuation token which can be set and then will be passed back with any future searches.
|
|
1112
|
+
* This is helpful for applications which utilize a token instead of an offset when fetching data.
|
|
1113
|
+
*/
|
|
1114
|
+
continuationData?: unknown;
|
|
1115
|
+
}
|
|
1116
|
+
|
|
1117
|
+
/**
|
|
1118
|
+
* The result of searching for items to display in a selection modal.
|
|
1119
|
+
*/
|
|
1120
|
+
interface SkySelectionModalSearchResult {
|
|
1121
|
+
/**
|
|
1122
|
+
* Data provided on "load more" search result requests. Use this property for
|
|
1123
|
+
* information such as a continuation token for paged database queries.
|
|
1124
|
+
*/
|
|
1125
|
+
continuationData?: unknown;
|
|
1126
|
+
/**
|
|
1127
|
+
* Indicates whether there are more results that match the search criteria.
|
|
1128
|
+
*/
|
|
1129
|
+
hasMore?: boolean;
|
|
1130
|
+
/**
|
|
1131
|
+
* A list of items matching the search criteria. When there are more items that match
|
|
1132
|
+
* the search criteria, set the `hasMore` property to `true` more records can be lazy-loaded
|
|
1133
|
+
* as the user scrolls through the search results.
|
|
1134
|
+
*/
|
|
1135
|
+
items: unknown[];
|
|
1136
|
+
/**
|
|
1137
|
+
* The total number of records that match the search criteria, including items not returned in
|
|
1138
|
+
* the current list of items.
|
|
1139
|
+
*/
|
|
1140
|
+
totalCount: number;
|
|
1141
|
+
}
|
|
1142
|
+
|
|
1143
|
+
/**
|
|
1144
|
+
* Parameters for the selection modal.
|
|
1145
|
+
*/
|
|
1146
|
+
interface SkySelectionModalOpenArgs {
|
|
1147
|
+
/**
|
|
1148
|
+
* The template to format each option in the search results. The selection modal
|
|
1149
|
+
* injects values into the template as `item` variables that reference all the object
|
|
1150
|
+
* properties of the options. If you do not specify a template, the item's descriptor
|
|
1151
|
+
* property value is displayed.
|
|
1152
|
+
*/
|
|
1153
|
+
itemTemplate?: TemplateRef<unknown>;
|
|
1154
|
+
/**
|
|
1155
|
+
* The title for the selection modal.
|
|
1156
|
+
* @default "Select an option/Select options"
|
|
1157
|
+
* @deprecated Use the `selectionDescriptor` input to give context to the title and accessibility labels instead.
|
|
1158
|
+
*/
|
|
1159
|
+
title?: string;
|
|
1160
|
+
/**
|
|
1161
|
+
* The initial value for the selection modal.
|
|
1162
|
+
*/
|
|
1163
|
+
value?: unknown[];
|
|
1164
|
+
/**
|
|
1165
|
+
* Specifies an object property to display in the text input after users
|
|
1166
|
+
* select an item in the dropdown list.
|
|
1167
|
+
*/
|
|
1168
|
+
descriptorProperty: string;
|
|
1169
|
+
/**
|
|
1170
|
+
* An object property that represents the object's unique identifier.
|
|
1171
|
+
*/
|
|
1172
|
+
idProperty: string;
|
|
1173
|
+
/**
|
|
1174
|
+
* The initial search text.
|
|
1175
|
+
*/
|
|
1176
|
+
initialSearch?: string;
|
|
1177
|
+
/**
|
|
1178
|
+
* Called when users enter new search information and returns results via an observable.
|
|
1179
|
+
*/
|
|
1180
|
+
searchAsync: (args: SkySelectionModalSearchArgs) => Observable<SkySelectionModalSearchResult> | undefined;
|
|
1181
|
+
/**
|
|
1182
|
+
* Specifies whether users can select one option or multiple options.
|
|
1183
|
+
* @default "multiple"
|
|
1184
|
+
*/
|
|
1185
|
+
selectMode: SkyLookupSelectModeType;
|
|
1186
|
+
/**
|
|
1187
|
+
* Whether to display a button that lets users add options to the list.
|
|
1188
|
+
* @default false
|
|
1189
|
+
*/
|
|
1190
|
+
showAddButton?: boolean;
|
|
1191
|
+
/**
|
|
1192
|
+
* Called when users select the button to add options to the list.
|
|
1193
|
+
*/
|
|
1194
|
+
addClick?: (args: SkySelectionModalAddClickEventArgs) => void;
|
|
1195
|
+
/**
|
|
1196
|
+
* The CSS class to add to the modal, such as `ag-custom-component-popup` for
|
|
1197
|
+
* using a modal as part of a cell editor in Data Entry Grid.
|
|
1198
|
+
*/
|
|
1199
|
+
wrapperClass?: string;
|
|
1200
|
+
/**
|
|
1201
|
+
* A descriptor for the item or items being selected. Use a plural term when `selectMode` is set to `multiple`; otherwise, use a singular term. The descriptor helps set the selection modal's `aria-label` attributes for the multiselect toolbar controls, the search input, and the save button to provide text equivalents for screen readers [to support accessibility](https://developer.blackbaud.com/skyux/components/checkbox#accessibility).
|
|
1202
|
+
* For example, when the descriptor is "constituents," the search input's `aria-label` is "Search constituents." For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
1203
|
+
* @default "item"/"items"
|
|
1204
|
+
*/
|
|
1205
|
+
selectionDescriptor?: string;
|
|
1206
|
+
}
|
|
1207
|
+
|
|
1208
|
+
/**
|
|
1209
|
+
* Displays a modal for selecting one or more values.
|
|
1210
|
+
*/
|
|
1211
|
+
declare class SkySelectionModalService {
|
|
1212
|
+
#private;
|
|
1213
|
+
constructor(modalSvc: SkyModalService);
|
|
1214
|
+
/**
|
|
1215
|
+
* Opens the selection modal.
|
|
1216
|
+
* @param args Parameters for the selection modal.
|
|
1217
|
+
*/
|
|
1218
|
+
open(args: SkySelectionModalOpenArgs): SkySelectionModalInstance;
|
|
1219
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySelectionModalService, never>;
|
|
1220
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<SkySelectionModalService>;
|
|
1221
|
+
}
|
|
1222
|
+
|
|
1223
|
+
/**
|
|
1224
|
+
* The result from the selection modal.
|
|
1225
|
+
*/
|
|
1226
|
+
interface SkySelectionModalResult {
|
|
1227
|
+
/**
|
|
1228
|
+
* Indicates whether the user saved or canceled the modal.
|
|
1229
|
+
*/
|
|
1230
|
+
result: 'save' | 'cancel';
|
|
1231
|
+
/**
|
|
1232
|
+
* A collection of items the user selected. This property is only
|
|
1233
|
+
* set when the `result` property is set to `save`.
|
|
1234
|
+
*/
|
|
1235
|
+
selectedItems?: unknown[];
|
|
1236
|
+
}
|
|
1237
|
+
|
|
1238
|
+
export { SKY_COUNTRY_FIELD_CONTEXT, SkyAutocompleteModule, SkyCountryFieldModule, SkyLookupModule, SkyLookupSelectMode, SkyLookupShowMoreCustomPickerContext, SkySearchComponent, SkySearchModule, SkySelectionModalInstance, SkySelectionModalModule, SkySelectionModalService, SkyAutocompleteInputDirective as λ1, SkyAutocompleteComponent as λ2, SkyCountryFieldComponent as λ3, SkyLookupComponent as λ4 };
|
|
1239
|
+
export type { AutocompleteSearchAsyncResultDisplayType, SkyAutocompleteDefaultSearchFunctionOptions, SkyAutocompleteInputTextChange, SkyAutocompleteSearchArgs, SkyAutocompleteSearchAsyncArgs, SkyAutocompleteSearchAsyncResult, SkyAutocompleteSearchContext, SkyAutocompleteSearchFunction, SkyAutocompleteSearchFunctionFilter, SkyAutocompleteSearchFunctionResponse, SkyAutocompleteSelectionChange, SkyCountryFieldContext, SkyCountryFieldCountry, SkyLookupAddCallbackArgs, SkyLookupAddClickEventArgs, SkyLookupSelectModeType, SkyLookupShowMoreConfig, SkyLookupShowMoreCustomPicker, SkyLookupShowMoreNativePickerConfig, SkySelectionModalAddCallbackArgs, SkySelectionModalAddClickEventArgs, SkySelectionModalCloseArgs, SkySelectionModalOpenArgs, SkySelectionModalResult, SkySelectionModalSearchArgs, SkySelectionModalSearchResult };
|