@wlcm/angular 0.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/README.md +62 -0
- package/button/README.md +7 -0
- package/button/esm2022/index.mjs +3 -0
- package/button/esm2022/lib/button.module.mjs +16 -0
- package/button/esm2022/lib/components/button/button.component.mjs +37 -0
- package/button/esm2022/lib/models/button.models.mjs +2 -0
- package/button/esm2022/wlcm-angular-button.mjs +5 -0
- package/button/fesm2022/wlcm-angular-button.mjs +57 -0
- package/button/fesm2022/wlcm-angular-button.mjs.map +1 -0
- package/button/index.d.ts +2 -0
- package/button/lib/button.module.d.ts +7 -0
- package/button/lib/components/button/button.component.d.ts +13 -0
- package/button/lib/models/button.models.d.ts +1 -0
- package/core/README.md +7 -0
- package/core/esm2022/index.mjs +10 -0
- package/core/esm2022/lib/components/chevron-down-icon/chevron-down-icon.component.mjs +12 -0
- package/core/esm2022/lib/components/close-icon/close-icon.component.mjs +12 -0
- package/core/esm2022/lib/components/search-icon/search-icon.component.mjs +12 -0
- package/core/esm2022/lib/constants/http.constants.mjs +6 -0
- package/core/esm2022/lib/models/option.models.mjs +15 -0
- package/core/esm2022/lib/models/paginated-data.models.mjs +2 -0
- package/core/esm2022/lib/models/query-params.models.mjs +6 -0
- package/core/esm2022/lib/utils/stream.utils.mjs +28 -0
- package/core/esm2022/wlcm-angular-core.mjs +5 -0
- package/core/fesm2022/wlcm-angular-core.mjs +92 -0
- package/core/fesm2022/wlcm-angular-core.mjs.map +1 -0
- package/core/index.d.ts +8 -0
- package/core/lib/components/chevron-down-icon/chevron-down-icon.component.d.ts +5 -0
- package/core/lib/components/close-icon/close-icon.component.d.ts +5 -0
- package/core/lib/components/search-icon/search-icon.component.d.ts +5 -0
- package/core/lib/constants/http.constants.d.ts +2 -0
- package/core/lib/models/option.models.d.ts +11 -0
- package/core/lib/models/paginated-data.models.d.ts +6 -0
- package/core/lib/models/query-params.models.d.ts +26 -0
- package/core/lib/utils/stream.utils.d.ts +7 -0
- package/filters/README.md +7 -0
- package/filters/esm2022/index.mjs +8 -0
- package/filters/esm2022/lib/filters/components/filters/filters.component.mjs +21 -0
- package/filters/esm2022/lib/filters/components/filters-button/filters-button.component.mjs +25 -0
- package/filters/esm2022/lib/filters/components/filters-panel/filters-panel.component.mjs +86 -0
- package/filters/esm2022/lib/filters/components/filters-unit/filters-unit.component.mjs +55 -0
- package/filters/esm2022/lib/filters/directives/filters-content.directive.mjs +11 -0
- package/filters/esm2022/lib/filters/directives/filters-trigger.directive.mjs +69 -0
- package/filters/esm2022/lib/filters/filters.module.mjs +53 -0
- package/filters/esm2022/lib/filters/models/filters-default-selection-model.mjs +56 -0
- package/filters/esm2022/lib/filters/models/filters-trigger.base.mjs +56 -0
- package/filters/esm2022/lib/filters/models/filters.models.mjs +44 -0
- package/filters/esm2022/lib/filters/pipes/is-filters-param-checked.pipe.mjs +21 -0
- package/filters/esm2022/lib/filters/pipes/total-filters-applied.pipe.mjs +18 -0
- package/filters/esm2022/lib/filters/utils/filters.utils.mjs +13 -0
- package/filters/esm2022/wlcm-angular-filters.mjs +5 -0
- package/filters/fesm2022/wlcm-angular-filters.mjs +474 -0
- package/filters/fesm2022/wlcm-angular-filters.mjs.map +1 -0
- package/filters/index.d.ts +7 -0
- package/filters/lib/filters/components/filters/filters.component.d.ts +10 -0
- package/filters/lib/filters/components/filters-button/filters-button.component.d.ts +11 -0
- package/filters/lib/filters/components/filters-panel/filters-panel.component.d.ts +25 -0
- package/filters/lib/filters/components/filters-unit/filters-unit.component.d.ts +21 -0
- package/filters/lib/filters/directives/filters-content.directive.d.ts +5 -0
- package/filters/lib/filters/directives/filters-trigger.directive.d.ts +22 -0
- package/filters/lib/filters/filters.module.d.ts +20 -0
- package/filters/lib/filters/models/filters-default-selection-model.d.ts +18 -0
- package/filters/lib/filters/models/filters-trigger.base.d.ts +15 -0
- package/filters/lib/filters/models/filters.models.d.ts +42 -0
- package/filters/lib/filters/pipes/is-filters-param-checked.pipe.d.ts +10 -0
- package/filters/lib/filters/pipes/total-filters-applied.pipe.d.ts +8 -0
- package/filters/lib/filters/utils/filters.utils.d.ts +5 -0
- package/forms/README.md +7 -0
- package/forms/esm2022/index.mjs +10 -0
- package/forms/esm2022/lib/forms/components/autocomplete/autocomplete.component.mjs +164 -0
- package/forms/esm2022/lib/forms/components/error/error.component.mjs +12 -0
- package/forms/esm2022/lib/forms/components/form-field/form-field.component.mjs +118 -0
- package/forms/esm2022/lib/forms/components/index.mjs +6 -0
- package/forms/esm2022/lib/forms/components/label/label.component.mjs +23 -0
- package/forms/esm2022/lib/forms/components/select/select.component.mjs +107 -0
- package/forms/esm2022/lib/forms/constants/form-elements.constants.mjs +5 -0
- package/forms/esm2022/lib/forms/constants/form-errors.constants.mjs +7 -0
- package/forms/esm2022/lib/forms/constants/form-state-handlers.constants.mjs +13 -0
- package/forms/esm2022/lib/forms/constants/index.mjs +4 -0
- package/forms/esm2022/lib/forms/directives/ac-input-binder.directive.mjs +33 -0
- package/forms/esm2022/lib/forms/directives/autocomplete.directive.mjs +63 -0
- package/forms/esm2022/lib/forms/directives/form-field-custom-container.directive.mjs +17 -0
- package/forms/esm2022/lib/forms/directives/form-field-hint.directive.mjs +15 -0
- package/forms/esm2022/lib/forms/directives/form-field-suffix.directive.mjs +14 -0
- package/forms/esm2022/lib/forms/directives/input.directive.mjs +35 -0
- package/forms/esm2022/lib/forms/forms.module.mjs +51 -0
- package/forms/esm2022/lib/forms/models/_index.mjs +4 -0
- package/forms/esm2022/lib/forms/models/form-errors.models.mjs +2 -0
- package/forms/esm2022/lib/forms/models/form.models.mjs +2 -0
- package/forms/esm2022/lib/forms/models/input.models.mjs +2 -0
- package/forms/esm2022/lib/forms/pipes/errors-mapper.pipe.mjs +53 -0
- package/forms/esm2022/lib/forms/services/form-state-handler.service.mjs +19 -0
- package/forms/esm2022/lib/forms/services/index.mjs +2 -0
- package/forms/esm2022/wlcm-angular-forms.mjs +5 -0
- package/forms/fesm2022/wlcm-angular-forms.mjs +675 -0
- package/forms/fesm2022/wlcm-angular-forms.mjs.map +1 -0
- package/forms/index.d.ts +9 -0
- package/forms/lib/forms/components/autocomplete/autocomplete.component.d.ts +46 -0
- package/forms/lib/forms/components/error/error.component.d.ts +5 -0
- package/forms/lib/forms/components/form-field/form-field.component.d.ts +27 -0
- package/forms/lib/forms/components/index.d.ts +5 -0
- package/forms/lib/forms/components/label/label.component.d.ts +7 -0
- package/forms/lib/forms/components/select/select.component.d.ts +31 -0
- package/forms/lib/forms/constants/form-elements.constants.d.ts +6 -0
- package/forms/lib/forms/constants/form-errors.constants.d.ts +4 -0
- package/forms/lib/forms/constants/form-state-handlers.constants.d.ts +6 -0
- package/forms/lib/forms/constants/index.d.ts +3 -0
- package/forms/lib/forms/directives/ac-input-binder.directive.d.ts +5 -0
- package/forms/lib/forms/directives/autocomplete.directive.d.ts +16 -0
- package/forms/lib/forms/directives/form-field-custom-container.directive.d.ts +8 -0
- package/forms/lib/forms/directives/form-field-hint.directive.d.ts +5 -0
- package/forms/lib/forms/directives/form-field-suffix.directive.d.ts +5 -0
- package/forms/lib/forms/directives/input.directive.d.ts +5 -0
- package/forms/lib/forms/forms.module.d.ts +15 -0
- package/forms/lib/forms/models/_index.d.ts +3 -0
- package/forms/lib/forms/models/form-errors.models.d.ts +5 -0
- package/forms/lib/forms/models/form.models.d.ts +11 -0
- package/forms/lib/forms/models/input.models.d.ts +7 -0
- package/forms/lib/forms/pipes/errors-mapper.pipe.d.ts +17 -0
- package/forms/lib/forms/services/form-state-handler.service.d.ts +10 -0
- package/forms/lib/forms/services/index.d.ts +1 -0
- package/index.d.ts +1 -0
- package/index.mjs +4 -0
- package/package.json +109 -0
- package/search-field/README.md +7 -0
- package/search-field/esm2022/index.mjs +3 -0
- package/search-field/esm2022/lib/components/search-field/search-field.component.mjs +36 -0
- package/search-field/esm2022/lib/search-field.module.mjs +18 -0
- package/search-field/esm2022/wlcm-angular-search-field.mjs +5 -0
- package/search-field/fesm2022/wlcm-angular-search-field.mjs +57 -0
- package/search-field/fesm2022/wlcm-angular-search-field.mjs.map +1 -0
- package/search-field/index.d.ts +2 -0
- package/search-field/lib/components/search-field/search-field.component.d.ts +14 -0
- package/search-field/lib/search-field.module.d.ts +8 -0
- package/styles/components/button/index.scss +91 -0
- package/styles/components/common/index.scss +33 -0
- package/styles/components/filters/_filters-panel.scss +44 -0
- package/styles/components/filters/_filters-unit.scss +92 -0
- package/styles/components/filters/index.scss +7 -0
- package/styles/components/forms/_checkbox.scss +89 -0
- package/styles/components/forms/_error.scss +23 -0
- package/styles/components/forms/_form-field.scss +65 -0
- package/styles/components/forms/_label.scss +42 -0
- package/styles/components/forms/_select.scss +74 -0
- package/styles/components/forms/index.scss +13 -0
- package/styles/components/search-field/index.scss +31 -0
- package/styles/core/_all-theme.scss +15 -0
- package/styles/core/_core.scss +10 -0
- package/styles/core/_utils.scss +53 -0
- package/styles/wlcm.scss +3 -0
@@ -0,0 +1,675 @@
|
|
1
|
+
import * as i0 from '@angular/core';
|
2
|
+
import { Component, ChangeDetectionStrategy, Injectable, InjectionToken, inject, Directive, Pipe, Inject, forwardRef, ChangeDetectorRef, Optional, ContentChild, ViewChild, HostBinding, ElementRef, Input, EventEmitter, NgZone, Host, Output, NgModule } from '@angular/core';
|
3
|
+
import { __decorate, __metadata } from 'tslib';
|
4
|
+
import * as i4 from '@angular/forms';
|
5
|
+
import { Validators, NgControl, FormControl, NG_VALIDATORS, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
|
6
|
+
import * as i1 from '@angular/common';
|
7
|
+
import { CommonModule } from '@angular/common';
|
8
|
+
import { Subject, takeUntil, merge, fromEvent, first, observeOn, asyncScheduler, BehaviorSubject, Observable, tap, concatMap, EMPTY, debounceTime, filter, switchMap } from 'rxjs';
|
9
|
+
import { untilDestroyed, UntilDestroy } from '@ngneat/until-destroy';
|
10
|
+
import * as i2 from '@angular/material/select';
|
11
|
+
import { MAT_SELECT_CONFIG, MatSelectModule } from '@angular/material/select';
|
12
|
+
import * as i3 from '@angular/material/core';
|
13
|
+
import * as i1$1 from '@angular/material/autocomplete';
|
14
|
+
import { MatAutocomplete, MatAutocompleteOrigin, MatAutocompleteTrigger, MatAutocompleteModule } from '@angular/material/autocomplete';
|
15
|
+
import { DEFAULT_QUERY_PARAMS } from '@wlcm/angular/core';
|
16
|
+
|
17
|
+
class WlcmErrorComponent {
|
18
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
19
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: WlcmErrorComponent, isStandalone: true, selector: "wlcm-error", host: { classAttribute: "wlcm-error" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
20
|
+
}
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmErrorComponent, decorators: [{
|
22
|
+
type: Component,
|
23
|
+
args: [{ selector: 'wlcm-error', standalone: true, imports: [CommonModule], host: { class: 'wlcm-error' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
|
24
|
+
}] });
|
25
|
+
|
26
|
+
class FormStateHandlerService {
|
27
|
+
constructor() {
|
28
|
+
this._stateChanges$ = new Subject();
|
29
|
+
this.stateChanges$ = this._stateChanges$.asObservable();
|
30
|
+
}
|
31
|
+
updateFormState() {
|
32
|
+
this._stateChanges$.next();
|
33
|
+
}
|
34
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormStateHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
35
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormStateHandlerService, providedIn: 'root' }); }
|
36
|
+
}
|
37
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormStateHandlerService, decorators: [{
|
38
|
+
type: Injectable,
|
39
|
+
args: [{ providedIn: 'root' }]
|
40
|
+
}] });
|
41
|
+
|
42
|
+
const WLCM_FORM = new InjectionToken('WLCM_FORM');
|
43
|
+
const WLCM_FORM_PROVIDER = {
|
44
|
+
provide: WLCM_FORM,
|
45
|
+
useClass: FormStateHandlerService,
|
46
|
+
};
|
47
|
+
const WLCM_FORM_CONTROL = new InjectionToken('WLCM_FORM_CONTROL');
|
48
|
+
const WLCM_FORM_CONTROL_PROVIDER = {
|
49
|
+
provide: WLCM_FORM_CONTROL,
|
50
|
+
useFactory: () => inject(WLCM_FORM, { optional: true, skipSelf: true }),
|
51
|
+
};
|
52
|
+
|
53
|
+
class WlcmFormFieldCustomContainerDirective {
|
54
|
+
constructor(elementRef) {
|
55
|
+
this.elementRef = elementRef;
|
56
|
+
}
|
57
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldCustomContainerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
58
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.5", type: WlcmFormFieldCustomContainerDirective, isStandalone: true, selector: "[wlcmFormFieldCustomContainer]", ngImport: i0 }); }
|
59
|
+
}
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldCustomContainerDirective, decorators: [{
|
61
|
+
type: Directive,
|
62
|
+
args: [{
|
63
|
+
selector: '[wlcmFormFieldCustomContainer]',
|
64
|
+
standalone: true,
|
65
|
+
}]
|
66
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
67
|
+
|
68
|
+
const WLCM_ERRORS = new InjectionToken('WLCM_ERRORS');
|
69
|
+
const WLCM_PRIORITY_ERRORS = new InjectionToken('WLCM_PRIORITY_ERRORS', {
|
70
|
+
providedIn: 'root',
|
71
|
+
factory: () => new Set(),
|
72
|
+
});
|
73
|
+
|
74
|
+
class ErrorsMapperPipe {
|
75
|
+
constructor(changeDetectorRef, errors, priorityErrors) {
|
76
|
+
this.changeDetectorRef = changeDetectorRef;
|
77
|
+
this.errors = errors;
|
78
|
+
this.priorityErrors = priorityErrors;
|
79
|
+
this.destroy$ = new Subject();
|
80
|
+
this.currentError = null;
|
81
|
+
}
|
82
|
+
transform(control) {
|
83
|
+
this.handleStatusChanges(control);
|
84
|
+
this.retrieveFirstError(control.errors);
|
85
|
+
return this.currentError;
|
86
|
+
}
|
87
|
+
retrieveFirstError(errors) {
|
88
|
+
if (!errors)
|
89
|
+
return;
|
90
|
+
Object.keys(errors).forEach((key) => !errors[key] && delete errors[key]);
|
91
|
+
const errorsTypes = Object.getOwnPropertyNames(errors);
|
92
|
+
const priorityType = errorsTypes.find((type) => this.priorityErrors.has(type));
|
93
|
+
const outputError = priorityType || errorsTypes[0];
|
94
|
+
if (outputError) {
|
95
|
+
this.currentError = this.errors[outputError]?.(errors[outputError]);
|
96
|
+
}
|
97
|
+
}
|
98
|
+
handleStatusChanges(control) {
|
99
|
+
this.destroy$.next();
|
100
|
+
control.statusChanges.pipe(takeUntil(this.destroy$)).subscribe(() => {
|
101
|
+
this.retrieveFirstError(control.errors);
|
102
|
+
this.changeDetectorRef.markForCheck();
|
103
|
+
});
|
104
|
+
}
|
105
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ErrorsMapperPipe, deps: [{ token: i0.ChangeDetectorRef }, { token: WLCM_ERRORS }, { token: WLCM_PRIORITY_ERRORS }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
106
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.5", ngImport: i0, type: ErrorsMapperPipe, isStandalone: true, name: "errorsMapper", pure: false }); }
|
107
|
+
}
|
108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ErrorsMapperPipe, decorators: [{
|
109
|
+
type: Pipe,
|
110
|
+
args: [{
|
111
|
+
name: 'errorsMapper',
|
112
|
+
standalone: true,
|
113
|
+
pure: false,
|
114
|
+
}]
|
115
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
116
|
+
type: Inject,
|
117
|
+
args: [WLCM_ERRORS]
|
118
|
+
}] }, { type: Set, decorators: [{
|
119
|
+
type: Inject,
|
120
|
+
args: [WLCM_PRIORITY_ERRORS]
|
121
|
+
}] }] });
|
122
|
+
|
123
|
+
const WLCM_INPUT = new InjectionToken('WLCM_INPUT');
|
124
|
+
const WLCM_INPUT_BINDER = new InjectionToken('WLCM_INPUT_BINDER');
|
125
|
+
const WLCM_FORM_FIELD = new InjectionToken('WLCM_FORM_FIELD');
|
126
|
+
|
127
|
+
let WlcmFormFieldComponent = class WlcmFormFieldComponent {
|
128
|
+
get isFocused() {
|
129
|
+
return this.inputRef?.nativeElement === document.activeElement;
|
130
|
+
}
|
131
|
+
get isRequired() {
|
132
|
+
return this.control?.hasValidator(Validators.required);
|
133
|
+
}
|
134
|
+
get isInvalid() {
|
135
|
+
return this.control?.invalid;
|
136
|
+
}
|
137
|
+
get isTouched() {
|
138
|
+
return this.control?.touched;
|
139
|
+
}
|
140
|
+
constructor(parentFormMember, changeDetectorRef) {
|
141
|
+
this.parentFormMember = parentFormMember;
|
142
|
+
this.changeDetectorRef = changeDetectorRef;
|
143
|
+
}
|
144
|
+
ngAfterViewInit() {
|
145
|
+
if (!this.inputRef && !this.customContainer) {
|
146
|
+
throw new Error('Input element should be bound to the wlcmInput directive.');
|
147
|
+
}
|
148
|
+
this.handleStateChanges();
|
149
|
+
}
|
150
|
+
focus() {
|
151
|
+
if (!this.isFocused) {
|
152
|
+
this.inputRef?.nativeElement.focus();
|
153
|
+
}
|
154
|
+
}
|
155
|
+
get control() {
|
156
|
+
return this.ngControl?.control;
|
157
|
+
}
|
158
|
+
get inputContainer() {
|
159
|
+
return this.customContainer?.elementRef || this.defaultContainer;
|
160
|
+
}
|
161
|
+
handleStateChanges() {
|
162
|
+
const events = this.controlEvents;
|
163
|
+
if (this.parentFormMember) {
|
164
|
+
events.push(this.parentFormMember.stateChanges$);
|
165
|
+
}
|
166
|
+
merge(...events)
|
167
|
+
.pipe(untilDestroyed(this))
|
168
|
+
.subscribe(() => this.changeDetectorRef.markForCheck());
|
169
|
+
}
|
170
|
+
get inputRef() {
|
171
|
+
return this._inputRef?.get();
|
172
|
+
}
|
173
|
+
get controlEvents() {
|
174
|
+
const events = [];
|
175
|
+
if (this.inputRef) {
|
176
|
+
const element = this.inputRef.nativeElement;
|
177
|
+
events.push(fromEvent(element, 'focus'), fromEvent(element, 'blur'));
|
178
|
+
}
|
179
|
+
if (this.control) {
|
180
|
+
events.push(this.control.statusChanges);
|
181
|
+
}
|
182
|
+
return events;
|
183
|
+
}
|
184
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldComponent, deps: [{ token: WLCM_FORM_CONTROL, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
185
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: WlcmFormFieldComponent, isStandalone: true, selector: "wlcm-form-field", host: { properties: { "class.wlcm-field-focused": "this.isFocused", "class.wlcm-field-required": "this.isRequired", "class.wlcm-field-invalid": "this.isInvalid", "class.wlcm-field-touched": "this.isTouched" }, classAttribute: "wlcm-form-field" }, providers: [
|
186
|
+
WLCM_FORM_CONTROL_PROVIDER,
|
187
|
+
{ provide: WLCM_FORM_FIELD, useExisting: forwardRef(() => WlcmFormFieldComponent) },
|
188
|
+
], queries: [{ propertyName: "ngControl", first: true, predicate: NgControl, descendants: true }, { propertyName: "_inputRef", first: true, predicate: WLCM_INPUT, descendants: true }, { propertyName: "customContainer", first: true, predicate: WlcmFormFieldCustomContainerDirective, descendants: true }], viewQueries: [{ propertyName: "defaultContainer", first: true, predicate: ["defaultContainer"], descendants: true }], ngImport: i0, template: "<ng-content select=\"wlcm-label\"></ng-content>\n\n<ng-content select=\"[wlcmFormFieldCustomContainer]\"></ng-content>\n\n<div\n class=\"wlcm-field-container\"\n (click)=\"focus()\"\n #defaultContainer\n *ngIf=\"!customContainer\"\n>\n <ng-content select=\"[wlcmInput], wlcm-autocomplete\"></ng-content>\n\n <div class=\"wlcm-field-suffix\">\n <ng-content select=\"[wlcmFormFieldSuffix]\"></ng-content>\n </div>\n</div>\n\n<ng-content select=\"[wlcmFormFieldHint]\"></ng-content>\n\n<div class=\"wlcm-field-error-container\" *ngIf=\"control\">\n <wlcm-error>{{ $any(control) | errorsMapper }}</wlcm-error>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WlcmErrorComponent, selector: "wlcm-error" }, { kind: "pipe", type: ErrorsMapperPipe, name: "errorsMapper" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
189
|
+
};
|
190
|
+
WlcmFormFieldComponent = __decorate([
|
191
|
+
UntilDestroy(),
|
192
|
+
__metadata("design:paramtypes", [Object, ChangeDetectorRef])
|
193
|
+
], WlcmFormFieldComponent);
|
194
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldComponent, decorators: [{
|
195
|
+
type: Component,
|
196
|
+
args: [{ selector: 'wlcm-form-field', standalone: true, imports: [CommonModule, WlcmErrorComponent, ErrorsMapperPipe], host: { class: 'wlcm-form-field' }, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
197
|
+
WLCM_FORM_CONTROL_PROVIDER,
|
198
|
+
{ provide: WLCM_FORM_FIELD, useExisting: forwardRef(() => WlcmFormFieldComponent) },
|
199
|
+
], template: "<ng-content select=\"wlcm-label\"></ng-content>\n\n<ng-content select=\"[wlcmFormFieldCustomContainer]\"></ng-content>\n\n<div\n class=\"wlcm-field-container\"\n (click)=\"focus()\"\n #defaultContainer\n *ngIf=\"!customContainer\"\n>\n <ng-content select=\"[wlcmInput], wlcm-autocomplete\"></ng-content>\n\n <div class=\"wlcm-field-suffix\">\n <ng-content select=\"[wlcmFormFieldSuffix]\"></ng-content>\n </div>\n</div>\n\n<ng-content select=\"[wlcmFormFieldHint]\"></ng-content>\n\n<div class=\"wlcm-field-error-container\" *ngIf=\"control\">\n <wlcm-error>{{ $any(control) | errorsMapper }}</wlcm-error>\n</div>\n" }]
|
200
|
+
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
201
|
+
type: Optional
|
202
|
+
}, {
|
203
|
+
type: Inject,
|
204
|
+
args: [WLCM_FORM_CONTROL]
|
205
|
+
}] }, { type: i0.ChangeDetectorRef }], propDecorators: { ngControl: [{
|
206
|
+
type: ContentChild,
|
207
|
+
args: [NgControl, { descendants: true }]
|
208
|
+
}], _inputRef: [{
|
209
|
+
type: ContentChild,
|
210
|
+
args: [WLCM_INPUT]
|
211
|
+
}], customContainer: [{
|
212
|
+
type: ContentChild,
|
213
|
+
args: [WlcmFormFieldCustomContainerDirective]
|
214
|
+
}], defaultContainer: [{
|
215
|
+
type: ViewChild,
|
216
|
+
args: ['defaultContainer']
|
217
|
+
}], isFocused: [{
|
218
|
+
type: HostBinding,
|
219
|
+
args: ['class.wlcm-field-focused']
|
220
|
+
}], isRequired: [{
|
221
|
+
type: HostBinding,
|
222
|
+
args: ['class.wlcm-field-required']
|
223
|
+
}], isInvalid: [{
|
224
|
+
type: HostBinding,
|
225
|
+
args: ['class.wlcm-field-invalid']
|
226
|
+
}], isTouched: [{
|
227
|
+
type: HostBinding,
|
228
|
+
args: ['class.wlcm-field-touched']
|
229
|
+
}] } });
|
230
|
+
|
231
|
+
class WlcmInputDirective {
|
232
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
233
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.5", type: WlcmInputDirective, isStandalone: true, selector: "[wlcmInput]", host: { classAttribute: "wlcm-form-field-input" }, providers: [
|
234
|
+
{
|
235
|
+
provide: WLCM_INPUT,
|
236
|
+
useFactory: () => {
|
237
|
+
const inputRef = inject(ElementRef, { self: true });
|
238
|
+
const binder = inject(WLCM_INPUT_BINDER, { self: true, optional: true });
|
239
|
+
return { get: () => (binder ? binder.bind() : inputRef) };
|
240
|
+
},
|
241
|
+
},
|
242
|
+
], ngImport: i0 }); }
|
243
|
+
}
|
244
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmInputDirective, decorators: [{
|
245
|
+
type: Directive,
|
246
|
+
args: [{
|
247
|
+
selector: '[wlcmInput]',
|
248
|
+
host: { class: 'wlcm-form-field-input' },
|
249
|
+
providers: [
|
250
|
+
{
|
251
|
+
provide: WLCM_INPUT,
|
252
|
+
useFactory: () => {
|
253
|
+
const inputRef = inject(ElementRef, { self: true });
|
254
|
+
const binder = inject(WLCM_INPUT_BINDER, { self: true, optional: true });
|
255
|
+
return { get: () => (binder ? binder.bind() : inputRef) };
|
256
|
+
},
|
257
|
+
},
|
258
|
+
],
|
259
|
+
standalone: true,
|
260
|
+
}]
|
261
|
+
}] });
|
262
|
+
|
263
|
+
class WlcmLabelComponent {
|
264
|
+
constructor() {
|
265
|
+
this.required = false;
|
266
|
+
}
|
267
|
+
get isRequired() {
|
268
|
+
return this.required;
|
269
|
+
}
|
270
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
271
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: WlcmLabelComponent, isStandalone: true, selector: "wlcm-label", inputs: { required: "required" }, host: { properties: { "class.required": "this.isRequired" }, classAttribute: "wlcm-label" }, ngImport: i0, template: "<span class=\"wlcm-label-asterisk\">*</span>\n\n<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
272
|
+
}
|
273
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmLabelComponent, decorators: [{
|
274
|
+
type: Component,
|
275
|
+
args: [{ selector: 'wlcm-label', standalone: true, imports: [CommonModule], host: { class: 'wlcm-label' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"wlcm-label-asterisk\">*</span>\n\n<ng-content></ng-content>\n" }]
|
276
|
+
}], propDecorators: { required: [{
|
277
|
+
type: Input
|
278
|
+
}], isRequired: [{
|
279
|
+
type: HostBinding,
|
280
|
+
args: ['class.required']
|
281
|
+
}] } });
|
282
|
+
|
283
|
+
const PANEL_CLASS = 'wlcm-select-panel';
|
284
|
+
let WlcmSelectComponent = class WlcmSelectComponent {
|
285
|
+
constructor(changeDetectorRef, parentFormMember) {
|
286
|
+
this.changeDetectorRef = changeDetectorRef;
|
287
|
+
this.parentFormMember = parentFormMember;
|
288
|
+
this.multiple = false;
|
289
|
+
this.placeholder = 'Not selected';
|
290
|
+
this.options = [];
|
291
|
+
this.control = new FormControl();
|
292
|
+
if (this.parentFormMember) {
|
293
|
+
this.handleStateChange();
|
294
|
+
}
|
295
|
+
}
|
296
|
+
select(event) {
|
297
|
+
this._changed?.(event.value);
|
298
|
+
this._validatorChanged?.();
|
299
|
+
}
|
300
|
+
panelOpened() {
|
301
|
+
this.handleClickOutside();
|
302
|
+
}
|
303
|
+
writeValue(value) {
|
304
|
+
this.control.setValue(value);
|
305
|
+
}
|
306
|
+
registerOnChange(callback) {
|
307
|
+
this._changed = callback;
|
308
|
+
}
|
309
|
+
registerOnTouched(callback) {
|
310
|
+
this._touched = callback;
|
311
|
+
}
|
312
|
+
registerOnValidatorChange(callback) {
|
313
|
+
this._validatorChanged = callback;
|
314
|
+
}
|
315
|
+
validate(control) {
|
316
|
+
this.control.setErrors(control.errors);
|
317
|
+
if (control.touched) {
|
318
|
+
this.control.markAsTouched();
|
319
|
+
}
|
320
|
+
else {
|
321
|
+
this.control.markAsUntouched();
|
322
|
+
}
|
323
|
+
}
|
324
|
+
handleStateChange() {
|
325
|
+
this.parentFormMember.stateChanges$.pipe(untilDestroyed(this)).subscribe(() => {
|
326
|
+
this._validatorChanged?.();
|
327
|
+
this.changeDetectorRef.markForCheck();
|
328
|
+
});
|
329
|
+
}
|
330
|
+
handleClickOutside() {
|
331
|
+
const overlayContainer = document.querySelector(`.cdk-overlay-container:has(.${PANEL_CLASS})`);
|
332
|
+
const backdrop = overlayContainer?.querySelector(`.cdk-overlay-backdrop`);
|
333
|
+
if (backdrop instanceof HTMLElement) {
|
334
|
+
fromEvent(backdrop, 'click')
|
335
|
+
.pipe(first())
|
336
|
+
.subscribe(() => {
|
337
|
+
this._touched?.();
|
338
|
+
this._validatorChanged?.();
|
339
|
+
this.changeDetectorRef.markForCheck();
|
340
|
+
});
|
341
|
+
}
|
342
|
+
}
|
343
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: WLCM_FORM_CONTROL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
344
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: WlcmSelectComponent, isStandalone: true, selector: "wlcm-select", inputs: { multiple: "multiple", placeholder: "placeholder", options: "options" }, providers: [
|
345
|
+
WLCM_FORM_CONTROL_PROVIDER,
|
346
|
+
{ provide: MAT_SELECT_CONFIG, useValue: { overlayPanelClass: PANEL_CLASS } },
|
347
|
+
{ provide: NG_VALIDATORS, useExisting: forwardRef(() => WlcmSelectComponent), multi: true },
|
348
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => WlcmSelectComponent), multi: true },
|
349
|
+
], ngImport: i0, template: "<mat-select\n #selectComponent\n [multiple]=\"multiple\"\n [disableRipple]=\"true\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [hideSingleSelectionIndicator]=\"true\"\n [ngClass]=\"{ focused: selectComponent.focused }\"\n (selectionChange)=\"select($event)\"\n (opened)=\"panelOpened()\"\n>\n <mat-option *ngFor=\"let option of options\" [value]=\"option.value\">\n {{ option.viewValue }}\n </mat-option>\n</mat-select>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
350
|
+
};
|
351
|
+
WlcmSelectComponent = __decorate([
|
352
|
+
UntilDestroy(),
|
353
|
+
__metadata("design:paramtypes", [ChangeDetectorRef, Object])
|
354
|
+
], WlcmSelectComponent);
|
355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmSelectComponent, decorators: [{
|
356
|
+
type: Component,
|
357
|
+
args: [{ selector: 'wlcm-select', standalone: true, imports: [CommonModule, MatSelectModule, ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
358
|
+
WLCM_FORM_CONTROL_PROVIDER,
|
359
|
+
{ provide: MAT_SELECT_CONFIG, useValue: { overlayPanelClass: PANEL_CLASS } },
|
360
|
+
{ provide: NG_VALIDATORS, useExisting: forwardRef(() => WlcmSelectComponent), multi: true },
|
361
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => WlcmSelectComponent), multi: true },
|
362
|
+
], template: "<mat-select\n #selectComponent\n [multiple]=\"multiple\"\n [disableRipple]=\"true\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [hideSingleSelectionIndicator]=\"true\"\n [ngClass]=\"{ focused: selectComponent.focused }\"\n (selectionChange)=\"select($event)\"\n (opened)=\"panelOpened()\"\n>\n <mat-option *ngFor=\"let option of options\" [value]=\"option.value\">\n {{ option.viewValue }}\n </mat-option>\n</mat-select>\n", styles: [":host{display:block}\n"] }]
|
363
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
364
|
+
type: Optional
|
365
|
+
}, {
|
366
|
+
type: Inject,
|
367
|
+
args: [WLCM_FORM_CONTROL]
|
368
|
+
}] }], propDecorators: { multiple: [{
|
369
|
+
type: Input
|
370
|
+
}], placeholder: [{
|
371
|
+
type: Input
|
372
|
+
}], options: [{
|
373
|
+
type: Input
|
374
|
+
}] } });
|
375
|
+
|
376
|
+
let AutocompleteDirective = class AutocompleteDirective {
|
377
|
+
constructor(zone, autocomplete) {
|
378
|
+
this.zone = zone;
|
379
|
+
this.autocomplete = autocomplete;
|
380
|
+
this.panelScrolled = new EventEmitter();
|
381
|
+
this._scrollWidth = 0;
|
382
|
+
this._scrollWidthChanged = false;
|
383
|
+
this.handleOpenEvent();
|
384
|
+
}
|
385
|
+
handleOpenEvent() {
|
386
|
+
this.autocomplete.opened
|
387
|
+
.pipe(untilDestroyed(this))
|
388
|
+
.pipe(observeOn(asyncScheduler))
|
389
|
+
.subscribe(() => this.zone.runOutsideAngular(() => this.handleScrolling()));
|
390
|
+
}
|
391
|
+
handleScrolling() {
|
392
|
+
const panel = this.autocomplete.panel.nativeElement;
|
393
|
+
this.setScrollWidth(panel.scrollWidth);
|
394
|
+
fromEvent(panel, 'scroll')
|
395
|
+
.pipe(takeUntil(this.autocomplete.closed))
|
396
|
+
.subscribe(() => {
|
397
|
+
if (this._scrollWidth !== panel.scrollWidth) {
|
398
|
+
this.setScrollWidth(panel.scrollWidth);
|
399
|
+
}
|
400
|
+
if (panel.scrollWidth * 0.6 <= panel.scrollTop && this._scrollWidthChanged) {
|
401
|
+
this.zone.run(() => this.panelScrolled.emit());
|
402
|
+
this._scrollWidthChanged = false;
|
403
|
+
}
|
404
|
+
});
|
405
|
+
}
|
406
|
+
setScrollWidth(width) {
|
407
|
+
this._scrollWidth = width;
|
408
|
+
this._scrollWidthChanged = true;
|
409
|
+
}
|
410
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: AutocompleteDirective, deps: [{ token: i0.NgZone }, { token: i1$1.MatAutocomplete, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
411
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.5", type: AutocompleteDirective, isStandalone: true, selector: "[wlcmAutocomplete]", outputs: { panelScrolled: "panelScrolled" }, ngImport: i0 }); }
|
412
|
+
};
|
413
|
+
AutocompleteDirective = __decorate([
|
414
|
+
UntilDestroy(),
|
415
|
+
__metadata("design:paramtypes", [NgZone, MatAutocomplete])
|
416
|
+
], AutocompleteDirective);
|
417
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: AutocompleteDirective, decorators: [{
|
418
|
+
type: Directive,
|
419
|
+
args: [{
|
420
|
+
selector: '[wlcmAutocomplete]',
|
421
|
+
standalone: true,
|
422
|
+
}]
|
423
|
+
}], ctorParameters: () => [{ type: i0.NgZone }, { type: i1$1.MatAutocomplete, decorators: [{
|
424
|
+
type: Host
|
425
|
+
}, {
|
426
|
+
type: Optional
|
427
|
+
}] }], propDecorators: { panelScrolled: [{
|
428
|
+
type: Output
|
429
|
+
}] } });
|
430
|
+
|
431
|
+
let WlcmAutocompleteComponent = class WlcmAutocompleteComponent {
|
432
|
+
constructor(formField) {
|
433
|
+
this.formField = formField;
|
434
|
+
this.required = false;
|
435
|
+
this.placeholder = '';
|
436
|
+
this.control = new FormControl('');
|
437
|
+
this._loadMore$ = new Subject();
|
438
|
+
this._options$ = new BehaviorSubject([]);
|
439
|
+
this.options$ = this._options$.asObservable();
|
440
|
+
this.closed$ = new Subject();
|
441
|
+
this.queryParams = { ...DEFAULT_QUERY_PARAMS, limit: 15 };
|
442
|
+
this._paginatedData = null;
|
443
|
+
this.handleLoadMoreEvent();
|
444
|
+
this.handleControlValueChanges();
|
445
|
+
}
|
446
|
+
ngOnInit() {
|
447
|
+
this.loadOptions(this.queryParams).subscribe();
|
448
|
+
}
|
449
|
+
ngAfterViewInit() {
|
450
|
+
const container = this.formField.inputContainer;
|
451
|
+
const origin = new MatAutocompleteOrigin(container);
|
452
|
+
this.autocompleteTrigger.connectedTo = origin;
|
453
|
+
}
|
454
|
+
displayWith(value) {
|
455
|
+
if (value instanceof Object) {
|
456
|
+
return value.viewValue;
|
457
|
+
}
|
458
|
+
return value;
|
459
|
+
}
|
460
|
+
loadMore() {
|
461
|
+
this._loadMore$.next();
|
462
|
+
}
|
463
|
+
writeValue(value) {
|
464
|
+
this.control.setValue(value);
|
465
|
+
}
|
466
|
+
registerOnChange(callback) {
|
467
|
+
this._changed = callback;
|
468
|
+
}
|
469
|
+
registerOnTouched(callback) {
|
470
|
+
this._touched = callback;
|
471
|
+
}
|
472
|
+
setDisabledState(isDisabled) {
|
473
|
+
if (isDisabled) {
|
474
|
+
return this.control.disable();
|
475
|
+
}
|
476
|
+
this.control.enable();
|
477
|
+
}
|
478
|
+
blured() {
|
479
|
+
let closed = new Observable((observer) => (observer.next(), observer.complete()));
|
480
|
+
if (this.autocompleteTrigger.panelOpen) {
|
481
|
+
closed = this.closed$.pipe(first(), observeOn(asyncScheduler));
|
482
|
+
}
|
483
|
+
closed.subscribe(() => this._touched?.());
|
484
|
+
}
|
485
|
+
validate(control) {
|
486
|
+
if (!!this.control.value) {
|
487
|
+
if (this.control.value instanceof Object)
|
488
|
+
return null;
|
489
|
+
return { ...control.errors, unselected: true, required: false };
|
490
|
+
}
|
491
|
+
return null;
|
492
|
+
}
|
493
|
+
registerOnValidatorChange(fn) {
|
494
|
+
this._onValidatorChange = fn;
|
495
|
+
}
|
496
|
+
loadOptions(params) {
|
497
|
+
this._options$.next([]);
|
498
|
+
return this.pullDataMethod({ ...params, page: 1 }).pipe(tap((paginatedData) => {
|
499
|
+
this._paginatedData = paginatedData;
|
500
|
+
this._options$.next(paginatedData.data);
|
501
|
+
}));
|
502
|
+
}
|
503
|
+
handleLoadMoreEvent() {
|
504
|
+
this._loadMore$
|
505
|
+
.pipe(concatMap(() => {
|
506
|
+
if (this._paginatedData && this._paginatedData.currPage + 1 <= this._paginatedData.totalPages) {
|
507
|
+
this.queryParams.page++;
|
508
|
+
return this.pullDataMethod(this.queryParams).pipe(tap((paginatedData) => {
|
509
|
+
this._paginatedData = paginatedData;
|
510
|
+
this._options$.next([...this._options$.value, ...paginatedData.data]);
|
511
|
+
}));
|
512
|
+
}
|
513
|
+
return EMPTY;
|
514
|
+
}))
|
515
|
+
.subscribe();
|
516
|
+
}
|
517
|
+
handleControlValueChanges() {
|
518
|
+
this.control.valueChanges
|
519
|
+
.pipe(debounceTime(200))
|
520
|
+
.pipe(untilDestroyed(this))
|
521
|
+
.pipe(filter((value) => {
|
522
|
+
this._onValidatorChange?.();
|
523
|
+
if (!(value instanceof Object))
|
524
|
+
return true;
|
525
|
+
this._changed?.(value.value);
|
526
|
+
return false;
|
527
|
+
}))
|
528
|
+
.pipe(switchMap((value) => {
|
529
|
+
return this.loadOptions({ ...this.queryParams, query: value });
|
530
|
+
}))
|
531
|
+
.subscribe();
|
532
|
+
}
|
533
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmAutocompleteComponent, deps: [{ token: WLCM_FORM_FIELD }], target: i0.ɵɵFactoryTarget.Component }); }
|
534
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: WlcmAutocompleteComponent, isStandalone: true, selector: "wlcm-autocomplete", inputs: { pullDataMethod: "pullDataMethod", label: "label", required: "required", placeholder: "placeholder" }, providers: [
|
535
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => WlcmAutocompleteComponent), multi: true },
|
536
|
+
{ provide: NG_VALIDATORS, useExisting: forwardRef(() => WlcmAutocompleteComponent), multi: true },
|
537
|
+
], viewQueries: [{ propertyName: "wlcmInput", first: true, predicate: WLCM_INPUT, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<input\n wlcmInput\n type=\"text\"\n [matAutocomplete]=\"autocomplete\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n (blur)=\"blured()\"\n/>\n\n<mat-autocomplete\n #autocomplete=\"matAutocomplete\"\n wlcmAutocomplete\n [disableRipple]=\"true\"\n [displayWith]=\"displayWith\"\n [hideSingleSelectionIndicator]=\"true\"\n (panelScrolled)=\"loadMore()\"\n (closed)=\"closed$.next()\"\n>\n <mat-option *ngFor=\"let option of options$ | async\" [value]=\"option\">\n {{ option.viewValue }}\n </mat-option>\n</mat-autocomplete>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i1$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i1$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: AutocompleteDirective, selector: "[wlcmAutocomplete]", outputs: ["panelScrolled"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: WlcmInputDirective, selector: "[wlcmInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
538
|
+
};
|
539
|
+
WlcmAutocompleteComponent = __decorate([
|
540
|
+
UntilDestroy(),
|
541
|
+
__metadata("design:paramtypes", [Object])
|
542
|
+
], WlcmAutocompleteComponent);
|
543
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmAutocompleteComponent, decorators: [{
|
544
|
+
type: Component,
|
545
|
+
args: [{ selector: 'wlcm-autocomplete', standalone: true, imports: [
|
546
|
+
CommonModule,
|
547
|
+
MatAutocompleteModule,
|
548
|
+
AutocompleteDirective,
|
549
|
+
ReactiveFormsModule,
|
550
|
+
WlcmFormFieldComponent,
|
551
|
+
WlcmLabelComponent,
|
552
|
+
WlcmInputDirective,
|
553
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
554
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => WlcmAutocompleteComponent), multi: true },
|
555
|
+
{ provide: NG_VALIDATORS, useExisting: forwardRef(() => WlcmAutocompleteComponent), multi: true },
|
556
|
+
], template: "<input\n wlcmInput\n type=\"text\"\n [matAutocomplete]=\"autocomplete\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n (blur)=\"blured()\"\n/>\n\n<mat-autocomplete\n #autocomplete=\"matAutocomplete\"\n wlcmAutocomplete\n [disableRipple]=\"true\"\n [displayWith]=\"displayWith\"\n [hideSingleSelectionIndicator]=\"true\"\n (panelScrolled)=\"loadMore()\"\n (closed)=\"closed$.next()\"\n>\n <mat-option *ngFor=\"let option of options$ | async\" [value]=\"option\">\n {{ option.viewValue }}\n </mat-option>\n</mat-autocomplete>\n", styles: [":host{display:block}\n"] }]
|
557
|
+
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
558
|
+
type: Inject,
|
559
|
+
args: [WLCM_FORM_FIELD]
|
560
|
+
}] }], propDecorators: { pullDataMethod: [{
|
561
|
+
type: Input
|
562
|
+
}], label: [{
|
563
|
+
type: Input
|
564
|
+
}], required: [{
|
565
|
+
type: Input
|
566
|
+
}], placeholder: [{
|
567
|
+
type: Input
|
568
|
+
}], wlcmInput: [{
|
569
|
+
type: ViewChild,
|
570
|
+
args: [WLCM_INPUT]
|
571
|
+
}], autocompleteTrigger: [{
|
572
|
+
type: ViewChild,
|
573
|
+
args: [MatAutocompleteTrigger]
|
574
|
+
}] } });
|
575
|
+
|
576
|
+
class WlcmAcInputBinderDirective {
|
577
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmAcInputBinderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
578
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.5", type: WlcmAcInputBinderDirective, isStandalone: true, selector: "[wlcmAcInputBinder]", providers: [
|
579
|
+
{
|
580
|
+
provide: WLCM_INPUT_BINDER,
|
581
|
+
useFactory: () => {
|
582
|
+
const ac = inject(WlcmAutocompleteComponent, { self: true });
|
583
|
+
return { bind: () => ac.wlcmInput?.get() };
|
584
|
+
},
|
585
|
+
},
|
586
|
+
], ngImport: i0 }); }
|
587
|
+
}
|
588
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmAcInputBinderDirective, decorators: [{
|
589
|
+
type: Directive,
|
590
|
+
args: [{
|
591
|
+
standalone: true,
|
592
|
+
selector: '[wlcmAcInputBinder]',
|
593
|
+
providers: [
|
594
|
+
{
|
595
|
+
provide: WLCM_INPUT_BINDER,
|
596
|
+
useFactory: () => {
|
597
|
+
const ac = inject(WlcmAutocompleteComponent, { self: true });
|
598
|
+
return { bind: () => ac.wlcmInput?.get() };
|
599
|
+
},
|
600
|
+
},
|
601
|
+
],
|
602
|
+
}]
|
603
|
+
}] });
|
604
|
+
|
605
|
+
class WlcmFormFieldSuffixDirective {
|
606
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldSuffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
607
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.5", type: WlcmFormFieldSuffixDirective, isStandalone: true, selector: "[wlcmFormFieldSuffix]", ngImport: i0 }); }
|
608
|
+
}
|
609
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldSuffixDirective, decorators: [{
|
610
|
+
type: Directive,
|
611
|
+
args: [{
|
612
|
+
selector: '[wlcmFormFieldSuffix]',
|
613
|
+
standalone: true,
|
614
|
+
}]
|
615
|
+
}] });
|
616
|
+
|
617
|
+
class WlcmFormFieldHintDirective {
|
618
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldHintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
619
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.5", type: WlcmFormFieldHintDirective, isStandalone: true, selector: "[wlcmFormFieldHint]", host: { classAttribute: "wlcm-hint" }, ngImport: i0 }); }
|
620
|
+
}
|
621
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormFieldHintDirective, decorators: [{
|
622
|
+
type: Directive,
|
623
|
+
args: [{
|
624
|
+
selector: '[wlcmFormFieldHint]',
|
625
|
+
host: { class: 'wlcm-hint' },
|
626
|
+
standalone: true,
|
627
|
+
}]
|
628
|
+
}] });
|
629
|
+
|
630
|
+
const directives = [
|
631
|
+
WlcmInputDirective,
|
632
|
+
WlcmFormFieldCustomContainerDirective,
|
633
|
+
WlcmFormFieldSuffixDirective,
|
634
|
+
WlcmAcInputBinderDirective,
|
635
|
+
WlcmFormFieldHintDirective,
|
636
|
+
];
|
637
|
+
const components = [
|
638
|
+
WlcmFormFieldComponent,
|
639
|
+
WlcmAutocompleteComponent,
|
640
|
+
WlcmSelectComponent,
|
641
|
+
WlcmLabelComponent,
|
642
|
+
];
|
643
|
+
class WlcmFormsModule {
|
644
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
645
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormsModule, imports: [WlcmFormFieldComponent,
|
646
|
+
WlcmAutocompleteComponent,
|
647
|
+
WlcmSelectComponent,
|
648
|
+
WlcmLabelComponent, WlcmInputDirective,
|
649
|
+
WlcmFormFieldCustomContainerDirective,
|
650
|
+
WlcmFormFieldSuffixDirective,
|
651
|
+
WlcmAcInputBinderDirective,
|
652
|
+
WlcmFormFieldHintDirective], exports: [WlcmFormFieldComponent,
|
653
|
+
WlcmAutocompleteComponent,
|
654
|
+
WlcmSelectComponent,
|
655
|
+
WlcmLabelComponent, WlcmInputDirective,
|
656
|
+
WlcmFormFieldCustomContainerDirective,
|
657
|
+
WlcmFormFieldSuffixDirective,
|
658
|
+
WlcmAcInputBinderDirective,
|
659
|
+
WlcmFormFieldHintDirective] }); }
|
660
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormsModule, imports: [components] }); }
|
661
|
+
}
|
662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: WlcmFormsModule, decorators: [{
|
663
|
+
type: NgModule,
|
664
|
+
args: [{
|
665
|
+
imports: [...components, ...directives],
|
666
|
+
exports: [...components, ...directives],
|
667
|
+
}]
|
668
|
+
}] });
|
669
|
+
|
670
|
+
/**
|
671
|
+
* Generated bundle index. Do not edit.
|
672
|
+
*/
|
673
|
+
|
674
|
+
export { WLCM_ERRORS, WLCM_FORM, WLCM_FORM_CONTROL, WLCM_FORM_CONTROL_PROVIDER, WLCM_FORM_FIELD, WLCM_FORM_PROVIDER, WLCM_INPUT, WLCM_INPUT_BINDER, WLCM_PRIORITY_ERRORS, WlcmAcInputBinderDirective, WlcmAutocompleteComponent, WlcmErrorComponent, WlcmFormFieldComponent, WlcmFormFieldCustomContainerDirective, WlcmFormFieldHintDirective, WlcmFormFieldSuffixDirective, WlcmFormsModule, WlcmInputDirective, WlcmLabelComponent, WlcmSelectComponent };
|
675
|
+
//# sourceMappingURL=wlcm-angular-forms.mjs.map
|