@tft/crispr-forms 21.0.3 → 21.0.4
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/tft-crispr-forms-autocomplete-field.component-CpEWI7bT.mjs +95 -0
- package/fesm2022/tft-crispr-forms-autocomplete-field.component-CpEWI7bT.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-BICpK-GR.mjs +2 -0
- package/fesm2022/tft-crispr-forms-index-BICpK-GR.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-CG3cLos3.mjs +88 -0
- package/fesm2022/tft-crispr-forms-index-CG3cLos3.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-CLJ89Dev.mjs +73 -0
- package/fesm2022/tft-crispr-forms-index-CLJ89Dev.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-CvTUJeC6.mjs +39 -0
- package/fesm2022/tft-crispr-forms-index-CvTUJeC6.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-D6cKptyg.mjs +36 -0
- package/fesm2022/tft-crispr-forms-index-D6cKptyg.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-DAx6Am4i.mjs +40 -0
- package/fesm2022/tft-crispr-forms-index-DAx6Am4i.mjs.map +1 -0
- package/fesm2022/{tft-crispr-forms-index-BQFuEW6x.mjs → tft-crispr-forms-index-DEu5NqmR.mjs} +3 -3
- package/fesm2022/tft-crispr-forms-index-DEu5NqmR.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-DOpDpDdt.mjs +179 -0
- package/fesm2022/tft-crispr-forms-index-DOpDpDdt.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-DW1QGkrv.mjs +137 -0
- package/fesm2022/tft-crispr-forms-index-DW1QGkrv.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-DuvnSHLl.mjs +39 -0
- package/fesm2022/tft-crispr-forms-index-DuvnSHLl.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-DvrD-Lli.mjs +190 -0
- package/fesm2022/tft-crispr-forms-index-DvrD-Lli.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms-index-usD7jUs3.mjs +68 -0
- package/fesm2022/tft-crispr-forms-index-usD7jUs3.mjs.map +1 -0
- package/fesm2022/tft-crispr-forms.mjs +60 -52
- package/fesm2022/tft-crispr-forms.mjs.map +1 -1
- package/package.json +1 -1
- package/types/tft-crispr-forms.d.ts +14 -14
- package/fesm2022/tft-crispr-forms-autocomplete-field.component-ChocHy3F.mjs +0 -95
- package/fesm2022/tft-crispr-forms-autocomplete-field.component-ChocHy3F.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-BQFuEW6x.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-BZ9V1Ec-.mjs +0 -39
- package/fesm2022/tft-crispr-forms-index-BZ9V1Ec-.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-BkCdLt5V.mjs +0 -40
- package/fesm2022/tft-crispr-forms-index-BkCdLt5V.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-Bypm5YtY.mjs +0 -137
- package/fesm2022/tft-crispr-forms-index-Bypm5YtY.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-CFwkbxFk.mjs +0 -88
- package/fesm2022/tft-crispr-forms-index-CFwkbxFk.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-DEctfeGr.mjs +0 -2
- package/fesm2022/tft-crispr-forms-index-DEctfeGr.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-DcrZSpdk.mjs +0 -73
- package/fesm2022/tft-crispr-forms-index-DcrZSpdk.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-DmaDlaNf.mjs +0 -68
- package/fesm2022/tft-crispr-forms-index-DmaDlaNf.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-Hsgr_WHO.mjs +0 -190
- package/fesm2022/tft-crispr-forms-index-Hsgr_WHO.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-gORcx6V1.mjs +0 -36
- package/fesm2022/tft-crispr-forms-index-gORcx6V1.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-lrhnilye.mjs +0 -39
- package/fesm2022/tft-crispr-forms-index-lrhnilye.mjs.map +0 -1
- package/fesm2022/tft-crispr-forms-index-uu4CyAEP.mjs +0 -182
- package/fesm2022/tft-crispr-forms-index-uu4CyAEP.mjs.map +0 -1
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import * as i2 from '@angular/material/autocomplete';
|
|
4
|
+
import { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';
|
|
5
|
+
import * as i1$1 from '@angular/common';
|
|
6
|
+
import { CommonModule } from '@angular/common';
|
|
7
|
+
import * as i1 from '@angular/forms';
|
|
8
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
9
|
+
import * as i3 from '@angular/material/input';
|
|
10
|
+
import { MatInputModule } from '@angular/material/input';
|
|
11
|
+
import { MatOptionModule } from '@angular/material/core';
|
|
12
|
+
import { O as OptionComponent } from './tft-crispr-forms-index-UAYeTe3L.mjs';
|
|
13
|
+
import * as i6 from '@tft/form-validation-handler';
|
|
14
|
+
import { FormValidationHandlerModule } from '@tft/form-validation-handler';
|
|
15
|
+
import { DEFAULT_EMPTY_OPTIONS_MESSAGE, AbstractAutocompleteComponent, InfoComponent, FieldContainerComponent } from './tft-crispr-forms.mjs';
|
|
16
|
+
import * as i2$1 from '@angular/material/form-field';
|
|
17
|
+
|
|
18
|
+
/* eslint-disable @nx/enforce-module-boundaries */
|
|
19
|
+
const defaultConfig = {
|
|
20
|
+
autoActiveFirstOption: true,
|
|
21
|
+
typeDebounceTime: 500,
|
|
22
|
+
emptyOptionsMessage: DEFAULT_EMPTY_OPTIONS_MESSAGE,
|
|
23
|
+
};
|
|
24
|
+
class AutocompleteFieldComponent extends AbstractAutocompleteComponent {
|
|
25
|
+
constructor() {
|
|
26
|
+
super(...arguments);
|
|
27
|
+
this.defaultConfig = defaultConfig;
|
|
28
|
+
}
|
|
29
|
+
ngOnInit() {
|
|
30
|
+
super.ngOnInit();
|
|
31
|
+
this.clearFieldSubscription =
|
|
32
|
+
this.autocompleteInputControl.valueChanges.subscribe((text) => {
|
|
33
|
+
if (typeof text === 'string' && text?.trim() === '') {
|
|
34
|
+
this.control().setValue(null);
|
|
35
|
+
}
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
ngOnDestroy() {
|
|
39
|
+
this.clearFieldSubscription.unsubscribe();
|
|
40
|
+
}
|
|
41
|
+
setControlValue(value) {
|
|
42
|
+
if (this.control() && value) {
|
|
43
|
+
// sets the initial value on the control if one is passed
|
|
44
|
+
this.control().setValue(value.value || '');
|
|
45
|
+
this.autocompleteInputControl.setValue(value.label || '');
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
/**
|
|
49
|
+
* The material autocomplete defaults to displaying the options value instead of its label.
|
|
50
|
+
* We only have the value from the selected option to work with, so we have to pass the options
|
|
51
|
+
* through a function called in the template and return the function that the material displayWith
|
|
52
|
+
* input is expecting.
|
|
53
|
+
* @param options the array of options to search for option with corresponding value
|
|
54
|
+
*/
|
|
55
|
+
displayLabel(options) {
|
|
56
|
+
if (this.config().displayWith) {
|
|
57
|
+
return this.config().displayWith(options);
|
|
58
|
+
}
|
|
59
|
+
return (value) => {
|
|
60
|
+
const label = !!options && Array.isArray(options)
|
|
61
|
+
? options.find((option) => JSON.stringify(option.value) === JSON.stringify(value))?.label
|
|
62
|
+
: value;
|
|
63
|
+
return label;
|
|
64
|
+
};
|
|
65
|
+
}
|
|
66
|
+
handleSelect(event) {
|
|
67
|
+
this.control().setValue(event.option.value);
|
|
68
|
+
this.autoInputRef.nativeElement.blur();
|
|
69
|
+
}
|
|
70
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: AutocompleteFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
71
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: AutocompleteFieldComponent, isStandalone: true, selector: "crispr-autocomplete-field", viewQueries: [{ propertyName: "autoInput", first: true, predicate: ["autoInput"], descendants: true, read: MatAutocompleteTrigger }, { propertyName: "autoInputRef", first: true, predicate: ["autoInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\n<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n\n <input class=\"hidden-error-directive-anchor\" [formControlName]=\"config().controlName\" type=\"text\"/>\n\n <input\n matInput\n [formControl]=\"autocompleteInputControl\"\n [placeholder]=\"config().placeholder\"\n [matAutocomplete]=\"auto\"\n role=\"textbox\"\n type=\"textbox\"\n autocapitalize=\"off\"\n autocorrect=\"off\"\n spellcheck=\"false\"\n #autoInput>\n\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info \"></crispr-info>}\n\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [autoActiveFirstOption]=\"config().autoActiveFirstOption\"\n (optionSelected)=\"handleSelect($event)\"\n [displayWith]=\"displayLabel(options$ | async)\">\n\n @if (options$ | async; as options) {\n @if (options.length > 0) {\n @for (option of options; track option.value) {\n <mat-option\n [value]=\"option.value\">\n <crispr-option [option]=\"option\"></crispr-option>\n </mat-option>\n }\n } @else {\n <mat-option disabled=\"true\">\n {{config().emptyOptionsMessage}}\n </mat-option>\n }\n } @else {\n <mat-option disabled=\"true\">\n {{config().emptyOptionsMessage}}\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n</crispr-field-container>\n", styles: [".hidden-error-directive-anchor{display:none}crispr-info[matSuffix]{margin-right:.75em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }, { kind: "component", type: OptionComponent, selector: "crispr-option", inputs: ["option"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2.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: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsDirective, selector: "[formControl], [formControlName]" }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
|
|
72
|
+
}
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: AutocompleteFieldComponent, decorators: [{
|
|
74
|
+
type: Component,
|
|
75
|
+
args: [{ selector: 'crispr-autocomplete-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
76
|
+
CommonModule,
|
|
77
|
+
InfoComponent,
|
|
78
|
+
OptionComponent,
|
|
79
|
+
ReactiveFormsModule,
|
|
80
|
+
FieldContainerComponent,
|
|
81
|
+
MatAutocompleteModule,
|
|
82
|
+
MatInputModule,
|
|
83
|
+
MatOptionModule,
|
|
84
|
+
FormValidationHandlerModule,
|
|
85
|
+
], standalone: true, template: "\n<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n\n <input class=\"hidden-error-directive-anchor\" [formControlName]=\"config().controlName\" type=\"text\"/>\n\n <input\n matInput\n [formControl]=\"autocompleteInputControl\"\n [placeholder]=\"config().placeholder\"\n [matAutocomplete]=\"auto\"\n role=\"textbox\"\n type=\"textbox\"\n autocapitalize=\"off\"\n autocorrect=\"off\"\n spellcheck=\"false\"\n #autoInput>\n\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info \"></crispr-info>}\n\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [autoActiveFirstOption]=\"config().autoActiveFirstOption\"\n (optionSelected)=\"handleSelect($event)\"\n [displayWith]=\"displayLabel(options$ | async)\">\n\n @if (options$ | async; as options) {\n @if (options.length > 0) {\n @for (option of options; track option.value) {\n <mat-option\n [value]=\"option.value\">\n <crispr-option [option]=\"option\"></crispr-option>\n </mat-option>\n }\n } @else {\n <mat-option disabled=\"true\">\n {{config().emptyOptionsMessage}}\n </mat-option>\n }\n } @else {\n <mat-option disabled=\"true\">\n {{config().emptyOptionsMessage}}\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n</crispr-field-container>\n", styles: [".hidden-error-directive-anchor{display:none}crispr-info[matSuffix]{margin-right:.75em}\n"] }]
|
|
86
|
+
}], propDecorators: { autoInput: [{
|
|
87
|
+
type: ViewChild,
|
|
88
|
+
args: ['autoInput', { read: MatAutocompleteTrigger }]
|
|
89
|
+
}], autoInputRef: [{
|
|
90
|
+
type: ViewChild,
|
|
91
|
+
args: ['autoInput']
|
|
92
|
+
}] } });
|
|
93
|
+
|
|
94
|
+
export { AutocompleteFieldComponent as A };
|
|
95
|
+
//# sourceMappingURL=tft-crispr-forms-autocomplete-field.component-CpEWI7bT.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-autocomplete-field.component-CpEWI7bT.mjs","sources":["../../../../libs/crispr-forms/src/lib/ui/autocomplete-field/autocomplete-field.component.ts","../../../../libs/crispr-forms/src/lib/ui/autocomplete-field/autocomplete-field.component.html"],"sourcesContent":["/* eslint-disable @nx/enforce-module-boundaries */\nimport {\n Component,\n OnInit,\n ViewChild,\n ChangeDetectionStrategy,\n ElementRef,\n OnDestroy,\n} from '@angular/core';\nimport {\n MatAutocompleteTrigger,\n MatAutocompleteSelectedEvent,\n MatAutocompleteModule,\n} from '@angular/material/autocomplete';\n\nimport { Subscription } from 'rxjs';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatOptionModule } from '@angular/material/core';\nimport { OptionComponent } from '../option';\nimport { FormValidationHandlerModule } from '@tft/form-validation-handler';\n\nimport { FieldContainerComponent } from '../field-container';\nimport {\n SelectOption,\n AbstractAutocompleteComponent,\n AutocompleteFieldConfig,\n DEFAULT_EMPTY_OPTIONS_MESSAGE,\n} from '../../utils';\nimport { InfoComponent } from '../info';\n\nconst defaultConfig: Partial<AutocompleteFieldConfig> = {\n autoActiveFirstOption: true,\n typeDebounceTime: 500,\n emptyOptionsMessage: DEFAULT_EMPTY_OPTIONS_MESSAGE,\n};\n\n@Component({\n selector: 'crispr-autocomplete-field',\n templateUrl: './autocomplete-field.component.html',\n styleUrls: ['./autocomplete-field.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n CommonModule,\n InfoComponent,\n OptionComponent,\n ReactiveFormsModule,\n FieldContainerComponent,\n MatAutocompleteModule,\n MatInputModule,\n MatOptionModule,\n FormValidationHandlerModule,\n ],\n standalone: true\n})\nexport class AutocompleteFieldComponent\n extends AbstractAutocompleteComponent<AutocompleteFieldConfig>\n implements OnInit, OnDestroy\n{\n defaultConfig = defaultConfig;\n @ViewChild('autoInput', { read: MatAutocompleteTrigger })\n autoInput: MatAutocompleteTrigger;\n @ViewChild('autoInput') autoInputRef: ElementRef<HTMLInputElement>;\n\n clearFieldSubscription: Subscription;\n\n ngOnInit() {\n super.ngOnInit();\n this.clearFieldSubscription =\n this.autocompleteInputControl.valueChanges.subscribe((text: string) => {\n if (typeof text === 'string' && text?.trim() === '') {\n this.control().setValue(null);\n }\n });\n }\n\n ngOnDestroy() {\n this.clearFieldSubscription.unsubscribe();\n }\n\n setControlValue(value: SelectOption) {\n if (this.control() && value) {\n // sets the initial value on the control if one is passed\n this.control().setValue(value.value || '');\n this.autocompleteInputControl.setValue(value.label || '');\n }\n }\n\n /**\n * The material autocomplete defaults to displaying the options value instead of its label.\n * We only have the value from the selected option to work with, so we have to pass the options\n * through a function called in the template and return the function that the material displayWith\n * input is expecting.\n * @param options the array of options to search for option with corresponding value\n */\n displayLabel(options: SelectOption[]) {\n if (this.config().displayWith) {\n return this.config().displayWith(options);\n }\n return (value: any) => {\n const label: string =\n !!options && Array.isArray(options)\n ? options.find(\n (option) => JSON.stringify(option.value) === JSON.stringify(value)\n )?.label\n : value;\n return label;\n };\n }\n\n handleSelect(event: MatAutocompleteSelectedEvent) {\n this.control().setValue(event.option.value);\n this.autoInputRef.nativeElement.blur();\n }\n}\n","\n<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n\n <input class=\"hidden-error-directive-anchor\" [formControlName]=\"config().controlName\" type=\"text\"/>\n\n <input\n matInput\n [formControl]=\"autocompleteInputControl\"\n [placeholder]=\"config().placeholder\"\n [matAutocomplete]=\"auto\"\n role=\"textbox\"\n type=\"textbox\"\n autocapitalize=\"off\"\n autocorrect=\"off\"\n spellcheck=\"false\"\n #autoInput>\n\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info \"></crispr-info>}\n\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [autoActiveFirstOption]=\"config().autoActiveFirstOption\"\n (optionSelected)=\"handleSelect($event)\"\n [displayWith]=\"displayLabel(options$ | async)\">\n\n @if (options$ | async; as options) {\n @if (options.length > 0) {\n @for (option of options; track option.value) {\n <mat-option\n [value]=\"option.value\">\n <crispr-option [option]=\"option\"></crispr-option>\n </mat-option>\n }\n } @else {\n <mat-option disabled=\"true\">\n {{config().emptyOptionsMessage}}\n </mat-option>\n }\n } @else {\n <mat-option disabled=\"true\">\n {{config().emptyOptionsMessage}}\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n</crispr-field-container>\n"],"names":["i4","i5","i6"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-index-BICpK-GR.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import * as i1$1 from '@angular/common';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import * as i0 from '@angular/core';
|
|
4
|
+
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
5
|
+
import * as i1 from '@angular/forms';
|
|
6
|
+
import { FormControl, ReactiveFormsModule } from '@angular/forms';
|
|
7
|
+
import { MatOptionModule } from '@angular/material/core';
|
|
8
|
+
import * as i3 from '@angular/material/input';
|
|
9
|
+
import { MatInputModule } from '@angular/material/input';
|
|
10
|
+
import * as i3$1 from '@angular/material/select';
|
|
11
|
+
import { MatSelectModule } from '@angular/material/select';
|
|
12
|
+
import { combineLatest } from 'rxjs';
|
|
13
|
+
import { startWith } from 'rxjs/operators';
|
|
14
|
+
import { O as OptionComponent } from './tft-crispr-forms-index-UAYeTe3L.mjs';
|
|
15
|
+
import * as i6 from '@tft/form-validation-handler';
|
|
16
|
+
import { FormValidationHandlerModule } from '@tft/form-validation-handler';
|
|
17
|
+
import { CrisprControlComponent, observablifyOptions, InfoComponent, FieldContainerComponent } from './tft-crispr-forms.mjs';
|
|
18
|
+
import * as i2 from '@angular/material/form-field';
|
|
19
|
+
import * as i2$1 from '@angular/material/autocomplete';
|
|
20
|
+
|
|
21
|
+
/* eslint-disable @nx/enforce-module-boundaries */
|
|
22
|
+
const defaultConfig = {};
|
|
23
|
+
class UnitConversionFieldComponent extends CrisprControlComponent {
|
|
24
|
+
constructor() {
|
|
25
|
+
super(...arguments);
|
|
26
|
+
this.defaultConfig = defaultConfig;
|
|
27
|
+
this.displayValueControl = new FormControl();
|
|
28
|
+
this.unitSelectControl = new FormControl();
|
|
29
|
+
}
|
|
30
|
+
ngOnInit() {
|
|
31
|
+
const config = this.config();
|
|
32
|
+
super.ngOnInit();
|
|
33
|
+
// TODO: Validators need work. validation is tricky because the input needs to be validated against but the validator will compare against the controls value
|
|
34
|
+
// this.displayValueControl.setValidators(this.config.validators);
|
|
35
|
+
const controlValuePipeline = [
|
|
36
|
+
this.displayValueControl.valueChanges.pipe(startWith(this.displayValueControl.value)),
|
|
37
|
+
];
|
|
38
|
+
// setup all required pieces when showing a field for selecting units
|
|
39
|
+
if (config.showUnitSelect === true) {
|
|
40
|
+
this.unitOptions$ = observablifyOptions(config.selectableUnits, this.group());
|
|
41
|
+
controlValuePipeline.push(this.unitSelectControl.valueChanges.pipe(startWith(config?.initialDisplayUnit || null)));
|
|
42
|
+
this.unitSelectControl.setValue(config?.initialDisplayUnit || null);
|
|
43
|
+
}
|
|
44
|
+
this.transformationSubscription = combineLatest(controlValuePipeline).subscribe(([displayValue, unitValue]) => {
|
|
45
|
+
const computedValue = this.config().storedValueConversion(displayValue, unitValue);
|
|
46
|
+
this.control().setValue(computedValue);
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
ngOnDestroy() {
|
|
50
|
+
this.transformationSubscription.unsubscribe();
|
|
51
|
+
}
|
|
52
|
+
setInitialDisplayValue(storedValue, unit) {
|
|
53
|
+
const initialDisplayValue = this.config().initialDisplayValueConversion(storedValue || null, unit);
|
|
54
|
+
this.displayValueControl.setValue(initialDisplayValue);
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* We override the 'setControlValue' we inherited from crisprControlMixin and add our custom logic,
|
|
58
|
+
* This function gets called onInit because were object oriented. it's so great, so great that I'm
|
|
59
|
+
* typing a paragraph to explain what the hell is going on...
|
|
60
|
+
* @param value the initial value for the control passed down from the form components input
|
|
61
|
+
*/
|
|
62
|
+
setControlValue(value) {
|
|
63
|
+
const config = this.config();
|
|
64
|
+
const initialUnitValue = config.showUnitSelect
|
|
65
|
+
? config?.initialDisplayUnit
|
|
66
|
+
: null;
|
|
67
|
+
this.setInitialDisplayValue(value, initialUnitValue);
|
|
68
|
+
}
|
|
69
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: UnitConversionFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
70
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: UnitConversionFieldComponent, isStandalone: true, selector: "crispr-unit-conversion-field", usesInheritance: true, ngImport: i0, template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n <mat-form-field [attr.data-testid]=\"testId()\" [style.width.%]=\"config().showUnitSelect ? 60 : 100\" class=\"number-field\" [color]=\"config().color\"\n [appearance]=\"config().appearance\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <input type=\"number\" matInput [formControl]=\"displayValueControl\" [placeholder]=\"config().placeholder\"\n [min]=\"config().min\" [max]=\"config().max\" [step]=\"config().step\" [autofocus]=\"config().autofocus\">\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n </mat-form-field>\n\n @if (config().showUnitSelect) {\n <mat-form-field [color]=\"config().color\" [appearance]=\"config().appearance\" [formGroup]=\"group()\" class=\"unit-field\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <mat-select #selectField [formControl]=\"unitSelectControl\">\n @for (option of unitOptions$ | async; track option) {\n <mat-option [value]=\"option.value\">\n <crispr-option [option]=\"option\">\n </crispr-option>\n </mat-option>\n }\n </mat-select>\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n </mat-form-field>\n }\n\n</crispr-field-container>", styles: [".unit-field{width:40%;margin-left:16px}:host ::ng-deep .field-container{display:flex}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }, { kind: "component", type: OptionComponent, selector: "crispr-option", inputs: ["option"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$1.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", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsDirective, selector: "[formControl], [formControlName]" }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
|
|
71
|
+
}
|
|
72
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: UnitConversionFieldComponent, decorators: [{
|
|
73
|
+
type: Component,
|
|
74
|
+
args: [{ selector: 'crispr-unit-conversion-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
75
|
+
CommonModule,
|
|
76
|
+
InfoComponent,
|
|
77
|
+
OptionComponent,
|
|
78
|
+
ReactiveFormsModule,
|
|
79
|
+
FieldContainerComponent,
|
|
80
|
+
MatInputModule,
|
|
81
|
+
MatSelectModule,
|
|
82
|
+
MatOptionModule,
|
|
83
|
+
FormValidationHandlerModule,
|
|
84
|
+
], standalone: true, template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n <mat-form-field [attr.data-testid]=\"testId()\" [style.width.%]=\"config().showUnitSelect ? 60 : 100\" class=\"number-field\" [color]=\"config().color\"\n [appearance]=\"config().appearance\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <input type=\"number\" matInput [formControl]=\"displayValueControl\" [placeholder]=\"config().placeholder\"\n [min]=\"config().min\" [max]=\"config().max\" [step]=\"config().step\" [autofocus]=\"config().autofocus\">\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n </mat-form-field>\n\n @if (config().showUnitSelect) {\n <mat-form-field [color]=\"config().color\" [appearance]=\"config().appearance\" [formGroup]=\"group()\" class=\"unit-field\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <mat-select #selectField [formControl]=\"unitSelectControl\">\n @for (option of unitOptions$ | async; track option) {\n <mat-option [value]=\"option.value\">\n <crispr-option [option]=\"option\">\n </crispr-option>\n </mat-option>\n }\n </mat-select>\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n </mat-form-field>\n }\n\n</crispr-field-container>", styles: [".unit-field{width:40%;margin-left:16px}:host ::ng-deep .field-container{display:flex}\n"] }]
|
|
85
|
+
}] });
|
|
86
|
+
|
|
87
|
+
export { UnitConversionFieldComponent };
|
|
88
|
+
//# sourceMappingURL=tft-crispr-forms-index-CG3cLos3.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-index-CG3cLos3.mjs","sources":["../../../../libs/crispr-forms/src/lib/ui/unit-conversion-field/unit-conversion-field.component.ts","../../../../libs/crispr-forms/src/lib/ui/unit-conversion-field/unit-conversion-field.component.html"],"sourcesContent":["/* eslint-disable @nx/enforce-module-boundaries */\nimport { CommonModule } from '@angular/common';\nimport {\n Component,\n OnInit,\n ChangeDetectionStrategy,\n OnDestroy,\n} from '@angular/core';\nimport { ReactiveFormsModule, FormControl } from '@angular/forms';\nimport { MatOptionModule } from '@angular/material/core';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatSelectModule } from '@angular/material/select';\nimport { combineLatest, Observable, Subscription } from 'rxjs';\nimport { startWith } from 'rxjs/operators';\nimport { OptionComponent } from '../option';\nimport { FormValidationHandlerModule } from '@tft/form-validation-handler';\nimport { FieldContainerComponent } from '../field-container';\nimport { InfoComponent } from '../info';\nimport {\n observablifyOptions,\n SelectOption,\n UnitConversionFieldConfig,\n} from '../../utils';\nimport { CrisprControlComponent } from '../../utils/abstracts/crispr-control.abstract';\n\nconst defaultConfig: Partial<UnitConversionFieldConfig> = {};\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'crispr-unit-conversion-field',\n templateUrl: './unit-conversion-field.component.html',\n styleUrls: ['./unit-conversion-field.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n CommonModule,\n InfoComponent,\n OptionComponent,\n ReactiveFormsModule,\n FieldContainerComponent,\n MatInputModule,\n MatSelectModule,\n MatOptionModule,\n FormValidationHandlerModule,\n ],\n standalone: true\n})\nexport class UnitConversionFieldComponent\n extends CrisprControlComponent<UnitConversionFieldConfig>\n implements OnInit, OnDestroy\n{\n defaultConfig = defaultConfig;\n\n displayValueControl = new FormControl();\n unitSelectControl = new FormControl();\n unitOptions$: Observable<SelectOption[]>;\n\n transformationSubscription: Subscription;\n\n ngOnInit() {\n const config = this.config();\n super.ngOnInit();\n // TODO: Validators need work. validation is tricky because the input needs to be validated against but the validator will compare against the controls value\n // this.displayValueControl.setValidators(this.config.validators);\n\n const controlValuePipeline: Observable<string>[] = [\n this.displayValueControl.valueChanges.pipe(\n startWith(this.displayValueControl.value)\n ),\n ];\n // setup all required pieces when showing a field for selecting units\n if (config.showUnitSelect === true) {\n this.unitOptions$ = observablifyOptions(\n config.selectableUnits,\n this.group()\n );\n controlValuePipeline.push(\n this.unitSelectControl.valueChanges.pipe(\n startWith(config?.initialDisplayUnit || null)\n )\n );\n this.unitSelectControl.setValue(config?.initialDisplayUnit || null);\n }\n\n this.transformationSubscription = combineLatest(\n controlValuePipeline\n ).subscribe(([displayValue, unitValue]) => {\n const computedValue = this.config().storedValueConversion(\n displayValue,\n unitValue\n );\n this.control().setValue(computedValue);\n });\n }\n\n ngOnDestroy() {\n this.transformationSubscription.unsubscribe();\n }\n\n setInitialDisplayValue(storedValue: any, unit: unknown) {\n const initialDisplayValue = this.config().initialDisplayValueConversion(\n storedValue || null,\n unit\n );\n this.displayValueControl.setValue(initialDisplayValue);\n }\n\n /**\n * We override the 'setControlValue' we inherited from crisprControlMixin and add our custom logic,\n * This function gets called onInit because were object oriented. it's so great, so great that I'm\n * typing a paragraph to explain what the hell is going on...\n * @param value the initial value for the control passed down from the form components input\n */\n setControlValue(value) {\n const config = this.config();\n const initialUnitValue = config.showUnitSelect\n ? config?.initialDisplayUnit\n : null;\n this.setInitialDisplayValue(value, initialUnitValue);\n }\n}\n","<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n <mat-form-field [attr.data-testid]=\"testId()\" [style.width.%]=\"config().showUnitSelect ? 60 : 100\" class=\"number-field\" [color]=\"config().color\"\n [appearance]=\"config().appearance\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <input type=\"number\" matInput [formControl]=\"displayValueControl\" [placeholder]=\"config().placeholder\"\n [min]=\"config().min\" [max]=\"config().max\" [step]=\"config().step\" [autofocus]=\"config().autofocus\">\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n </mat-form-field>\n\n @if (config().showUnitSelect) {\n <mat-form-field [color]=\"config().color\" [appearance]=\"config().appearance\" [formGroup]=\"group()\" class=\"unit-field\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <mat-select #selectField [formControl]=\"unitSelectControl\">\n @for (option of unitOptions$ | async; track option) {\n <mat-option [value]=\"option.value\">\n <crispr-option [option]=\"option\">\n </crispr-option>\n </mat-option>\n }\n </mat-select>\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n </mat-form-field>\n }\n\n</crispr-field-container>"],"names":["i2","i3","i4","i5","i7"],"mappings":"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"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import * as i3 from '@angular/material/select';
|
|
4
|
+
import { MatSelectModule } from '@angular/material/select';
|
|
5
|
+
import * as i1$2 from '@angular/common';
|
|
6
|
+
import { CommonModule } from '@angular/common';
|
|
7
|
+
import * as i1 from '@angular/material/checkbox';
|
|
8
|
+
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
9
|
+
import * as i1$1 from '@angular/forms';
|
|
10
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
11
|
+
import * as i2 from '@angular/material/form-field';
|
|
12
|
+
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
13
|
+
import { O as OptionComponent } from './tft-crispr-forms-index-UAYeTe3L.mjs';
|
|
14
|
+
import * as i6 from '@tft/form-validation-handler';
|
|
15
|
+
import { FormValidationHandlerModule } from '@tft/form-validation-handler';
|
|
16
|
+
import { CrisprControlComponent, observablifyOptions, InfoComponent, FieldContainerComponent } from './tft-crispr-forms.mjs';
|
|
17
|
+
import * as i2$1 from '@angular/material/autocomplete';
|
|
18
|
+
|
|
19
|
+
/* eslint-disable @nx/enforce-module-boundaries */
|
|
20
|
+
class SelectFieldComponent extends CrisprControlComponent {
|
|
21
|
+
constructor() {
|
|
22
|
+
super(...arguments);
|
|
23
|
+
this.defaultConfig = {
|
|
24
|
+
enableToggleAll: false,
|
|
25
|
+
color: 'primary',
|
|
26
|
+
};
|
|
27
|
+
this.allSelected = false;
|
|
28
|
+
}
|
|
29
|
+
ngOnInit() {
|
|
30
|
+
super.ngOnInit();
|
|
31
|
+
// options$ can be passed as an array, promise that resolves array, or observable that resolves array
|
|
32
|
+
// this functions accounts for all possibilities and converts to observable that resolves array
|
|
33
|
+
this.options$ = observablifyOptions(this.config().options, this.group());
|
|
34
|
+
}
|
|
35
|
+
ngAfterViewInit() {
|
|
36
|
+
if (this.config().multiple &&
|
|
37
|
+
this.config().enableToggleAll &&
|
|
38
|
+
this.selectField.options?.length === this.value()?.length) {
|
|
39
|
+
this.allSelected = true;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
toggleAll(isSelected) {
|
|
43
|
+
if (isSelected) {
|
|
44
|
+
this.selectField.options.forEach((option) => option.deselect());
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
this.selectField.options.forEach((option) => option.select());
|
|
48
|
+
}
|
|
49
|
+
this.allSelected = !this.allSelected;
|
|
50
|
+
}
|
|
51
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SelectFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
52
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: SelectFieldComponent, isStandalone: true, selector: "crispr-select-field", viewQueries: [{ propertyName: "selectField", first: true, predicate: ["selectField"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <mat-select\n #selectField\n [formControlName]=\"config().controlName\"\n [placeholder]=\"config().placeholder\"\n [multiple]=\"config().multiple\">\n\n @if (config()?.multiple && config().enableToggleAll) {\n <mat-checkbox\n [color]=\"config().color\"\n [checked]=\"allSelected\"\n (click)=\"toggleAll(allSelected)\">\n Select All\n </mat-checkbox>\n }\n @for (option of options$ | async; track option) {\n <mat-option\n [value]=\"option.value\">\n <crispr-option [option]=\"option\">\n </crispr-option>\n </mat-option>\n }\n\n </mat-select>\n\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n\n</crispr-field-container>\n", styles: ["mat-checkbox{display:block;padding:16px}crispr-info[matSuffix]{margin-right:.75em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }, { kind: "component", type: OptionComponent, selector: "crispr-option", inputs: ["option"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3.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", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsDirective, selector: "[formControl], [formControlName]" }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
|
|
53
|
+
}
|
|
54
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SelectFieldComponent, decorators: [{
|
|
55
|
+
type: Component,
|
|
56
|
+
args: [{ selector: 'crispr-select-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
57
|
+
CommonModule,
|
|
58
|
+
InfoComponent,
|
|
59
|
+
OptionComponent,
|
|
60
|
+
MatCheckboxModule,
|
|
61
|
+
MatSelectModule,
|
|
62
|
+
ReactiveFormsModule,
|
|
63
|
+
FormValidationHandlerModule,
|
|
64
|
+
FieldContainerComponent,
|
|
65
|
+
MatFormFieldModule,
|
|
66
|
+
], standalone: true, template: "<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <mat-select\n #selectField\n [formControlName]=\"config().controlName\"\n [placeholder]=\"config().placeholder\"\n [multiple]=\"config().multiple\">\n\n @if (config()?.multiple && config().enableToggleAll) {\n <mat-checkbox\n [color]=\"config().color\"\n [checked]=\"allSelected\"\n (click)=\"toggleAll(allSelected)\">\n Select All\n </mat-checkbox>\n }\n @for (option of options$ | async; track option) {\n <mat-option\n [value]=\"option.value\">\n <crispr-option [option]=\"option\">\n </crispr-option>\n </mat-option>\n }\n\n </mat-select>\n\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n\n</crispr-field-container>\n", styles: ["mat-checkbox{display:block;padding:16px}crispr-info[matSuffix]{margin-right:.75em}\n"] }]
|
|
67
|
+
}], propDecorators: { selectField: [{
|
|
68
|
+
type: ViewChild,
|
|
69
|
+
args: ['selectField']
|
|
70
|
+
}] } });
|
|
71
|
+
|
|
72
|
+
export { SelectFieldComponent };
|
|
73
|
+
//# sourceMappingURL=tft-crispr-forms-index-CLJ89Dev.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-index-CLJ89Dev.mjs","sources":["../../../../libs/crispr-forms/src/lib/ui/select-field/select-field.component.ts","../../../../libs/crispr-forms/src/lib/ui/select-field/select-field.component.html"],"sourcesContent":["/* eslint-disable @nx/enforce-module-boundaries */\nimport {\n Component,\n OnInit,\n ChangeDetectionStrategy,\n ViewChild,\n AfterViewInit,\n} from '@angular/core';\nimport { Observable } from 'rxjs';\n\nimport { MatSelect, MatSelectModule } from '@angular/material/select';\nimport { ThemePalette } from '@angular/material/core';\nimport { CommonModule } from '@angular/common';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { OptionComponent } from '../option';\nimport { FormValidationHandlerModule } from '@tft/form-validation-handler';\nimport { InfoComponent } from '../info';\nimport { FieldContainerComponent } from '../field-container';\nimport {\n observablifyOptions,\n SelectFieldConfig,\n SelectOption,\n} from '../../utils';\nimport { CrisprControlComponent } from '../../utils/abstracts/crispr-control.abstract';\n\n@Component({\n selector: 'crispr-select-field',\n templateUrl: './select-field.component.html',\n styleUrls: ['./select-field.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n CommonModule,\n InfoComponent,\n OptionComponent,\n MatCheckboxModule,\n MatSelectModule,\n ReactiveFormsModule,\n FormValidationHandlerModule,\n FieldContainerComponent,\n MatFormFieldModule,\n ],\n standalone: true\n})\nexport class SelectFieldComponent\n extends CrisprControlComponent<SelectFieldConfig>\n implements OnInit, AfterViewInit\n{\n defaultConfig = {\n enableToggleAll: false,\n color: 'primary' as ThemePalette,\n };\n options$: Observable<SelectOption[]>;\n allSelected = false;\n\n @ViewChild('selectField') selectField: MatSelect;\n\n ngOnInit() {\n super.ngOnInit();\n // options$ can be passed as an array, promise that resolves array, or observable that resolves array\n // this functions accounts for all possibilities and converts to observable that resolves array\n this.options$ = observablifyOptions(this.config().options, this.group());\n }\n\n ngAfterViewInit() {\n if (\n this.config().multiple &&\n this.config().enableToggleAll &&\n this.selectField.options?.length === (this.value() as any[])?.length\n ) {\n this.allSelected = true;\n }\n }\n\n toggleAll(isSelected: boolean) {\n if (isSelected) {\n this.selectField.options.forEach((option) => option.deselect());\n } else {\n this.selectField.options.forEach((option) => option.select());\n }\n this.allSelected = !this.allSelected;\n }\n}\n","<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n @if (config().label) {<mat-label>{{config().label}}</mat-label>}\n <mat-select\n #selectField\n [formControlName]=\"config().controlName\"\n [placeholder]=\"config().placeholder\"\n [multiple]=\"config().multiple\">\n\n @if (config()?.multiple && config().enableToggleAll) {\n <mat-checkbox\n [color]=\"config().color\"\n [checked]=\"allSelected\"\n (click)=\"toggleAll(allSelected)\">\n Select All\n </mat-checkbox>\n }\n @for (option of options$ | async; track option) {\n <mat-option\n [value]=\"option.value\">\n <crispr-option [option]=\"option\">\n </crispr-option>\n </mat-option>\n }\n\n </mat-select>\n\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n\n</crispr-field-container>\n"],"names":["i5","i7"],"mappings":"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"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/material/checkbox';
|
|
4
|
+
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
5
|
+
import * as i1$1 from '@angular/forms';
|
|
6
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
7
|
+
import * as i6 from '@tft/form-validation-handler';
|
|
8
|
+
import { FormValidationHandlerModule } from '@tft/form-validation-handler';
|
|
9
|
+
import { CrisprControlComponent, InfoComponent, FieldContainerComponent } from './tft-crispr-forms.mjs';
|
|
10
|
+
|
|
11
|
+
/* eslint-disable @nx/enforce-module-boundaries */
|
|
12
|
+
const defaultConfig = {
|
|
13
|
+
labelPosition: 'after',
|
|
14
|
+
inline: false,
|
|
15
|
+
};
|
|
16
|
+
class CheckboxFieldComponent extends CrisprControlComponent {
|
|
17
|
+
constructor() {
|
|
18
|
+
super(...arguments);
|
|
19
|
+
this.defaultConfig = defaultConfig;
|
|
20
|
+
}
|
|
21
|
+
ngOnInit() {
|
|
22
|
+
super.ngOnInit();
|
|
23
|
+
}
|
|
24
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CheckboxFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: CheckboxFieldComponent, isStandalone: true, selector: "crispr-checkbox-field", usesInheritance: true, ngImport: i0, template: "<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\"\n [inlineField]=\"config().inline\">\n <div\n [formGroup]=\"group()\">\n <mat-checkbox\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [labelPosition]=\"config().labelPosition\"\n [formControlName]=\"config().controlName\">\n {{config().label}}\n @if (config().info) {\n <crispr-info\n matSuffix\n [info]=\"config().info\">\n </crispr-info>\n }\n </mat-checkbox>\n </div>\n</crispr-field-container>\n", styles: ["mat-checkbox{height:42px}\n"], dependencies: [{ kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsDirective, selector: "[formControl], [formControlName]" }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
|
|
26
|
+
}
|
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CheckboxFieldComponent, decorators: [{
|
|
28
|
+
type: Component,
|
|
29
|
+
args: [{ selector: 'crispr-checkbox-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
30
|
+
InfoComponent,
|
|
31
|
+
MatCheckboxModule,
|
|
32
|
+
ReactiveFormsModule,
|
|
33
|
+
FieldContainerComponent,
|
|
34
|
+
FormValidationHandlerModule
|
|
35
|
+
], standalone: true, template: "<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\"\n [inlineField]=\"config().inline\">\n <div\n [formGroup]=\"group()\">\n <mat-checkbox\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [labelPosition]=\"config().labelPosition\"\n [formControlName]=\"config().controlName\">\n {{config().label}}\n @if (config().info) {\n <crispr-info\n matSuffix\n [info]=\"config().info\">\n </crispr-info>\n }\n </mat-checkbox>\n </div>\n</crispr-field-container>\n", styles: ["mat-checkbox{height:42px}\n"] }]
|
|
36
|
+
}] });
|
|
37
|
+
|
|
38
|
+
export { CheckboxFieldComponent };
|
|
39
|
+
//# sourceMappingURL=tft-crispr-forms-index-CvTUJeC6.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-index-CvTUJeC6.mjs","sources":["../../../../libs/crispr-forms/src/lib/ui/checkbox-field/checkbox-field.component.ts","../../../../libs/crispr-forms/src/lib/ui/checkbox-field/checkbox-field.component.html"],"sourcesContent":["/* eslint-disable @nx/enforce-module-boundaries */\nimport { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';\n\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FormValidationHandlerModule } from '@tft/form-validation-handler';\nimport { FieldContainerComponent } from '../field-container';\nimport { CheckboxFieldConfig } from '../../utils';\nimport { InfoComponent } from '../info';\nimport { CrisprControlComponent } from '../../utils/abstracts/crispr-control.abstract';\n\nconst defaultConfig: Partial<CheckboxFieldConfig> = {\n labelPosition: 'after',\n inline: false,\n};\n\n@Component({\n selector: 'crispr-checkbox-field',\n templateUrl: './checkbox-field.component.html',\n styleUrls: ['./checkbox-field.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n InfoComponent,\n MatCheckboxModule,\n ReactiveFormsModule,\n FieldContainerComponent,\n FormValidationHandlerModule\n ],\n standalone: true\n})\nexport class CheckboxFieldComponent\n extends CrisprControlComponent<CheckboxFieldConfig>\n implements OnInit\n{\n defaultConfig = defaultConfig;\n ngOnInit() {\n super.ngOnInit();\n }\n}\n","<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\"\n [inlineField]=\"config().inline\">\n <div\n [formGroup]=\"group()\">\n <mat-checkbox\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [labelPosition]=\"config().labelPosition\"\n [formControlName]=\"config().controlName\">\n {{config().label}}\n @if (config().info) {\n <crispr-info\n matSuffix\n [info]=\"config().info\">\n </crispr-info>\n }\n </mat-checkbox>\n </div>\n</crispr-field-container>\n"],"names":["i2","i3"],"mappings":"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"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import * as i2 from '@angular/material/slider';
|
|
4
|
+
import { MatSliderModule } from '@angular/material/slider';
|
|
5
|
+
import * as i1 from '@angular/forms';
|
|
6
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
7
|
+
import { CrisprControlComponent, InfoComponent, FieldContainerComponent } from './tft-crispr-forms.mjs';
|
|
8
|
+
|
|
9
|
+
/* eslint-disable @nx/enforce-module-boundaries */
|
|
10
|
+
const defaultConfig = {
|
|
11
|
+
displayLimits: true,
|
|
12
|
+
displayWith: (val) => val,
|
|
13
|
+
};
|
|
14
|
+
class SliderFieldComponent extends CrisprControlComponent {
|
|
15
|
+
constructor() {
|
|
16
|
+
super();
|
|
17
|
+
this.defaultConfig = defaultConfig;
|
|
18
|
+
}
|
|
19
|
+
ngOnInit() {
|
|
20
|
+
super.ngOnInit();
|
|
21
|
+
}
|
|
22
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SliderFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: SliderFieldComponent, isStandalone: true, selector: "crispr-slider-field", usesInheritance: true, ngImport: i0, template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n @if (config().label) {\n <label>\n {{config().label}}\n @if (config().info) {\n <crispr-info [info]=\"config().info\">\n </crispr-info>\n }\n </label>\n }\n <div class=\"slider-container\">\n @if (config().displayLimits) {\n <span>\n {{config().min}}\n </span>\n }\n <mat-slider [attr.data-testid]=\"testId()\" [discrete]=\"config().discrete\"\n [displayWith]=\"config().displayWith\" class=\"example-margin\" [formGroup]=\"group()\" [max]=\"config().max\"\n [min]=\"config().min\" [step]=\"config().step\">\n <input matSliderThumb [formControlName]=\"config().controlName\">\n </mat-slider>\n @if (config().displayLimits) {\n <span>\n {{config().max}}\n </span>\n }\n </div>\n\n</crispr-field-container>", styles: [".slider-container{display:flex;align-items:center}.slider-container mat-slider{flex:1}\n"], dependencies: [{ kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i2.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i2.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
|
|
24
|
+
}
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SliderFieldComponent, decorators: [{
|
|
26
|
+
type: Component,
|
|
27
|
+
args: [{ selector: 'crispr-slider-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
28
|
+
InfoComponent,
|
|
29
|
+
FieldContainerComponent,
|
|
30
|
+
ReactiveFormsModule,
|
|
31
|
+
MatSliderModule
|
|
32
|
+
], template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n @if (config().label) {\n <label>\n {{config().label}}\n @if (config().info) {\n <crispr-info [info]=\"config().info\">\n </crispr-info>\n }\n </label>\n }\n <div class=\"slider-container\">\n @if (config().displayLimits) {\n <span>\n {{config().min}}\n </span>\n }\n <mat-slider [attr.data-testid]=\"testId()\" [discrete]=\"config().discrete\"\n [displayWith]=\"config().displayWith\" class=\"example-margin\" [formGroup]=\"group()\" [max]=\"config().max\"\n [min]=\"config().min\" [step]=\"config().step\">\n <input matSliderThumb [formControlName]=\"config().controlName\">\n </mat-slider>\n @if (config().displayLimits) {\n <span>\n {{config().max}}\n </span>\n }\n </div>\n\n</crispr-field-container>", styles: [".slider-container{display:flex;align-items:center}.slider-container mat-slider{flex:1}\n"] }]
|
|
33
|
+
}], ctorParameters: () => [] });
|
|
34
|
+
|
|
35
|
+
export { SliderFieldComponent };
|
|
36
|
+
//# sourceMappingURL=tft-crispr-forms-index-D6cKptyg.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-index-D6cKptyg.mjs","sources":["../../../../libs/crispr-forms/src/lib/ui/slider-field/slider-field.component.ts","../../../../libs/crispr-forms/src/lib/ui/slider-field/slider-field.component.html"],"sourcesContent":["/* eslint-disable @nx/enforce-module-boundaries */\nimport { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';\nimport { MatSliderModule } from '@angular/material/slider';\n\nimport { ReactiveFormsModule } from '@angular/forms';\n// import { FormValidationHandlerModule } from '@tft/form-validation-handler';\nimport { FieldContainerComponent } from '../field-container';\nimport { InfoComponent } from '../info';\nimport {\n SliderFieldConfig\n} from '../../utils';\nimport { CrisprControlComponent } from '../../utils/abstracts/crispr-control.abstract';\n\nconst defaultConfig: Partial<SliderFieldConfig> = { \n displayLimits: true,\n displayWith: (val) => val,\n};\n\n\n@Component({\n selector: 'crispr-slider-field',\n templateUrl: './slider-field.component.html',\n styleUrls: ['./slider-field.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n InfoComponent,\n FieldContainerComponent,\n ReactiveFormsModule,\n MatSliderModule\n ]\n})\nexport class SliderFieldComponent extends CrisprControlComponent<SliderFieldConfig> implements OnInit {\n defaultConfig = defaultConfig;\n constructor() {\n super();\n }\n\n ngOnInit() {\n super.ngOnInit();\n }\n}\n","<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n @if (config().label) {\n <label>\n {{config().label}}\n @if (config().info) {\n <crispr-info [info]=\"config().info\">\n </crispr-info>\n }\n </label>\n }\n <div class=\"slider-container\">\n @if (config().displayLimits) {\n <span>\n {{config().min}}\n </span>\n }\n <mat-slider [attr.data-testid]=\"testId()\" [discrete]=\"config().discrete\"\n [displayWith]=\"config().displayWith\" class=\"example-margin\" [formGroup]=\"group()\" [max]=\"config().max\"\n [min]=\"config().min\" [step]=\"config().step\">\n <input matSliderThumb [formControlName]=\"config().controlName\">\n </mat-slider>\n @if (config().displayLimits) {\n <span>\n {{config().max}}\n </span>\n }\n </div>\n\n</crispr-field-container>"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import * as i3 from '@angular/material/input';
|
|
4
|
+
import { MatInputModule } from '@angular/material/input';
|
|
5
|
+
import * as i1 from '@angular/forms';
|
|
6
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
7
|
+
import * as i2 from '@angular/material/form-field';
|
|
8
|
+
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
9
|
+
import * as i6 from '@tft/form-validation-handler';
|
|
10
|
+
import { FormValidationHandlerModule } from '@tft/form-validation-handler';
|
|
11
|
+
import { CrisprControlComponent, InfoComponent, FieldContainerComponent } from './tft-crispr-forms.mjs';
|
|
12
|
+
import { MatIconModule } from '@angular/material/icon';
|
|
13
|
+
|
|
14
|
+
/* eslint-disable @nx/enforce-module-boundaries */
|
|
15
|
+
class InputFieldComponent extends CrisprControlComponent {
|
|
16
|
+
constructor() {
|
|
17
|
+
super();
|
|
18
|
+
this.defaultConfig = { inputType: 'text' };
|
|
19
|
+
}
|
|
20
|
+
ngOnInit() {
|
|
21
|
+
super.ngOnInit();
|
|
22
|
+
}
|
|
23
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: InputFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: InputFieldComponent, isStandalone: true, selector: "crispr-input-field", usesInheritance: true, ngImport: i0, template: "<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n <mat-label>\n {{config().label}}\n </mat-label>\n <input\n [type]=\"config().inputType\"\n matInput\n [placeholder]=\"config().placeholder\"\n [formControlName]=\"config().controlName\"\n [min]=\"config().min\"\n [max]=\"config().max\"\n [maxlength]=\"config().maxLength\"\n [step]=\"config().step\"\n [autofocus]=\"config().autofocus\"\n [pattern]=\"config().pattern\"\n [spellcheck]=\"config().spellcheck\"\n [autocomplete]=\"config().autoComplete\"\n [autocapitalize]=\"config().autoCapitalize\">\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n\n\n</crispr-field-container>\n", styles: ["crispr-info[matSuffix]{margin-right:.75em}\n"], dependencies: [{ kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsDirective, selector: "[formControl], [formControlName]" }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "ngmodule", type: MatIconModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
|
|
25
|
+
}
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: InputFieldComponent, decorators: [{
|
|
27
|
+
type: Component,
|
|
28
|
+
args: [{ selector: 'crispr-input-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
29
|
+
InfoComponent,
|
|
30
|
+
ReactiveFormsModule,
|
|
31
|
+
FieldContainerComponent,
|
|
32
|
+
MatFormFieldModule,
|
|
33
|
+
MatInputModule,
|
|
34
|
+
FormValidationHandlerModule,
|
|
35
|
+
MatIconModule
|
|
36
|
+
], template: "<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n <mat-label>\n {{config().label}}\n </mat-label>\n <input\n [type]=\"config().inputType\"\n matInput\n [placeholder]=\"config().placeholder\"\n [formControlName]=\"config().controlName\"\n [min]=\"config().min\"\n [max]=\"config().max\"\n [maxlength]=\"config().maxLength\"\n [step]=\"config().step\"\n [autofocus]=\"config().autofocus\"\n [pattern]=\"config().pattern\"\n [spellcheck]=\"config().spellcheck\"\n [autocomplete]=\"config().autoComplete\"\n [autocapitalize]=\"config().autoCapitalize\">\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n\n\n</crispr-field-container>\n", styles: ["crispr-info[matSuffix]{margin-right:.75em}\n"] }]
|
|
37
|
+
}], ctorParameters: () => [] });
|
|
38
|
+
|
|
39
|
+
export { InputFieldComponent };
|
|
40
|
+
//# sourceMappingURL=tft-crispr-forms-index-DAx6Am4i.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tft-crispr-forms-index-DAx6Am4i.mjs","sources":["../../../../libs/crispr-forms/src/lib/ui/input-field/input-field.component.ts","../../../../libs/crispr-forms/src/lib/ui/input-field/input-field.component.html"],"sourcesContent":["/* eslint-disable @nx/enforce-module-boundaries */\nimport { Component, ChangeDetectionStrategy, OnInit } from '@angular/core';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { FormValidationHandlerModule } from '@tft/form-validation-handler';\nimport { FieldContainerComponent } from '../field-container';\nimport { InfoComponent } from '../info';\nimport { InputFieldConfig } from '../../utils';\nimport { MatIconModule } from '@angular/material/icon';\nimport { CrisprControlComponent } from '../../utils/abstracts/crispr-control.abstract';\n\n@Component({\n selector: 'crispr-input-field',\n templateUrl: './input-field.component.html',\n styleUrls: ['./input-field.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [\n InfoComponent,\n ReactiveFormsModule,\n FieldContainerComponent,\n MatFormFieldModule,\n MatInputModule,\n FormValidationHandlerModule,\n MatIconModule\n ]\n})\nexport class InputFieldComponent extends CrisprControlComponent<InputFieldConfig> implements OnInit {\n\n defaultConfig: Partial<InputFieldConfig> = {inputType: 'text'};\n constructor() {\n super();\n }\n\n ngOnInit() {\n super.ngOnInit();\n }\n}\n","<crispr-field-container\n [config]=\"config()\"\n [group]=\"group()\">\n <mat-form-field\n [attr.data-testid]=\"testId()\"\n [color]=\"config().color\"\n [appearance]=\"config().appearance\"\n [formGroup]=\"group()\">\n <mat-label>\n {{config().label}}\n </mat-label>\n <input\n [type]=\"config().inputType\"\n matInput\n [placeholder]=\"config().placeholder\"\n [formControlName]=\"config().controlName\"\n [min]=\"config().min\"\n [max]=\"config().max\"\n [maxlength]=\"config().maxLength\"\n [step]=\"config().step\"\n [autofocus]=\"config().autofocus\"\n [pattern]=\"config().pattern\"\n [spellcheck]=\"config().spellcheck\"\n [autocomplete]=\"config().autoComplete\"\n [autocapitalize]=\"config().autoCapitalize\">\n @if (config().fieldSuffix) {<span matSuffix>{{config().fieldSuffix}}</span>}\n @if (config().info) {<crispr-info matSuffix [info]=\"config().info\"></crispr-info>}\n @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n\n </mat-form-field>\n\n\n</crispr-field-container>\n"],"names":[],"mappings":"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"}
|