@tft/crispr-forms 21.0.18 → 21.1.0

package/fesm2022/tft-crispr-forms-tft-crispr-forms-8liD7eof.mjs

@@ -1,943 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, computed, Directive, inject, DestroyRef, EventEmitter, effect, Output, ViewContainerRef, Renderer2, Pipe, NgModule, output, untracked, ViewChild, ChangeDetectionStrategy, Component, HostListener, Input, signal } from '@angular/core';
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i1$1 from '@angular/forms';
-import { FormArray, FormControl, FormGroup, ReactiveFormsModule, NgControl } from '@angular/forms';
-import * as i6 from '@tft/form-validation-handler';
-import { FormValidationHandlerModule } from '@tft/form-validation-handler';
-import { takeUntilDestroyed, outputFromObservable, toObservable } from '@angular/core/rxjs-interop';
-import { map, startWith, debounceTime, distinctUntilChanged, switchMap, shareReplay, tap } from 'rxjs/operators';
-import { from, of, isObservable } from 'rxjs';
-import * as i1$3 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i2 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i2$2 from '@angular/material/form-field';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import * as i3 from '@angular/material/input';
-import { MatInputModule } from '@angular/material/input';
-import * as i2$1 from '@angular/material/tooltip';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i1$2 from '@angular/material/progress-bar';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-
-function valueIn(values) {
-    return map((value) => {
-        if (value) {
-            return values.some(v => {
-                if (isRegex(v)) {
-                    const trimmedStringForRegex = v.substr(1, v.length - 2);
-                    const regex = new RegExp(trimmedStringForRegex);
-                    return regex.test(value);
-                }
-                else {
-                    return v === value;
-                }
-            });
-        }
-        else {
-            return false;
-        }
-    });
-}
-function isRegex(string) {
-    return string.startsWith('/') && string.endsWith('/');
-}
-
-const DEFAULT_EMPTY_OPTIONS_MESSAGE = 'No Items';
-
-// export type ControlType = keyof typeof FIELD_COMPONENTS;
-var ControlType;
-(function (ControlType) {
-    ControlType["AUTOCOMPLETE"] = "autocomplete";
-    ControlType["AUTOCOMPLETE_CHIPLIST"] = "autocompleteChiplist";
-    ControlType["BUTTON"] = "button";
-    ControlType["CHECKBOX"] = "checkbox";
-    ControlType["CUSTOM"] = "custom";
-    ControlType["DATEPICKER"] = "datepicker";
-    ControlType["DIVIDER"] = "divider";
-    ControlType["FILE_UPLOAD"] = "fileUpload";
-    ControlType["GROUP_LIST"] = "groupList";
-    ControlType["HEADING"] = "heading";
-    ControlType["IMAGE_UPLOAD"] = "imageUpload";
-    ControlType["INPUT"] = "input";
-    ControlType["MAP"] = "map";
-    ControlType["RADIO"] = "radio";
-    ControlType["SELECT"] = "select";
-    ControlType["SLIDER"] = "slider";
-    ControlType["SUB_GROUP"] = "subGroup";
-    ControlType["TEXTAREA"] = "textarea";
-    ControlType["UNIT_CONVERSION"] = "unitConversion";
-})(ControlType || (ControlType = {}));
-
-/**
- * Analyze the config and build a form control to spec. Notice we don't use FormBuilder here
- * as we want to keep this function pure.
- * @param controlConfig the configuration object for the control to build
- * @param value an initial value to use if passed in
- */
-function createControlForType(controlConfig, value = null) {
-    // build form control out based on the control type
-    const control = controlConfig.controlType === ControlType.SUB_GROUP
-        ? buildFormGroupFromConfig(controlConfig, value)
-        : controlConfig.controlType === ControlType.GROUP_LIST
-            ? new FormArray([], controlConfig.validators)
-            : new FormControl(value || null, controlConfig.validators);
-    return control;
-}
-
-/**
- * Determines if the field config is for a form control (not a divider, heading or other non-control field)
- */
-function isControlConfig(fieldConfig) {
-    return 'controlName' in fieldConfig;
-}
-
-/**
- * builds out form group based on config
- * @param config a configuration for a form group
- * @param value an object of initial values to pass in
- * @param group the form group to modify and build out
- */
-function buildFormGroupFromConfig(config, value = null, group = new FormGroup({})) {
-    config.fields.forEach((controlConfig) => {
-        if (isControlConfig(controlConfig)) {
-            // then add a control to the group using the controlName from configuration
-            const { controlName } = controlConfig;
-            if (group.get(controlName)) {
-                group.removeControl(controlName);
-            }
-            // if there's a value object and it has a non-null/undefined value for this field use it.
-            // Otherwise, default to null
-            const controlValue = (value && value[controlName]) ?? null;
-            const control = createControlForType(controlConfig, controlValue);
-            group.addControl(controlName, control);
-        }
-    });
-    group.setValidators(config.validators);
-    return group;
-}
-
-function callOptionsIfFunction(options, parentGroup, searchString) {
-    return options instanceof Function ? options(parentGroup, searchString) : options;
-}
-
-/**
- * A basic filter function that filters the search string against the label of the options object
- * @param options the array of options to filter
- * @param searchString the string from the input
- */
-function filterOptionsByLabel(options, searchString) {
-    return options.filter(option => {
-        return option.label && option.label.toLowerCase().includes(searchString.toLowerCase());
-    });
-}
-
-/**
- * The user can give us select options as an array, a function that resolves to a promise,
- * or an observable. This functions consumes any of those and returns an observable that
- * resolves an array of options
- *
- * @param options the options passed in from the config
- * @param emptyMessageOption the message to display when the array is empty
- */
-function observablifyOptions(options, parentGroup, searchString) {
-    const calledOptions = callOptionsIfFunction(options, parentGroup, searchString);
-    // if options are a promise
-    const observableOptions = calledOptions instanceof Promise
-        // convert to observable
-        ? from(calledOptions)
-        // if array that isn't empty
-        : Array.isArray(calledOptions) && calledOptions.length
-            // convert to observable
-            ? of(calledOptions)
-            // if observable
-            : isObservable(calledOptions)
-                // return it
-                ? calledOptions
-                // else an empty array
-                : of([]);
-    return observableOptions;
-}
-
-function convertBytesToMb(bytes) {
-    return bytes / 1048576;
-}
-function maxFileSizeValidator(maxFileSize) {
-    return (control) => {
-        const controlValue = control.value;
-        if (!(controlValue instanceof File)) {
-            return null;
-        }
-        const actualFileSize = +convertBytesToMb(controlValue.size).toPrecision(3);
-        if (maxFileSize > actualFileSize)
-            return null;
-        return { maxFileSize: { maxFileSize, actualFileSize } };
-    };
-}
-function allowedFileExtValidator(allowedFileExtensions, onlyAllowFiles = true) {
-    return (control) => {
-        const controlValue = control.value;
-        const isFile = controlValue instanceof File;
-        if (!onlyAllowFiles && !isFile)
-            return null;
-        const actualExtension = isFile ? controlValue.name.split('.').pop().toLocaleLowerCase() : 'Not a file';
-        const isAllowedExtension = allowedFileExtensions.includes(actualExtension);
-        if (isAllowedExtension) {
-            return null;
-        }
-        return { allowedExtension: { allowedFileExtensions, actualExtension } };
-    };
-}
-function allowedFileType(matchExp) {
-    return (formControl) => {
-        const value = formControl.value;
-        if (!(value instanceof File))
-            return null;
-        const type = value.type;
-        const matches = type.match(matchExp);
-        if (!type || !matches?.length) {
-            return {
-                allowedFileType: {
-                    actualType: type,
-                    allowedTypeExp: matchExp
-                }
-            };
-        }
-        else {
-            return null;
-        }
-    };
-}
-
-class CrisprFieldComponent {
-    constructor() {
-        this.inputConfig = input(null, { ...(ngDevMode ? { debugName: "inputConfig" } : {}), alias: 'config' });
-        this.config = computed(() => {
-            const c = this.inputConfig();
-            return c && this.defaultConfig ? { ...this.defaultConfig, ...c } : c;
-        }, ...(ngDevMode ? [{ debugName: "config" }] : []));
-        this.testIdPrefix = input(undefined, ...(ngDevMode ? [{ debugName: "testIdPrefix" }] : []));
-        this.testId = computed(() => {
-            const config = this.config();
-            const id = config?.testId || config?.controlName;
-            if (!id)
-                return undefined;
-            const prefix = this.testIdPrefix();
-            return prefix ? `${prefix}.${id}` : id;
-        }, ...(ngDevMode ? [{ debugName: "testId" }] : []));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.6", type: CrisprFieldComponent, isStandalone: true, inputs: { inputConfig: { classPropertyName: "inputConfig", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, testIdPrefix: { classPropertyName: "testIdPrefix", publicName: "testIdPrefix", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFieldComponent, decorators: [{
-            type: Directive,
-            args: [{
-                    standalone: true
-                }]
-        }], propDecorators: { inputConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }], testIdPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "testIdPrefix", required: false }] }] } });
-
-class CrisprControlComponent extends CrisprFieldComponent {
-    constructor() {
-        super();
-        this.destroyRef = inject(DestroyRef);
-        this.group = input(null, ...(ngDevMode ? [{ debugName: "group" }] : []));
-        this.control = computed(() => this.group()?.get(this.config().controlName), ...(ngDevMode ? [{ debugName: "control" }] : []));
-        this.valueChanges = new EventEmitter();
-        this.value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
-        effect(() => {
-            this.setControlValue(this.value());
-        });
-    }
-    ngOnInit() {
-        this.control().valueChanges.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((value) => {
-            this.valueChanges.emit(value);
-        });
-        // setTimeouts are ugly but this seems to be the only way to get the computed field to compute initial values
-        setTimeout(() => {
-            this.control().updateValueAndValidity();
-        });
-    }
-    setControlValue(value) {
-        if (value && this.control() && this.config().controlType !== ControlType.SUB_GROUP) {
-            this.control().setValue(value);
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.6", type: CrisprControlComponent, isStandalone: true, inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanges: "valueChanges" }, usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprControlComponent, decorators: [{
-            type: Directive,
-            args: [{
-                    standalone: true
-                }]
-        }], ctorParameters: () => [], propDecorators: { group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }], valueChanges: [{
-                type: Output
-            }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] } });
-
-// eslint-disable-next-line @angular-eslint/directive-class-suffix
-class AbstractAutocompleteComponent extends CrisprControlComponent {
-    constructor() {
-        super(...arguments);
-        // we need a separate control for the UI because of the way the material autocomplete chiplist works
-        this.autocompleteInputControl = new FormControl('');
-        // Narrows the parent's computed config type to include C-specific properties (e.g. chiplist-only fields)
-        // Must re-implement the defaultConfig merge from CrisprFieldComponent because this override replaces it.
-        this.config = computed(() => {
-            const c = this.inputConfig();
-            return (c && this.defaultConfig)
-                ? { ...this.defaultConfig, ...c }
-                : c;
-        }, ...(ngDevMode ? [{ debugName: "config" }] : []));
-    }
-    ngOnInit() {
-        super.ngOnInit();
-        this.group().addControl(this.config().controlName, new FormControl());
-        // filter options by the search string using either the default filter function or one passed in through config()
-        this.options$ = this.autocompleteInputControl.valueChanges.pipe(
-        // this is needed to have the options panel to open on focus
-        startWith(''), debounceTime(this.config().typeDebounceTime), map((searchText) => typeof searchText === 'string' ? searchText?.trim() : ''), distinctUntilChanged(), switchMap((searchText) => observablifyOptions(this.config().options, this.group(), searchText)), shareReplay(1));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: AbstractAutocompleteComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.6", type: AbstractAutocompleteComponent, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: AbstractAutocompleteComponent, decorators: [{
-            type: Directive
-        }] });
-
-// eslint-disable-next-line @angular-eslint/directive-class-suffix
-class CrisprDisplayFieldComponent extends CrisprControlComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprDisplayFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.6", type: CrisprDisplayFieldComponent, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprDisplayFieldComponent, decorators: [{
-            type: Directive
-        }] });
-
-const FIELD_COMPONENTS = {
-    groupList: () => Promise.resolve().then(function () { return index$1; }).then(({ FormGroupListComponent }) => FormGroupListComponent),
-    subGroup: () => Promise.resolve().then(function () { return index; }).then(({ SubGroupComponent }) => SubGroupComponent),
-    button: () => import('./tft-crispr-forms-index-kah2HT_N.mjs').then(({ ButtonComponent }) => ButtonComponent),
-    input: () => import('./tft-crispr-forms-index-UX-Wdyk1.mjs').then(({ InputFieldComponent }) => InputFieldComponent),
-    select: () => import('./tft-crispr-forms-index-DYWkX7D3.mjs').then(({ SelectFieldComponent }) => SelectFieldComponent),
-    radio: () => import('./tft-crispr-forms-index-D99OHDPc.mjs').then(({ RadioFieldComponent }) => RadioFieldComponent),
-    autocomplete: () => import('./tft-crispr-forms-index-B_lhA83w.mjs').then(({ AutocompleteFieldComponent }) => AutocompleteFieldComponent),
-    autocompleteChiplist: () => import('./tft-crispr-forms-index-BawhjTMp.mjs').then(({ AutocompleteChiplistFieldComponent }) => AutocompleteChiplistFieldComponent),
-    map: () => import('./tft-crispr-forms-index-CXXD0vdZ.mjs').then(({ MapFieldComponent }) => MapFieldComponent),
-    textarea: () => import('./tft-crispr-forms-index-DysioRya.mjs').then(({ TextareaFieldComponent }) => TextareaFieldComponent),
-    checkbox: () => import('./tft-crispr-forms-index-BFzx83fR.mjs').then(({ CheckboxFieldComponent }) => CheckboxFieldComponent),
-    slider: () => import('./tft-crispr-forms-index-GlYQbbbv.mjs').then(({ SliderFieldComponent }) => SliderFieldComponent),
-    datepicker: () => import('./tft-crispr-forms-index-bTdYHJPk.mjs').then(({ DatepickerFieldComponent }) => DatepickerFieldComponent),
-    fileUpload: () => Promise.resolve().then(function () { return index$3; }).then(({ FileUploadFieldComponent }) => FileUploadFieldComponent),
-    imageUpload: () => import('./tft-crispr-forms-index-CoUwTugQ.mjs').then(({ ImageUploadFieldComponent }) => ImageUploadFieldComponent),
-    heading: () => Promise.resolve().then(function () { return index$2; }).then(({ HeadingComponent }) => HeadingComponent),
-    divider: () => import('./tft-crispr-forms-index-CmVahfkJ.mjs').then(({ DividerComponent }) => DividerComponent),
-    unitConversion: () => import('./tft-crispr-forms-index-BMZQakFs.mjs').then(({ UnitConversionFieldComponent }) => UnitConversionFieldComponent),
-};
-function isControlComponent(component) {
-    return component && isControlConfig(component.config()) && 'value' in component;
-}
-function isControlOrButtonComponent(component) {
-    return (isControlComponent(component) ||
-        component.config().controlType === ControlType.BUTTON);
-}
-
-class CrisprFieldDirective {
-    constructor() {
-        this.config = input(...(ngDevMode ? [undefined, { debugName: "config" }] : []));
-        this.group = input(...(ngDevMode ? [undefined, { debugName: "group" }] : []));
-        this.testIdPrefix = input(undefined, ...(ngDevMode ? [{ debugName: "testIdPrefix" }] : []));
-        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
-        this.container = inject(ViewContainerRef);
-        this.renderer = inject(Renderer2);
-        effect(() => {
-            this.updateComponentValue(this.value());
-        });
-    }
-    async ngOnInit() {
-        const component = this.config().component ||
-            (await FIELD_COMPONENTS[this.config().controlType]());
-        this.componentRef =
-            this.container.createComponent(component);
-        this.component = this.componentRef.instance;
-        this.componentRef.setInput('config', this.config());
-        if (isControlOrButtonComponent(this.component)) {
-            this.componentRef.setInput('group', this.group());
-        }
-        this.componentRef.setInput('testIdPrefix', this.testIdPrefix());
-        this.updateComponentValue(this.value());
-        if (!this.config().classes)
-            return;
-        this.config().classes.forEach((klass) => {
-            if (klass.includes(' ')) {
-                throw Error(`Improperly formatted class. '${klass}' cannot contain spaces.`);
-            }
-            else {
-                this.renderer.addClass(this.componentRef.location.nativeElement, klass);
-            }
-        });
-    }
-    updateComponentValue(value) {
-        if (this.componentRef && isControlComponent(this.component)) {
-            this.componentRef.setInput('value', value);
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.6", type: CrisprFieldDirective, isStandalone: true, selector: "[crisprField]", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, testIdPrefix: { classPropertyName: "testIdPrefix", publicName: "testIdPrefix", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFieldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[crisprField]',
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }], group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }], testIdPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "testIdPrefix", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] } });
-
-class InitialControlValuePipe {
-    // TODO: does changing any to unknown break anything?
-    transform(initialFormValue, fieldConfig) {
-        return initialFormValue && isControlConfig(fieldConfig)
-            ? initialFormValue[fieldConfig.controlName] || null
-            : null;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: InitialControlValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.1.6", ngImport: i0, type: InitialControlValuePipe, isStandalone: false, name: "initialControlValue" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: InitialControlValuePipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'initialControlValue',
-                    standalone: false
-                }]
-        }] });
-
-class CrisprPipesModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprPipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.6", ngImport: i0, type: CrisprPipesModule, declarations: [InitialControlValuePipe], imports: [CommonModule], exports: [InitialControlValuePipe] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprPipesModule, imports: [CommonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprPipesModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    exports: [
-                        InitialControlValuePipe
-                    ],
-                    declarations: [
-                        InitialControlValuePipe
-                    ]
-                }]
-        }] });
-
-class CrisprFormComponent {
-    constructor() {
-        this.config = input.required(...(ngDevMode ? [{ debugName: "config" }] : []));
-        this.form = input(new FormGroup({}), ...(ngDevMode ? [{ debugName: "form" }] : []));
-        this.value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
-        this.submitted = output();
-        /** Patch form values whenever the [value] input changes without firing valueChanges. */
-        this.patchValueEffect = effect(() => {
-            const value = this.value();
-            untracked(() => {
-                if (value) {
-                    this.form().patchValue(value, { emitEvent: false });
-                }
-            });
-        }, ...(ngDevMode ? [{ debugName: "patchValueEffect" }] : []));
-        // proxy value and status change events through to consuming component
-        this.valueChanges = outputFromObservable(toObservable(this.form).pipe(switchMap((f) => f.valueChanges)));
-        this.statusChanges = outputFromObservable(toObservable(this.form).pipe(switchMap((f) => f.statusChanges)));
-    }
-    ngOnInit() {
-        // build out the form, note that we pass in the form as the third argument and the function modifies it
-        buildFormGroupFromConfig(this.config(), this.value(), this.form());
-    }
-    handleSubmit() {
-        this.form().markAllAsTouched();
-        this.submitted.emit(this.form());
-    }
-    triggerSubmit() {
-        this.submitTrigger.nativeElement.click();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: CrisprFormComponent, isStandalone: true, selector: "crispr-form", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { submitted: "submitted", valueChanges: "valueChanges", statusChanges: "statusChanges" }, host: { properties: { "attr.data-density": "config().density ?? null" } }, viewQueries: [{ propertyName: "submitTrigger", first: true, predicate: ["submitTrigger"], descendants: true }], ngImport: i0, template: "<form\n  class=\"crispr-form\"\n  [ngClass]=\"config().classes\"\n  [formGroup]=\"form()\"\n  (ngSubmit)=\"handleSubmit()\"\n  [autocomplete]=\"config().autocomplete || 'off'\"\n  [errorDictionary]=\"config().errorDictionary\"\n  #ngFormElement=\"ngForm\">\n\n  @for (field of config().fields; track field) {\n    <ng-container\n      crisprField\n      [value]=\"value() | initialControlValue : field\"\n      [config]=\"field\"\n      [group]=\"form()\">\n    </ng-container>\n  }\n  <!-- Hidden button, programmatically clicked when crispr form triggerSubmit function called.\n  Uses a hidden button with type=\"submit\" because it will trigger both native form submit event\n  (which the error handler has to listen for) and ngSubmit event  -->\n  <button #submitTrigger class=\"submit-trigger\" data-testid=\"submit-trigger\" type=\"submit\">\n  </button>\n</form>\n", styles: [".submit-trigger{display:none}:host[data-density=\"-1\"] ::ng-deep{--mat-form-field-container-height: 52px;--mat-form-field-filled-label-display: block;--mat-form-field-container-vertical-padding: 14px;--mat-form-field-filled-with-label-container-padding-top: 22px;--mat-form-field-filled-with-label-container-padding-bottom: 6px;--mat-select-arrow-transform: translateY(-8px)}:host[data-density=\"-1\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-1\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-1\"] ::ng-deep{--mat-checkbox-touch-target-display: block;--mat-checkbox-state-layer-size: 36px;--mat-radio-state-layer-size: 36px;--mat-radio-touch-target-display: block;--mat-button-filled-container-height: 32px;--mat-button-filled-touch-target-display: block;--mat-button-outlined-container-height: 32px;--mat-button-outlined-touch-target-display: block;--mat-button-protected-container-height: 32px;--mat-button-protected-touch-target-display: block;--mat-button-text-container-height: 32px;--mat-button-text-touch-target-display: block;--mat-button-tonal-container-height: 32px;--mat-button-tonal-touch-target-display: block;--mat-icon-button-touch-target-display: block}:host[data-density=\"-1\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 44px;--mat-icon-button-state-layer-size: 44px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:10px}:host[data-density=\"-2\"] ::ng-deep{--mat-form-field-container-height: 48px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 12px;--mat-form-field-filled-with-label-container-padding-top: 12px;--mat-form-field-filled-with-label-container-padding-bottom: 12px;--mat-select-arrow-transform: none}:host[data-density=\"-2\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-2\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-2\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 32px;--mat-radio-state-layer-size: 32px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 28px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 28px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 28px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 28px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 28px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-2\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-3\"] ::ng-deep{--mat-form-field-container-height: 44px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 10px;--mat-form-field-filled-with-label-container-padding-top: 10px;--mat-form-field-filled-with-label-container-padding-bottom: 10px;--mat-select-arrow-transform: none}:host[data-density=\"-3\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-3\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-3\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 28px;--mat-radio-state-layer-size: 28px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-3\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 36px;--mat-icon-button-state-layer-size: 36px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:6px}:host[data-density=\"-4\"] ::ng-deep{--mat-form-field-container-height: 40px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 8px;--mat-form-field-filled-with-label-container-padding-top: 8px;--mat-form-field-filled-with-label-container-padding-bottom: 8px;--mat-select-arrow-transform: none}:host[data-density=\"-4\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-4\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-4\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 28px;--mat-radio-state-layer-size: 28px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-4\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;--mat-icon-button-state-layer-size: 32px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:4px}:host[data-density=\"-5\"] ::ng-deep{--mat-form-field-container-height: 36px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 6px;--mat-form-field-filled-with-label-container-padding-top: 6px;--mat-form-field-filled-with-label-container-padding-bottom: 6px;--mat-select-arrow-transform: none}:host[data-density=\"-5\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-5\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-5\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 28px;--mat-radio-state-layer-size: 28px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-5\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 28px;--mat-icon-button-state-layer-size: 28px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:2px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CrisprFieldDirective, selector: "[crisprField]", inputs: ["config", "group", "testIdPrefix", "value"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsFormDirective, selector: "form", inputs: ["errorDictionary"] }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "ngmodule", type: CrisprPipesModule }, { kind: "pipe", type: InitialControlValuePipe, name: "initialControlValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFormComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, host: {
-                        '[attr.data-density]': 'config().density ?? null',
-                    }, imports: [
-                        CommonModule,
-                        CrisprFieldDirective,
-                        ReactiveFormsModule,
-                        FormValidationHandlerModule,
-                        CrisprPipesModule,
-                    ], template: "<form\n  class=\"crispr-form\"\n  [ngClass]=\"config().classes\"\n  [formGroup]=\"form()\"\n  (ngSubmit)=\"handleSubmit()\"\n  [autocomplete]=\"config().autocomplete || 'off'\"\n  [errorDictionary]=\"config().errorDictionary\"\n  #ngFormElement=\"ngForm\">\n\n  @for (field of config().fields; track field) {\n    <ng-container\n      crisprField\n      [value]=\"value() | initialControlValue : field\"\n      [config]=\"field\"\n      [group]=\"form()\">\n    </ng-container>\n  }\n  <!-- Hidden button, programmatically clicked when crispr form triggerSubmit function called.\n  Uses a hidden button with type=\"submit\" because it will trigger both native form submit event\n  (which the error handler has to listen for) and ngSubmit event  -->\n  <button #submitTrigger class=\"submit-trigger\" data-testid=\"submit-trigger\" type=\"submit\">\n  </button>\n</form>\n", styles: [".submit-trigger{display:none}:host[data-density=\"-1\"] ::ng-deep{--mat-form-field-container-height: 52px;--mat-form-field-filled-label-display: block;--mat-form-field-container-vertical-padding: 14px;--mat-form-field-filled-with-label-container-padding-top: 22px;--mat-form-field-filled-with-label-container-padding-bottom: 6px;--mat-select-arrow-transform: translateY(-8px)}:host[data-density=\"-1\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-1\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-1\"] ::ng-deep{--mat-checkbox-touch-target-display: block;--mat-checkbox-state-layer-size: 36px;--mat-radio-state-layer-size: 36px;--mat-radio-touch-target-display: block;--mat-button-filled-container-height: 32px;--mat-button-filled-touch-target-display: block;--mat-button-outlined-container-height: 32px;--mat-button-outlined-touch-target-display: block;--mat-button-protected-container-height: 32px;--mat-button-protected-touch-target-display: block;--mat-button-text-container-height: 32px;--mat-button-text-touch-target-display: block;--mat-button-tonal-container-height: 32px;--mat-button-tonal-touch-target-display: block;--mat-icon-button-touch-target-display: block}:host[data-density=\"-1\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 44px;--mat-icon-button-state-layer-size: 44px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:10px}:host[data-density=\"-2\"] ::ng-deep{--mat-form-field-container-height: 48px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 12px;--mat-form-field-filled-with-label-container-padding-top: 12px;--mat-form-field-filled-with-label-container-padding-bottom: 12px;--mat-select-arrow-transform: none}:host[data-density=\"-2\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-2\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-2\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 32px;--mat-radio-state-layer-size: 32px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 28px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 28px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 28px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 28px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 28px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-2\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-3\"] ::ng-deep{--mat-form-field-container-height: 44px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 10px;--mat-form-field-filled-with-label-container-padding-top: 10px;--mat-form-field-filled-with-label-container-padding-bottom: 10px;--mat-select-arrow-transform: none}:host[data-density=\"-3\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-3\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-3\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 28px;--mat-radio-state-layer-size: 28px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-3\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 36px;--mat-icon-button-state-layer-size: 36px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:6px}:host[data-density=\"-4\"] ::ng-deep{--mat-form-field-container-height: 40px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 8px;--mat-form-field-filled-with-label-container-padding-top: 8px;--mat-form-field-filled-with-label-container-padding-bottom: 8px;--mat-select-arrow-transform: none}:host[data-density=\"-4\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-4\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-4\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 28px;--mat-radio-state-layer-size: 28px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-4\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;--mat-icon-button-state-layer-size: 32px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:4px}:host[data-density=\"-5\"] ::ng-deep{--mat-form-field-container-height: 36px;--mat-form-field-filled-label-display: none;--mat-form-field-container-vertical-padding: 6px;--mat-form-field-filled-with-label-container-padding-top: 6px;--mat-form-field-filled-with-label-container-padding-bottom: 6px;--mat-select-arrow-transform: none}:host[data-density=\"-5\"] ::ng-deep .mat-calendar-controls{--mat-icon-button-touch-target-display: none}:host[data-density=\"-5\"] ::ng-deep .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 40px;--mat-icon-button-state-layer-size: 40px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:8px}:host[data-density=\"-5\"] ::ng-deep{--mat-checkbox-touch-target-display: none;--mat-checkbox-state-layer-size: 28px;--mat-radio-state-layer-size: 28px;--mat-radio-touch-target-display: none;--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none;--mat-icon-button-touch-target-display: none}:host[data-density=\"-5\"] ::ng-deep .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 28px;--mat-icon-button-state-layer-size: 28px;width:var(--mat-icon-button-state-layer-size);height:var(--mat-icon-button-state-layer-size);padding:2px}\n"] }]
-        }], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], submitted: [{ type: i0.Output, args: ["submitted"] }], valueChanges: [{ type: i0.Output, args: ["valueChanges"] }], statusChanges: [{ type: i0.Output, args: ["statusChanges"] }], submitTrigger: [{
-                type: ViewChild,
-                args: ['submitTrigger']
-            }] } });
-
-class FileDropzoneDirective {
-    constructor() {
-        this.fileDrop = new EventEmitter();
-        this.crisprFileDropzone = true;
-    }
-    onDrop($event) {
-        if (this.crisprFileDropzone) {
-            $event.preventDefault();
-            this.fileDrop.emit($event.dataTransfer.files);
-        }
-    }
-    // Prevents DOM from trying to open file in browser
-    onDragOver($event) {
-        if (this.crisprFileDropzone) {
-            $event.preventDefault();
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FileDropzoneDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.6", type: FileDropzoneDirective, isStandalone: true, selector: "[crisprFileDropzone]", inputs: { crisprFileDropzone: "crisprFileDropzone" }, outputs: { fileDrop: "fileDrop" }, host: { listeners: { "drop": "onDrop($event)", "dragover": "onDragOver($event)" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FileDropzoneDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[crisprFileDropzone]',
-                    standalone: true,
-                }]
-        }], propDecorators: { fileDrop: [{
-                type: Output
-            }], crisprFileDropzone: [{
-                type: Input
-            }], onDrop: [{
-                type: HostListener,
-                args: ['drop', ['$event']]
-            }], onDragOver: [{
-                type: HostListener,
-                args: ['dragover', ['$event']]
-            }] } });
-
-class InfoComponent {
-    constructor() {
-        this.info = input.required(...(ngDevMode ? [{ debugName: "info" }] : []));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: InfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: InfoComponent, isStandalone: true, selector: "crispr-info", inputs: { info: { classPropertyName: "info", publicName: "info", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@if (info()) {\n  <mat-icon\n    [matTooltip]=\"info().content\"\n    [matTooltipPosition]=\"info().tooltipPosition || 'below'\">\n    {{info().iconName || 'info'}}\n  </mat-icon>\n}\n", styles: [":host{margin-left:4px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: InfoComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-info', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        MatIconModule,
-                        MatTooltipModule
-                    ], template: "@if (info()) {\n  <mat-icon\n    [matTooltip]=\"info().content\"\n    [matTooltipPosition]=\"info().tooltipPosition || 'below'\">\n    {{info().iconName || 'info'}}\n  </mat-icon>\n}\n", styles: [":host{margin-left:4px}\n"] }]
-        }], propDecorators: { info: [{ type: i0.Input, args: [{ isSignal: true, alias: "info", required: true }] }] } });
-
-const defaultConfig$1 = {
-    typographyClass: 'mat-h3',
-};
-class HeadingComponent extends CrisprFieldComponent {
-    constructor() {
-        super(...arguments);
-        this.defaultConfig = defaultConfig$1;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: HeadingComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: HeadingComponent, isStandalone: true, selector: "crispr-heading", usesInheritance: true, ngImport: i0, template: "@if (!!config()?.label) {\n  <label\n    [ngClass]=\"config().typographyClass\">\n    {{ config().label }}\n    @if (config().info) {\n      <crispr-info\n        matSuffix\n        [info]=\"config().info\">\n      </crispr-info>\n    }\n  </label>\n}\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: InfoComponent, selector: "crispr-info", inputs: ["info"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: HeadingComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-heading', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, MatFormFieldModule, InfoComponent], standalone: true, template: "@if (!!config()?.label) {\n  <label\n    [ngClass]=\"config().typographyClass\">\n    {{ config().label }}\n    @if (config().info) {\n      <crispr-info\n        matSuffix\n        [info]=\"config().info\">\n      </crispr-info>\n    }\n  </label>\n}\n", styles: [":host{display:block}\n"] }]
-        }] });
-
-class FieldContainerComponent {
-    constructor() {
-        // the configuration object for the field
-        this.config = input.required(...(ngDevMode ? [{ debugName: "config" }] : []));
-        // the parent formGroup
-        this.group = input.required(...(ngDevMode ? [{ debugName: "group" }] : []));
-        // boolean whether field-container is inline
-        this.inlineField = input(false, ...(ngDevMode ? [{ debugName: "inlineField" }] : []));
-        this.isDisabled = signal(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
-        this.isHidden = computed(() => this.isDisabled() && !!this.config().hideDisabled, ...(ngDevMode ? [{ debugName: "isHidden" }] : []));
-        this.subs = [];
-    }
-    ngOnInit() {
-        this.disabled$ = this.connectDisabledCallback(this.group(), this.config());
-        this.subs.push(this.disabled$.subscribe(disabled => this.isDisabled.set(disabled)));
-        // we tried moving this into afterViewChecked and afterContentChecked lifecycle hooks without any luck
-        if (this.config().computeValue) {
-            this.subs.push(this.config()
-                .computeValue(this.group())
-                .pipe(distinctUntilChanged(), tap((computedValue) => this.group().get(this.config().controlName).setValue(computedValue)))
-                .subscribe());
-        }
-    }
-    ngOnDestroy() {
-        this.subs.forEach((sub) => sub.unsubscribe);
-    }
-    /**
-     * Connects user defined disabledCallback function to the the view, so that the control is enabled/disabled
-     * appropriately. It also will hide disabled fields in the UI unless `hideDisabled` is set to
-     * false in the controls config
-     * @param group used to get valueChanges from control
-     * @param config configuration object used to
-     */
-    connectDisabledCallback(group, config = null) {
-        const control = group.get(config.controlName);
-        // If the disabled$ function exists on the field config then call it with the disabledCallbackConfig
-        // as a parameter otherwise return an observable of true.
-        return config?.disabledCallback &&
-            config.disabledCallback instanceof Function
-            ? config.disabledCallback(group).pipe(
-            // This enables/disables when callback conditions are met
-            tap((shouldDisable) => shouldDisable
-                ? control.disable({ emitEvent: false })
-                : control.enable({ emitEvent: false })))
-            : of(false);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FieldContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: FieldContainerComponent, isStandalone: true, selector: "crispr-field-container", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: true, transformFunction: null }, inlineField: { classPropertyName: "inlineField", publicName: "inlineField", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.display": "isHidden() ? \"none\" : \"\"" } }, ngImport: i0, template: "@if (!isHidden()) {\n  <div\n    [ngClass]=\"config().classes\"\n    [class.inline-field]=\"inlineField()\"\n    class=\"field-container\">\n    @if (config().heading) {\n      <crispr-heading\n        [config]=\"config().heading\">\n      </crispr-heading>\n    }\n    <ng-content>\n    </ng-content>\n  </div>\n}\n", styles: ["::ng-deep mat-form-field.mat-mdc-form-field{display:block;padding:.25em 0}.inline-field{display:inline-block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: HeadingComponent, selector: "crispr-heading" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FieldContainerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-field-container', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, HeadingComponent], host: {
-                        '[style.display]': 'isHidden() ? "none" : ""',
-                    }, template: "@if (!isHidden()) {\n  <div\n    [ngClass]=\"config().classes\"\n    [class.inline-field]=\"inlineField()\"\n    class=\"field-container\">\n    @if (config().heading) {\n      <crispr-heading\n        [config]=\"config().heading\">\n      </crispr-heading>\n    }\n    <ng-content>\n    </ng-content>\n  </div>\n}\n", styles: ["::ng-deep mat-form-field.mat-mdc-form-field{display:block;padding:.25em 0}.inline-field{display:inline-block}\n"] }]
-        }], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: true }] }], inlineField: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineField", required: false }] }] } });
-
-class SelectedFileComponent {
-    constructor() {
-        this.fileName = input.required(...(ngDevMode ? [{ debugName: "fileName" }] : []));
-        this.progress = input(...(ngDevMode ? [undefined, { debugName: "progress" }] : []));
-        this.showProgress = input(...(ngDevMode ? [undefined, { debugName: "showProgress" }] : []));
-        this.color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : []));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SelectedFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: SelectedFileComponent, isStandalone: true, selector: "crispr-selected-file", inputs: { fileName: { classPropertyName: "fileName", publicName: "fileName", isSignal: true, isRequired: true, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, showProgress: { classPropertyName: "showProgress", publicName: "showProgress", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<h3 class=\"mat-h3\">{{ fileName() }}</h3>\n@if (showProgress()) {\n  <mat-progress-bar\n    mode=\"determinate\"\n    [color]=\"color()\"\n    [value]=\"progress()\">\n  </mat-progress-bar>\n}\n", styles: ["mat-progress-bar{margin-bottom:8px}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SelectedFileComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-selected-file', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        MatProgressBarModule
-                    ], template: "<h3 class=\"mat-h3\">{{ fileName() }}</h3>\n@if (showProgress()) {\n  <mat-progress-bar\n    mode=\"determinate\"\n    [color]=\"color()\"\n    [value]=\"progress()\">\n  </mat-progress-bar>\n}\n", styles: ["mat-progress-bar{margin-bottom:8px}\n"] }]
-        }], propDecorators: { fileName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileName", required: true }] }], progress: [{ type: i0.Input, args: [{ isSignal: true, alias: "progress", required: false }] }], showProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProgress", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
-
-/* eslint-disable @nx/enforce-module-boundaries */
-class FileUploadFieldComponent extends CrisprControlComponent {
-    /**
-     * Plain boolean view of `uploaded`, kept only for the public `AbstractUploadComponent` contract so
-     * consumers of the `uploadFiles` callback can still read and assign `isUploaded`.
-     * Internal code and the template use the `uploaded` signal directly.
-     */
-    get isUploaded() {
-        return this.uploaded();
-    }
-    set isUploaded(value) {
-        this.uploaded.set(value);
-    }
-    // ngControl: NgControl = null;
-    constructor() {
-        super();
-        this.ngControl = inject(NgControl, { optional: true, self: true });
-        this.defaultConfig = {
-            allowMultipleFiles: false,
-            acceptedTypes: '*.*',
-            dropZoneText: 'DROP FILE HERE',
-            selectFilesButtonType: 'button',
-            selectButtonText: 'SELECT',
-            showClearFilesButton: true,
-            clearFilesButtonText: 'CLEAR',
-            uploadButtonText: 'UPLOAD',
-            uploadButtonType: 'button',
-            showUploadProgress: false,
-            disableOnUpload: true,
-        };
-        this.selectedFiles = signal(null, ...(ngDevMode ? [{ debugName: "selectedFiles" }] : []));
-        this.selectedFilesArray = computed(() => this.selectedFiles() ? Array.from(this.selectedFiles()) : [], ...(ngDevMode ? [{ debugName: "selectedFilesArray" }] : []));
-        /**
-         * Whether the files have been uploaded. A signal so that changes made asynchronously (e.g. from the
-         * `uploadFiles` callback once an upload finishes) re-render the OnPush/zoneless component.
-         */
-        this.uploaded = signal(false, ...(ngDevMode ? [{ debugName: "uploaded" }] : []));
-        this.fileProgress = [];
-        const ngControl = this.ngControl;
-        if (this.ngControl != null) {
-            // Setting the value accessor directly (instead of using
-            // the providers) to avoid running into a circular import.
-            ngControl.valueAccessor = this;
-        }
-    }
-    ngOnInit() {
-        super.ngOnInit();
-        this.disabled$ = this.config().disabledCallback
-            ? this.config().disabledCallback(this.group())
-            : of(false);
-    }
-    filesChanged(files) {
-        if (files && files.length > 0) {
-            this.selectedFiles.set(files);
-            this.control().patchValue(files);
-            this.config().filesChanged?.(this.group(), files);
-        }
-    }
-    uploadFiles() {
-        if (this.selectedFiles() && this.config().uploadFiles) {
-            this.uploaded.set(true);
-            this.config().uploadFiles(this.group(), this.selectedFiles(), this);
-        }
-    }
-    resetFileInput() {
-        this.fileInputRef.nativeElement.value = '';
-        this.control().patchValue(null);
-        this.uploaded.set(false);
-    }
-    writeValue(value) {
-        // clear file input
-        // this.host.nativeElement.value = '';
-        // this.file = null;
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FileUploadFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: FileUploadFieldComponent, isStandalone: true, selector: "crispr-file-upload-field", viewQueries: [{ propertyName: "fileInputRef", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<crispr-field-container\n  [config]=\"config()\"\n  [group]=\"group()\">\n  <mat-form-field floatLabel=\"always\"\n    [attr.data-testid]=\"testId()\"\n    [color]=\"config().color\"\n    appearance=\"outline\"\n    [crisprFileDropzone]=\"!(disabled$ | async) && !(config().disableOnUpload && uploaded())\"\n    [formGroup]=\"group()\"\n    (fileDrop)=\"filesChanged($event)\">\n\n    <input [formControlName]=\"config().controlName\" matInput type=\"text\"/>\n    <input\n      #fileInput\n      type=\"file\"\n      style=\"display: none\"\n      [accept]=\"config().acceptedTypes\"\n      [multiple]=\"config().allowMultipleFiles\"\n      (change)=\"filesChanged($event.target.files)\"/>\n    <mat-label>{{config().label}}</mat-label>\n\n    @if (!selectedFiles() || selectedFiles().length === 0) {\n      <div  class=\"drop-info\">\n        <mat-icon class=\"drop-icon\" inline=\"true\">cloud_upload</mat-icon>\n        <h2 class=\"mat-h2\">{{config().dropZoneText}}</h2>\n        or\n        <button\n          mat-raised-button\n          type=\"button\"\n          color=\"primary\"\n          [disabled]=\"(disabled$ | async) || config().disableOnUpload && uploaded()\"\n          (click)=\"fileInput.click()\"\n          [attr.aria-label]=\"config().controlName\">\n          {{config().selectButtonText}}\n        </button>\n      </div>\n    } @else {\n      <div class=\"selected-files-container\">\n        <div class=\"selected-files-list\">\n          @for (file of selectedFilesArray(); track file; let i = $index) {\n            <crispr-selected-file\n              [color]=\"config().color === 'primary' ? 'accent' : 'primary'\"\n              [fileName]=\"file.name\"\n              [showProgress]=\"config().showUploadProgress\"\n              [progress]=\"fileProgress && (fileProgress[i] | async)\">\n            </crispr-selected-file>\n          }\n        </div>\n      </div>\n    }\n    @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n  </mat-form-field>\n  @if ((selectedFiles())?.length > 0) {\n    <div class=\"button-container\">\n      <button\n        mat-button\n        (click)=\"resetFileInput()\"\n        type=\"button\"\n        [disabled]=\"(disabled$ | async) || (config().disableOnUpload && uploaded())\"\n        aria-label=\"Remove Selected File(s)\">\n        {{config().clearFilesButtonText}}\n        <mat-icon>delete</mat-icon>\n      </button>\n      @if (!!config().uploadFiles) {\n        <button\n          mat-raised-button\n          type=\"button\"\n          color=\"accent\"\n          class=\"file-input-button\"\n          [disabled]=\"(disabled$ | async) || (config().disableOnUpload && uploaded())\"\n          (click)=\"uploadFiles()\"\n          [attr.aria-label]=\"config().uploadButtonText\">\n          {{ config().uploadButtonText }}\n        </button>\n      }\n    </div>\n  }\n</crispr-field-container>\n", styles: [":host ::ng-deep .mat-mdc-form-field .mat-mdc-form-field-infix{padding-top:0;display:flex;justify-content:center}:host .drop-info{display:flex;flex-direction:column;align-items:center}:host .drop-info .drop-icon{font-size:36px}:host .drop-info .mat-h2{margin:0}:host .button-container{display:flex;justify-content:flex-end;margin-top:-16px}:host .button-container button{margin-left:8px}:host .selected-files-container{width:100%}:host [matInput]{position:absolute;max-height:0;visibility:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.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$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: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { 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: SelectedFileComponent, selector: "crispr-selected-file", inputs: ["fileName", "progress", "showProgress", "color"] }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorsDirective, selector: "[formControl], [formControlName]" }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "directive", type: FileDropzoneDirective, selector: "[crisprFileDropzone]", inputs: ["crisprFileDropzone"], outputs: ["fileDrop"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FileUploadFieldComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-file-upload-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
-                        CommonModule,
-                        FieldContainerComponent,
-                        ReactiveFormsModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        SelectedFileComponent,
-                        FormValidationHandlerModule,
-                        FileDropzoneDirective,
-                    ], standalone: true, template: "<crispr-field-container\n  [config]=\"config()\"\n  [group]=\"group()\">\n  <mat-form-field floatLabel=\"always\"\n    [attr.data-testid]=\"testId()\"\n    [color]=\"config().color\"\n    appearance=\"outline\"\n    [crisprFileDropzone]=\"!(disabled$ | async) && !(config().disableOnUpload && uploaded())\"\n    [formGroup]=\"group()\"\n    (fileDrop)=\"filesChanged($event)\">\n\n    <input [formControlName]=\"config().controlName\" matInput type=\"text\"/>\n    <input\n      #fileInput\n      type=\"file\"\n      style=\"display: none\"\n      [accept]=\"config().acceptedTypes\"\n      [multiple]=\"config().allowMultipleFiles\"\n      (change)=\"filesChanged($event.target.files)\"/>\n    <mat-label>{{config().label}}</mat-label>\n\n    @if (!selectedFiles() || selectedFiles().length === 0) {\n      <div  class=\"drop-info\">\n        <mat-icon class=\"drop-icon\" inline=\"true\">cloud_upload</mat-icon>\n        <h2 class=\"mat-h2\">{{config().dropZoneText}}</h2>\n        or\n        <button\n          mat-raised-button\n          type=\"button\"\n          color=\"primary\"\n          [disabled]=\"(disabled$ | async) || config().disableOnUpload && uploaded()\"\n          (click)=\"fileInput.click()\"\n          [attr.aria-label]=\"config().controlName\">\n          {{config().selectButtonText}}\n        </button>\n      </div>\n    } @else {\n      <div class=\"selected-files-container\">\n        <div class=\"selected-files-list\">\n          @for (file of selectedFilesArray(); track file; let i = $index) {\n            <crispr-selected-file\n              [color]=\"config().color === 'primary' ? 'accent' : 'primary'\"\n              [fileName]=\"file.name\"\n              [showProgress]=\"config().showUploadProgress\"\n              [progress]=\"fileProgress && (fileProgress[i] | async)\">\n            </crispr-selected-file>\n          }\n        </div>\n      </div>\n    }\n    @if (config().hint && (control().valid || !control().touched)) {<mat-hint>{{config().hint}}</mat-hint>}\n  </mat-form-field>\n  @if ((selectedFiles())?.length > 0) {\n    <div class=\"button-container\">\n      <button\n        mat-button\n        (click)=\"resetFileInput()\"\n        type=\"button\"\n        [disabled]=\"(disabled$ | async) || (config().disableOnUpload && uploaded())\"\n        aria-label=\"Remove Selected File(s)\">\n        {{config().clearFilesButtonText}}\n        <mat-icon>delete</mat-icon>\n      </button>\n      @if (!!config().uploadFiles) {\n        <button\n          mat-raised-button\n          type=\"button\"\n          color=\"accent\"\n          class=\"file-input-button\"\n          [disabled]=\"(disabled$ | async) || (config().disableOnUpload && uploaded())\"\n          (click)=\"uploadFiles()\"\n          [attr.aria-label]=\"config().uploadButtonText\">\n          {{ config().uploadButtonText }}\n        </button>\n      }\n    </div>\n  }\n</crispr-field-container>\n", styles: [":host ::ng-deep .mat-mdc-form-field .mat-mdc-form-field-infix{padding-top:0;display:flex;justify-content:center}:host .drop-info{display:flex;flex-direction:column;align-items:center}:host .drop-info .drop-icon{font-size:36px}:host .drop-info .mat-h2{margin:0}:host .button-container{display:flex;justify-content:flex-end;margin-top:-16px}:host .button-container button{margin-left:8px}:host .selected-files-container{width:100%}:host [matInput]{position:absolute;max-height:0;visibility:hidden}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { fileInputRef: [{
-                type: ViewChild,
-                args: ['fileInput']
-            }] } });
-
-var index$3 = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    FileUploadFieldComponent: FileUploadFieldComponent
-});
-
-var index$2 = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    FieldContainerComponent: FieldContainerComponent,
-    FileDropzoneDirective: FileDropzoneDirective,
-    FileUploadFieldComponent: FileUploadFieldComponent,
-    HeadingComponent: HeadingComponent,
-    InfoComponent: InfoComponent,
-    SelectedFileComponent: SelectedFileComponent
-});
-
-class CrisprDisplayFieldDirective {
-    constructor() {
-        this.container = inject(ViewContainerRef);
-        this.group = input(...(ngDevMode ? [undefined, { debugName: "group" }] : []));
-        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
-        this.component = input(...(ngDevMode ? [undefined, { debugName: "component" }] : []));
-        this.index = input(...(ngDevMode ? [undefined, { debugName: "index" }] : []));
-        effect(() => {
-            this.updateComponentValue(this.value());
-        });
-    }
-    async ngOnInit() {
-        if (this.component()) {
-            const componentRef = this.container.createComponent(this.component());
-            this.componentRef = componentRef;
-            this.componentInstance = componentRef.instance;
-            this.componentInstance.index = this.index();
-            this.updateComponentValue(this.value());
-        }
-    }
-    updateComponentValue(value) {
-        if (!this.componentRef)
-            return;
-        this.componentRef.setInput('value', value);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprDisplayFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.6", type: CrisprDisplayFieldDirective, isStandalone: true, selector: "[crisprDisplayField]", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprDisplayFieldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[crisprDisplayField]',
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [], propDecorators: { group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], component: [{ type: i0.Input, args: [{ isSignal: true, alias: "component", required: false }] }], index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: false }] }] } });
-
-const defaultConfig = {
-    addButtonLabel: 'ADD ITEM',
-    minListLength: 1,
-};
-class FormGroupListComponent extends CrisprControlComponent {
-    constructor() {
-        super(...arguments);
-        this.defaultConfig = defaultConfig;
-        /**
-         * By setting this to true when adding/removing items from array,
-         * we can block original values from overwriting form values
-         * */
-        this.blockValue = false;
-        this.selectedIndex = null;
-    }
-    ngOnInit() {
-        super.ngOnInit();
-        // TODO: this is required to ngFor of controls in template, must be a better way
-    }
-    setControlValue(values) {
-        const formArray = this.control();
-        if (formArray) {
-            if (values?.length > 0) {
-                // clear any existing values so that new values don't concatenate onto the old
-                const currentValues = formArray.value;
-                if (currentValues.length) {
-                    formArray.clear();
-                }
-                values.forEach((value) => this.addGroup(value));
-            }
-            else if (this.config().displayInitialItem) {
-                this.addGroup();
-            }
-        }
-    }
-    clickDelete(index) {
-        this.blockValue = true;
-        this.deleteGroup(index);
-    }
-    clickAdd() {
-        this.blockValue = true;
-        this.addGroup();
-    }
-    addGroup(value = null) {
-        const formArray = this.control();
-        formArray.push(createControlForType(this.config().itemConfig, value));
-    }
-    deleteGroup(index) {
-        const formArray = this.control();
-        formArray.removeAt(index);
-    }
-    clickEditItem(index) {
-        this.selectedIndex = index;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FormGroupListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: FormGroupListComponent, isStandalone: true, selector: "crispr-form-group-list", usesInheritance: true, ngImport: i0, template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\" [formGroup]=\"group()\">\n\n  <div [formArrayName]=\"config().controlName\">\n\n    <!-- Don't add trackBy function, it confuses the state of the array -->\n    @for (itemControl of control()?.controls; track itemControl; let i = $index; let last = $last) {\n    @if (!config().displayItemComponent || i === selectedIndex || (last && selectedIndex ?? true)) {\n    <!-- TODO: use content projection to allow custom item label component -->\n    <div class=\"item-header\">\n      <span class=\"mat-h2\"> {{ config().itemLabelBuilder ? config().itemLabelBuilder(i) : 'Item ' + (i + 1) }} </span>\n      @if (i + 1 > config().minListLength) {\n      <button mat-icon-button type=\"button\">\n        <mat-icon (click)=\"clickDelete(i)\">delete</mat-icon>\n      </button>\n      }\n    </div>\n    <div [formGroup]=\"itemControl\">\n      <!-- TODO: if chiplists didn't need to have labels mixed in with their values we could use [value]=\"control.value\" below -->\n      @for (field of config().itemConfig.fields; track field) {\n      <ng-container crisprField [value]=\"blockValue ? null : value()?.[i] | initialControlValue : field\"\n        [config]=\"field\" [group]=\"itemControl\" [testIdPrefix]=\"testId() + '[' + i + ']'\">\n      </ng-container>\n      }\n    </div>\n    } @else {\n    <div class=\"display-field-container\" crisprDisplayField [component]=\"config().displayItemComponent\"\n      [value]=\"itemControl.value\" [index]=\"i\">\n      <button mat-icon-button (click)=\"clickEditItem(i)\">\n        <mat-icon>edit</mat-icon>\n      </button>\n    </div>\n    }\n    <ng-template #display>\n      <div class=\"display-field-container\" crisprDisplayField [component]=\"config().displayItemComponent\"\n        [value]=\"itemControl.value\" [index]=\"i\">\n        <button mat-icon-button (click)=\"clickEditItem(i)\">\n          <mat-icon>edit</mat-icon>\n        </button>\n      </div>\n    </ng-template>\n    }\n  </div>\n  <div class=\"group-footer\">\n    <button type=\"button\" class=\"add\" mat-raised-button [color]=\"config().addButtonColor\" (click)=\"clickAdd()\">\n      {{config().addItemLabel || config().addButtonLabel}}\n    </button>\n  </div>\n\n</crispr-field-container>", styles: [".item-header{display:flex;justify-content:space-between}.group-footer{display:flex;justify-content:flex-end}.group-footer button.add{margin-bottom:16px}.display-field-container{position:relative}.display-field-container button{position:absolute;top:0;right:0}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { 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.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: CrisprFieldDirective, selector: "[crisprField]", inputs: ["config", "group", "testIdPrefix", "value"] }, { kind: "directive", type: CrisprDisplayFieldDirective, selector: "[crisprDisplayField]", inputs: ["group", "value", "component", "index"] }, { kind: "ngmodule", type: CrisprPipesModule }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "directive", type: i6.ControlErrorContainerDirective, selector: "[controlErrorContainer], [formGroup]" }, { kind: "pipe", type: InitialControlValuePipe, name: "initialControlValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FormGroupListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-form-group-list', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
-                        MatButtonModule,
-                        MatIconModule,
-                        FieldContainerComponent,
-                        ReactiveFormsModule,
-                        CrisprFieldDirective,
-                        CrisprDisplayFieldDirective,
-                        CrisprPipesModule,
-                        FormValidationHandlerModule
-                    ], standalone: true, template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\" [formGroup]=\"group()\">\n\n  <div [formArrayName]=\"config().controlName\">\n\n    <!-- Don't add trackBy function, it confuses the state of the array -->\n    @for (itemControl of control()?.controls; track itemControl; let i = $index; let last = $last) {\n    @if (!config().displayItemComponent || i === selectedIndex || (last && selectedIndex ?? true)) {\n    <!-- TODO: use content projection to allow custom item label component -->\n    <div class=\"item-header\">\n      <span class=\"mat-h2\"> {{ config().itemLabelBuilder ? config().itemLabelBuilder(i) : 'Item ' + (i + 1) }} </span>\n      @if (i + 1 > config().minListLength) {\n      <button mat-icon-button type=\"button\">\n        <mat-icon (click)=\"clickDelete(i)\">delete</mat-icon>\n      </button>\n      }\n    </div>\n    <div [formGroup]=\"itemControl\">\n      <!-- TODO: if chiplists didn't need to have labels mixed in with their values we could use [value]=\"control.value\" below -->\n      @for (field of config().itemConfig.fields; track field) {\n      <ng-container crisprField [value]=\"blockValue ? null : value()?.[i] | initialControlValue : field\"\n        [config]=\"field\" [group]=\"itemControl\" [testIdPrefix]=\"testId() + '[' + i + ']'\">\n      </ng-container>\n      }\n    </div>\n    } @else {\n    <div class=\"display-field-container\" crisprDisplayField [component]=\"config().displayItemComponent\"\n      [value]=\"itemControl.value\" [index]=\"i\">\n      <button mat-icon-button (click)=\"clickEditItem(i)\">\n        <mat-icon>edit</mat-icon>\n      </button>\n    </div>\n    }\n    <ng-template #display>\n      <div class=\"display-field-container\" crisprDisplayField [component]=\"config().displayItemComponent\"\n        [value]=\"itemControl.value\" [index]=\"i\">\n        <button mat-icon-button (click)=\"clickEditItem(i)\">\n          <mat-icon>edit</mat-icon>\n        </button>\n      </div>\n    </ng-template>\n    }\n  </div>\n  <div class=\"group-footer\">\n    <button type=\"button\" class=\"add\" mat-raised-button [color]=\"config().addButtonColor\" (click)=\"clickAdd()\">\n      {{config().addItemLabel || config().addButtonLabel}}\n    </button>\n  </div>\n\n</crispr-field-container>", styles: [".item-header{display:flex;justify-content:space-between}.group-footer{display:flex;justify-content:flex-end}.group-footer button.add{margin-bottom:16px}.display-field-container{position:relative}.display-field-container button{position:absolute;top:0;right:0}\n"] }]
-        }] });
-
-var index$1 = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    FormGroupListComponent: FormGroupListComponent
-});
-
-class SubGroupComponent extends CrisprControlComponent {
-    ngOnInit() {
-        super.ngOnInit();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SubGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.6", type: SubGroupComponent, isStandalone: true, selector: "crispr-sub-group", usesInheritance: true, ngImport: i0, template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n  @for (fieldConfig of config().fields; track fieldConfig) {\n  <ng-container crisprField [value]=\"value() | initialControlValue : fieldConfig\" [config]=\"fieldConfig\"\n    [group]=\"control()\" [testIdPrefix]=\"testId()\">\n  </ng-container>\n  }\n</crispr-field-container>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: CrisprFieldDirective, selector: "[crisprField]", inputs: ["config", "group", "testIdPrefix", "value"] }, { kind: "component", type: FieldContainerComponent, selector: "crispr-field-container", inputs: ["config", "group", "inlineField"] }, { kind: "ngmodule", type: CrisprPipesModule }, { kind: "ngmodule", type: FormValidationHandlerModule }, { kind: "pipe", type: InitialControlValuePipe, name: "initialControlValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SubGroupComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'crispr-sub-group', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        CrisprFieldDirective,
-                        FieldContainerComponent,
-                        CrisprPipesModule,
-                        FormValidationHandlerModule,
-                    ], template: "<crispr-field-container [config]=\"config()\" [group]=\"group()\">\n  @for (fieldConfig of config().fields; track fieldConfig) {\n  <ng-container crisprField [value]=\"value() | initialControlValue : fieldConfig\" [config]=\"fieldConfig\"\n    [group]=\"control()\" [testIdPrefix]=\"testId()\">\n  </ng-container>\n  }\n</crispr-field-container>" }]
-        }] });
-
-/**
- * @deprecated SubGroupComponent is now standalone. Import SubGroupComponent directly.
- * This module will be removed in the next major version.
- */
-class SubGroupModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SubGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.6", ngImport: i0, type: SubGroupModule, imports: [SubGroupComponent], exports: [SubGroupComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SubGroupModule, imports: [SubGroupComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: SubGroupModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [SubGroupComponent],
-                    exports: [SubGroupComponent],
-                }]
-        }] });
-
-var index = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    SubGroupComponent: SubGroupComponent,
-    SubGroupModule: SubGroupModule
-});
-
-/**
- * @deprecated Use stanadlone CripsrFormComponent
- */
-class CrisprFormsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.6", ngImport: i0, type: CrisprFormsModule, imports: [CommonModule,
-            ReactiveFormsModule,
-            FormValidationHandlerModule,
-            FormGroupListComponent,
-            FieldContainerComponent,
-            CrisprFieldDirective,
-            CrisprDisplayFieldDirective,
-            SubGroupModule,
-            CrisprPipesModule,
-            CrisprFormComponent], exports: [CrisprFormComponent, FieldContainerComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFormsModule, imports: [CommonModule,
-            ReactiveFormsModule,
-            FormValidationHandlerModule,
-            FormGroupListComponent,
-            FieldContainerComponent,
-            SubGroupModule,
-            CrisprPipesModule,
-            CrisprFormComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CrisprFormsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        FormValidationHandlerModule,
-                        FormGroupListComponent,
-                        FieldContainerComponent,
-                        CrisprFieldDirective,
-                        CrisprDisplayFieldDirective,
-                        SubGroupModule,
-                        CrisprPipesModule,
-                        CrisprFormComponent,
-                    ],
-                    exports: [CrisprFormComponent, FieldContainerComponent],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AbstractAutocompleteComponent as A, CrisprFieldComponent as C, DEFAULT_EMPTY_OPTIONS_MESSAGE as D, FieldContainerComponent as F, HeadingComponent as H, InfoComponent as I, SelectedFileComponent as S, CrisprControlComponent as a, buildFormGroupFromConfig as b, CrisprFieldDirective as c, ControlType as d, convertBytesToMb as e, FileDropzoneDirective as f, CrisprDisplayFieldComponent as g, CrisprFormComponent as h, CrisprFormsModule as i, FileUploadFieldComponent as j, allowedFileExtValidator as k, allowedFileType as l, callOptionsIfFunction as m, createControlForType as n, observablifyOptions as o, filterOptionsByLabel as p, isControlConfig as q, maxFileSizeValidator as r, valueIn as v };
-//# sourceMappingURL=tft-crispr-forms-tft-crispr-forms-8liD7eof.mjs.map