@tft/crispr-forms 18.0.2 → 20.0.0

package/types/tft-crispr-forms.d.ts

@@ -0,0 +1,887 @@
+import * as i0 from '@angular/core';
+import { OnInit, DestroyRef, EventEmitter, WritableSignal, Signal, ChangeDetectorRef, OnDestroy, ElementRef, AfterContentInit, AfterViewInit, Renderer2, ViewContainerRef, PipeTransform } from '@angular/core';
+import * as i2 from '@angular/common';
+import * as _angular_forms from '@angular/forms';
+import { ValidatorFn, FormGroup, AbstractControl, FormControl, FormArray, ControlValueAccessor, NgControl } from '@angular/forms';
+import * as i6 from '@tft/form-validation-handler';
+import { ErrorDictionary } from '@tft/form-validation-handler';
+import { ThemePalette } from '@angular/material/core';
+import * as rxjs from 'rxjs';
+import { Observable, Subscription, BehaviorSubject, merge } from 'rxjs';
+import { TooltipPosition } from '@angular/material/tooltip';
+import { MatFormFieldAppearance } from '@angular/material/form-field';
+import { MatCalendarCellClassFunction } from '@angular/material/datepicker';
+import { ComponentType, Portal } from '@angular/cdk/portal';
+import { GoogleMap, MapGeocoder, MapInfoWindow, MapMarker } from '@angular/google-maps';
+import { DomSanitizer } from '@angular/platform-browser';
+import { MatAutocompleteTrigger, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
+import { MatSelect } from '@angular/material/select';
+import { MatChipInputEvent } from '@angular/material/chips';
+import { ConnectionPositionPair } from '@angular/cdk/overlay';
+
+declare function valueIn(values: string[]): rxjs.OperatorFunction<string, boolean>;
+
+declare enum ControlType {
+    AUTOCOMPLETE = "autocomplete",
+    AUTOCOMPLETE_CHIPLIST = "autocompleteChiplist",
+    BUTTON = "button",
+    CHECKBOX = "checkbox",
+    CUSTOM = "custom",
+    DATEPICKER = "datepicker",
+    DIVIDER = "divider",
+    FILE_UPLOAD = "fileUpload",
+    GROUP_LIST = "groupList",
+    HEADING = "heading",
+    IMAGE_UPLOAD = "imageUpload",
+    INPUT = "input",
+    MAP = "map",
+    RADIO = "radio",
+    SELECT = "select",
+    SLIDER = "slider",
+    SUB_GROUP = "subGroup",
+    TEXTAREA = "textarea",
+    UNIT_CONVERSION = "unitConversion"
+}
+/**
+ * The base interface for all the fields in the form's config
+ */
+interface CrisprFieldConfig {
+    controlType?: ControlType;
+    classes?: string[];
+    component?: any;
+}
+/**
+ * A utility type that returns the keys of a type if one is passed otherwise return string type
+ */
+type RestrictedControlName<M> = M extends null ? string : keyof M;
+/**
+ * The base interface for all control configs
+ */
+interface CrisprControlConfig<M = null> extends CrisprFieldConfig {
+    controlName: RestrictedControlName<M>;
+    controlType: ControlType;
+    validators?: ValidatorFn[];
+    computeValue?: (group: FormGroup) => Observable<unknown>;
+    disabledCallback?: (group: FormGroup) => Observable<boolean>;
+    /**
+     * Hide the control when disabled
+     * @default false
+     */
+    hideDisabled?: boolean;
+    heading?: HeadingConfig;
+    hint?: string;
+}
+/**
+ * Holds properties for control fields that describe field behavior to users
+ */
+interface FieldDescriptors {
+    label: string;
+    info?: Info;
+    fieldSuffix?: string;
+    placeholder?: string;
+}
+interface MatFieldProperties {
+    appearance?: MatFormFieldAppearance;
+    color?: ThemePalette;
+}
+interface Info {
+    content: string;
+    tooltipPosition?: TooltipPosition;
+    iconName?: string;
+}
+interface AbstractGroupConfig<C extends CrisprFieldConfig = AnyFieldConfig> {
+    fields?: (AnyFieldConfig | C)[];
+}
+interface FormConfig<C = AnyFieldConfig> extends AbstractGroupConfig<C> {
+    classes?: string[];
+    errorDictionary?: ErrorDictionary;
+    autoComplete?: string;
+    /** @deprecated use autoComplete */
+    autocomplete?: string;
+    validators?: ValidatorFn[];
+}
+/**
+ * Configuration for SubGroup components
+ */
+interface SubGroupConfig extends CrisprControlConfig, AbstractGroupConfig<any> {
+    controlType: ControlType.SUB_GROUP;
+}
+type AnyFieldConfig = InputFieldConfig | SelectFieldConfig | RadioFieldConfig | FormGroupListConfig | SubGroupConfig | AutocompleteFieldConfig | AutocompleteChiplistFieldConfig | TextareaFieldConfig | CheckboxFieldConfig | DatepickerFieldConfig | MapFieldConfig | SliderFieldConfig | FileUploadFieldConfig | ImageUploadFieldConfig | HeadingConfig | ButtonConfig | DividerConfig | UnitConversionFieldConfig;
+type ControlValue<T = any> = boolean | string | number | Date | SelectOption | SelectOption[] | ControlGroupValue | T;
+type ControlGroupValue = {
+    [key: string]: ControlValue;
+};
+
+interface InputFieldConfig extends CrisprControlConfig, FieldDescriptors, MatFieldProperties {
+    controlType: ControlType.INPUT;
+    inputType?: InputType;
+    min?: number;
+    max?: number;
+    maxLength?: number;
+    step?: number;
+    pattern?: string;
+    autofocus?: boolean;
+    spellcheck?: boolean;
+    autoComplete?: string;
+    autoCapitalize?: 'off' | 'on';
+}
+type InputType = 'color' | 'date' | 'datetime-local' | 'email' | 'month' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'time' | 'url' | 'week';
+
+interface SelectFieldConfig extends Omit<CrisprControlConfig, 'placeholder'>, FieldDescriptors, MatFieldProperties {
+    controlType: ControlType.SELECT;
+    emptyOptionsMessage?: string;
+    multiple?: boolean;
+    enableToggleAll?: boolean;
+    options: OptionsType;
+}
+type OptionsType = SelectOption[] | Observable<SelectOption[]> | OptionsCallback | Promise<SelectOption[]>;
+type OptionsCallback = (group?: FormGroup) => OptionsType;
+type ReactiveOptionsCallback = (group?: FormGroup) => Observable<SelectOption[]>;
+type AutocompleteOptionsCallback = (group?: FormGroup, searchTerm?: string) => OptionsType;
+interface SelectOption {
+    label: string;
+    value: any;
+    imageUrl?: string;
+    info?: Info;
+}
+declare const DEFAULT_EMPTY_OPTIONS_MESSAGE = "No Items";
+
+interface RadioFieldConfig extends Omit<CrisprControlConfig, 'placeholder'>, Omit<FieldDescriptors, 'label'>, MatFieldProperties {
+    controlType: ControlType.RADIO;
+    options: OptionsType;
+}
+
+interface AbstractAutocompleteFieldConfig extends CrisprControlConfig, FieldDescriptors, MatFieldProperties {
+    typeToEmit?: boolean;
+    typeDebounceTime?: number;
+    emptyOptionsMessage?: string;
+    options: AutocompleteOptionsCallback;
+    autoActiveFirstOption?: boolean;
+    imageUrlParam?: string;
+    displayWith?: (options: SelectOption[]) => (value: unknown) => string;
+}
+interface AutocompleteFieldConfig extends AbstractAutocompleteFieldConfig {
+    controlType: ControlType.AUTOCOMPLETE;
+}
+
+interface AutocompleteChiplistFieldConfig extends AbstractAutocompleteFieldConfig, FieldDescriptors, MatFieldProperties {
+    controlType: ControlType.AUTOCOMPLETE_CHIPLIST;
+    autoActiveFirstOption?: boolean;
+    chipsSelectable?: boolean;
+    areChipsRemovable?: boolean;
+    allowDuplicates?: boolean;
+    duplicateCompareFunction?: (chip: SelectOption, availableOption: SelectOption) => boolean;
+    /**
+     * Pass in any key codes to use for selection
+     */
+    separatorKeyCodes?: number[];
+    tabToSelect?: boolean;
+    /**
+     * @deprecated replaced with tabToSelect as it is more accurate
+     */
+    addChipOnBlur?: boolean;
+}
+
+interface CheckboxFieldConfig extends CrisprControlConfig, Pick<FieldDescriptors, 'label' | 'info'>, Pick<MatFieldProperties, 'color'> {
+    controlType: ControlType.CHECKBOX;
+    labelPosition?: 'before' | 'after';
+    inline?: boolean;
+}
+
+interface TextareaFieldConfig extends CrisprControlConfig, FieldDescriptors, MatFieldProperties {
+    controlType: ControlType.TEXTAREA;
+    rows?: number;
+}
+
+interface DatepickerFieldConfig extends CrisprControlConfig, Pick<FieldDescriptors, 'label'>, MatFieldProperties {
+    controlType: ControlType.DATEPICKER;
+    min?: Date;
+    max?: Date;
+    startView?: 'month' | 'year' | 'multi-year';
+    startAt?: Date | ((group: FormGroup) => Observable<Date>) | null;
+    touchUi?: boolean;
+    datepickerFilter?: (date: Date) => boolean;
+    cellClassFunction?: MatCalendarCellClassFunction<Date>;
+    dateClass?: (parentGroup: FormGroup) => Observable<MatCalendarCellClassFunction<Date>>;
+    /**
+     * Pass a component into mat-datepicker-actions component see [docs](https://material.angular.io/components/datepicker/overview#confirmation-action-buttons)
+     */
+    datepickerActions?: ComponentType<any>;
+}
+
+interface SliderFieldConfig extends CrisprControlConfig, Pick<FieldDescriptors, 'label' | 'info'>, Pick<MatFieldProperties, 'color'> {
+    controlType: ControlType.SLIDER;
+    displayWith?: (value: number) => string | number;
+    max?: number;
+    min?: number;
+    step?: number;
+    discrete?: boolean;
+    tickInterval?: number | 'auto';
+    displayLimits?: boolean;
+}
+
+interface FormGroupListConfig extends CrisprControlConfig {
+    controlType: ControlType.GROUP_LIST;
+    itemConfig: SubGroupConfig;
+    itemLabelBuilder?: (index: number) => string;
+    /** The number of list items that a user can delete */
+    minListLength?: number;
+    /** If no items are passed as an initial value, should an initial empty item be created */
+    displayInitialItem?: boolean;
+    addButtonColor?: ThemePalette;
+    addButtonLabel?: string;
+    displayItemComponent?: any;
+    /**
+     * @deprecated Please use addButtonLabel, addItemLabel will be removed in the next major release
+     */
+    addItemLabel?: string;
+}
+
+interface ButtonConfig extends CrisprFieldConfig, MatFieldProperties {
+    label?: string;
+    controlType: ControlType.BUTTON;
+    type?: 'submit' | 'reset' | 'button';
+    callback?: (group?: FormGroup, event?: MouseEvent) => unknown;
+    buttonType?: MatButtonType;
+    color?: ThemePalette;
+    icon?: string;
+    info?: Omit<Info, 'iconName'>;
+    disabledOnInvalidForm?: boolean;
+}
+type ButtonType = 'submit' | 'reset' | 'button';
+type MatButtonType = 'raised' | 'flat' | 'stroked' | 'icon';
+
+interface HeadingConfig extends Omit<CrisprFieldConfig, 'controlType'>, Omit<FieldDescriptors, 'placeholder' | 'fieldSuffix'> {
+    controlType?: ControlType.HEADING;
+    typographyClass?: string;
+    label: string;
+}
+
+type DividerConfig = Omit<CrisprFieldConfig, 'label'> & {
+    controlType?: ControlType.DIVIDER;
+    vertical?: boolean;
+};
+
+type UnitConversionFieldConfig<ST = unknown, UT = unknown> = CrisprControlConfig & FieldDescriptors & MatFieldProperties & {
+    controlType: ControlType.UNIT_CONVERSION;
+    /**
+     * Used convert config value to displayed value on initialization
+     */
+    initialDisplayValueConversion: (value?: ST, displayedUnit?: UT) => number;
+    /**
+     * The function to convert the display value into the stored value as the display value changes
+     */
+    storedValueConversion: (value?: string, displayedUnit?: UT) => number;
+    min?: number;
+    max?: number;
+    autofocus?: boolean;
+    step?: number;
+} & ({
+    showUnitSelect: true;
+    /**
+     * A callback function that returns the options to be used by the unit select field. Can be used just like select field options.
+     */
+    selectableUnits: (group: FormGroup) => OptionsType;
+    /**
+     * Display unit to use on component initialization and when unit not user selectable i.e. showUnitSelect: false
+     */
+    initialDisplayUnit: UT;
+} | {
+    showUnitSelect: false;
+});
+
+interface AbstractUploadComponent {
+    isUploaded: boolean;
+    fileProgress: Observable<number>[];
+    disabled$: Observable<boolean>;
+}
+type FileUploadFieldConfig = CrisprControlConfig & MatFieldProperties & {
+    controlType: ControlType.FILE_UPLOAD;
+    label: string;
+    filesChanged?: (parentGroup: FormGroup, files: FileList) => void;
+    allowMultipleFiles?: boolean;
+    showClearFilesButton?: boolean;
+    acceptedTypes?: string;
+    selectFilesButtonType?: ButtonType;
+    selectButtonText?: string;
+    clearFilesButtonText?: string;
+    dropZoneText?: string;
+} & (EnabledUploadButtonConfig | DisabledUploadButtonConfig);
+interface EnabledUploadButtonConfig {
+    uploadFiles: (parentGroup: FormGroup, files: FileList, uploadComponent: AbstractUploadComponent) => Promise<unknown> | unknown;
+    showUploadProgress?: boolean;
+    disableOnUpload?: boolean;
+    uploadButtonType?: ButtonType;
+    uploadButtonText?: string;
+}
+type DisabledUploadButtonConfig = NeverProps<EnabledUploadButtonConfig>;
+type NeverProps<T> = {
+    [P in keyof T]?: never;
+};
+
+type ImageUploadFieldConfig = CrisprControlConfig & MatFieldProperties & {
+    controlType: ControlType.IMAGE_UPLOAD;
+    label: string;
+    filesChanged?: (parentGroup: FormGroup, file: File) => void;
+    /**
+     * The file types to accept. The onus is on the consuming developer to limit these to file types compatible with usage.
+     * See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept
+     */
+    acceptedTypes: string;
+    fileName?: string;
+    showClearFilesButton?: boolean;
+    selectFilesButtonType?: ButtonType;
+    selectButtonText?: string;
+    clearFilesButtonText?: string;
+    resetFilesButtonText?: string;
+    dropZoneText?: string;
+    /**
+     * If the input value of the control is not a string of the src
+     * url to the image, this function allows consumers to map their
+     * input value into one
+     */
+    mapInputValueToUrl?: (inputValue: unknown) => string;
+    /**
+     * Should the field compress the image after loading it
+     * @default false
+     */
+    compressImage?: boolean;
+    /**
+     * The target size of the compressed image
+     */
+    targetCompressedImageFileSizeMb?: number;
+    /**
+     * The minimum file size in MB required to trigger compression. Useful for preventing compression on files near the target compression size.
+     * @default .7
+     */
+    minCompressionThresholdMb?: number;
+    /**
+     * The maximum height or width of the compressed image
+     * @default undefined
+     */
+    maxWidthOrHeight?: number;
+    /**
+     * When true runs compression using a web worker, otherwise compression happens on the main thread.
+     * @default true
+     */
+    useWebWorker?: boolean;
+    /**
+     * The height of the image preview container
+     */
+    imagePreviewHeight?: string;
+};
+
+type MapFieldConfig<OMT = unknown> = CrisprControlConfig & MatFieldProperties & FieldDescriptors & {
+    controlType: ControlType.MAP;
+    label: string;
+    center?: google.maps.LatLngLiteral;
+    location?: string;
+    options?: google.maps.MapOptions;
+    debounceTime?: number;
+    markers?: (map: GoogleMap, group: FormGroup) => Observable<TftMapMarker[]>;
+    infoWindowTemplateBuilder?: TemplateBuilder<TftMapMarker>;
+    valueDisplayKey?: string;
+    onMove?: (map: GoogleMap, group: FormGroup) => OMT;
+};
+type TftMapMarker<DT = unknown> = google.maps.marker.AdvancedMarkerElementOptions & {
+    value: DT;
+};
+type TemplateBuilder<T> = (props: T) => string;
+
+declare abstract class CrisprFieldComponent<C extends CrisprFieldConfig> {
+    defaultConfig?: Partial<C>;
+    set inputConfig(config: C);
+    private updateConfig;
+    config: i0.WritableSignal<C>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprFieldComponent<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CrisprFieldComponent<any>, never, never, { "inputConfig": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class CrisprControlComponent<C extends CrisprControlConfig> extends CrisprFieldComponent<C> implements OnInit {
+    destroyRef: DestroyRef;
+    group: i0.WritableSignal<FormGroup<any>>;
+    set inputGroup(group: ControlValue);
+    control: i0.Signal<AbstractControl<any, any, any>>;
+    valueChanges: EventEmitter<ControlValue>;
+    value: i0.WritableSignal<any>;
+    set inputValue(value: ControlValue);
+    constructor();
+    ngOnInit(): void;
+    setControlValue(value: ControlValue): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprControlComponent<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CrisprControlComponent<any>, never, never, { "inputGroup": { "alias": "group"; "required": false; }; "inputValue": { "alias": "value"; "required": false; }; }, { "valueChanges": "valueChanges"; }, never, never, true, never>;
+}
+
+type AutocompleteConfigTypes = AutocompleteFieldConfig | AutocompleteChiplistFieldConfig;
+declare class AbstractAutocompleteComponent<C> extends CrisprControlComponent<AutocompleteConfigTypes> implements OnInit {
+    autocompleteInputControl: FormControl<string>;
+    options$: Observable<SelectOption[]>;
+    config: i0.WritableSignal<AutocompleteConfigTypes & C>;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AbstractAutocompleteComponent<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AbstractAutocompleteComponent<any>, never, never, {}, {}, never, never, true, never>;
+}
+
+declare abstract class CrisprDisplayFieldComponent extends CrisprControlComponent<CrisprControlConfig> implements OnInit {
+    index?: number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprDisplayFieldComponent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CrisprDisplayFieldComponent, never, never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * 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
+ */
+declare function buildFormGroupFromConfig(config: FormConfig, value?: any, group?: FormGroup): FormGroup<any>;
+
+declare function callOptionsIfFunction(options: OptionsType | AutocompleteOptionsCallback, parentGroup?: FormGroup, searchString?: string): OptionsType;
+
+/**
+ * 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
+ */
+declare function createControlForType(controlConfig: AnyFieldConfig, value?: ControlValue): _angular_forms.FormGroup<any> | FormArray<any> | FormControl<any>;
+
+/**
+ * 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
+ */
+declare function filterOptionsByLabel(options: SelectOption[], searchString: string): SelectOption[];
+
+/**
+ * Determines if the field config is for a form control (not a divider, heading or other non-control field)
+ */
+declare function isControlConfig(fieldConfig: CrisprFieldConfig): fieldConfig is CrisprControlConfig;
+
+/**
+ * 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
+ */
+declare function observablifyOptions(options: OptionsType, parentGroup: FormGroup, searchString?: string): Observable<SelectOption[]>;
+
+declare function convertBytesToMb(bytes: number): number;
+declare function maxFileSizeValidator(maxFileSize: number): ValidatorFn;
+declare function allowedFileExtValidator(allowedFileExtensions: string[], onlyAllowFiles?: boolean): ValidatorFn;
+declare function allowedFileType(matchExp: string | RegExp): ValidatorFn;
+
+declare class FormGroupListComponent extends CrisprControlComponent<FormGroupListConfig> implements OnInit {
+    private cdr;
+    defaultConfig: Partial<FormGroupListConfig>;
+    group: WritableSignal<FormGroup>;
+    control: Signal<FormArray>;
+    /**
+     * By setting this to true when adding/removing items from array,
+     * we can block original values from overwriting form values
+     * */
+    blockValue: boolean;
+    selectedIndex: number;
+    constructor(cdr: ChangeDetectorRef);
+    ngOnInit(): void;
+    setControlValue(values: any[]): void;
+    clickDelete(index: number): void;
+    clickAdd(): void;
+    addGroup(value?: any): void;
+    deleteGroup(index: number): void;
+    clickEditItem(index: number): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormGroupListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormGroupListComponent, "crispr-form-group-list", never, {}, {}, never, never, true, never>;
+}
+
+declare class FieldContainerComponent implements OnInit, OnDestroy {
+    config: CrisprControlConfig;
+    group: FormGroup;
+    inlineField: boolean;
+    disabled$: Observable<boolean>;
+    subs: Subscription[];
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * 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: FormGroup, config?: CrisprControlConfig): Observable<boolean>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FieldContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FieldContainerComponent, "crispr-field-container", never, { "config": { "alias": "config"; "required": false; }; "group": { "alias": "group"; "required": false; }; "inlineField": { "alias": "inlineField"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class SubGroupComponent extends CrisprControlComponent<SubGroupConfig> implements OnInit {
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SubGroupComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SubGroupComponent, "crispr-sub-group", never, {}, {}, never, never, false, never>;
+}
+
+declare class FileDropzoneDirective {
+    fileDrop: EventEmitter<FileList>;
+    crisprFileDropzone: boolean;
+    onDrop($event: DragEvent): void;
+    onDragOver($event: DragEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileDropzoneDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FileDropzoneDirective, "[crisprFileDropzone]", never, { "crisprFileDropzone": { "alias": "crisprFileDropzone"; "required": false; }; }, { "fileDrop": "fileDrop"; }, never, never, true, never>;
+}
+
+declare class FileUploadFieldComponent extends CrisprControlComponent<FileUploadFieldConfig> implements OnInit, ControlValueAccessor {
+    ngControl: NgControl;
+    onChange: () => void;
+    defaultConfig: Partial<FileUploadFieldConfig>;
+    fileInputRef: ElementRef;
+    selectedFiles: i0.WritableSignal<FileList>;
+    selectedFilesArray: i0.Signal<File[]>;
+    isUploaded: boolean;
+    fileProgress: Observable<number>[];
+    disabled$: Observable<boolean>;
+    constructor(ngControl: NgControl);
+    ngOnInit(): void;
+    filesChanged(files: FileList): void;
+    uploadFiles(): void;
+    resetFileInput(): void;
+    writeValue(value: null): void;
+    registerOnChange(fn: () => void): void;
+    registerOnTouched(fn: () => void): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadFieldComponent, [{ optional: true; self: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadFieldComponent, "crispr-file-upload-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class SelectedFileComponent {
+    fileName: string;
+    progress: number;
+    showProgress: boolean;
+    color: ThemePalette;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SelectedFileComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SelectedFileComponent, "crispr-selected-file", never, { "fileName": { "alias": "fileName"; "required": false; }; "progress": { "alias": "progress"; "required": false; }; "showProgress": { "alias": "showProgress"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class HeadingComponent extends CrisprFieldComponent<HeadingConfig> {
+    defaultConfig: Partial<HeadingConfig>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<HeadingComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HeadingComponent, "crispr-heading", never, {}, {}, never, never, true, never>;
+}
+
+declare class InfoComponent {
+    info: Info;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InfoComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InfoComponent, "crispr-info", never, { "info": { "alias": "info"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ImageUploadFieldComponent extends CrisprControlComponent<ImageUploadFieldConfig> implements OnInit, ControlValueAccessor {
+    ngControl: NgControl;
+    private domSanitizer;
+    private cdr;
+    onChange: () => void;
+    defaultConfig: Partial<ImageUploadFieldConfig>;
+    private inputImageFileSubject;
+    inputImageFile$: Observable<File>;
+    /**
+     * the compression progress
+     */
+    progress: number | undefined;
+    compressedFile$: Observable<File>;
+    compressedImageUrlString$: Observable<string | null>;
+    imageSrcUrl$: Observable<string | null>;
+    fileInputRef: ElementRef;
+    selectedFiles: FileList;
+    isUploaded: boolean;
+    disabled$: Observable<boolean>;
+    constructor(ngControl: NgControl, domSanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    ngOnInit(): void;
+    filesChanged(files: FileList): void;
+    clearFileInput(): void;
+    resetToInitialValue(initialValue: string): void;
+    writeValue(value: null): void;
+    registerOnChange(fn: () => void): void;
+    registerOnTouched(fn: () => void): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ImageUploadFieldComponent, [{ optional: true; self: true; }, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ImageUploadFieldComponent, "crispr-image-upload-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class DatepickerFieldComponent extends CrisprControlComponent<DatepickerFieldConfig> implements OnInit, AfterContentInit {
+    defaultConfig: Partial<DatepickerFieldConfig>;
+    dateClass: MatCalendarCellClassFunction<Date>;
+    dateClass$: Observable<MatCalendarCellClassFunction<Date>>;
+    startAt$: Observable<Date>;
+    /** A portal containing the footer component type for this calendar. */
+    calendarFooterPortal: Portal<any>;
+    ngOnInit(): void;
+    ngAfterContentInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DatepickerFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DatepickerFieldComponent, "crispr-datepicker-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class CheckboxFieldComponent extends CrisprControlComponent<CheckboxFieldConfig> implements OnInit {
+    defaultConfig: Partial<CheckboxFieldConfig>;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxFieldComponent, "crispr-checkbox-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class TextareaFieldComponent extends CrisprControlComponent<TextareaFieldConfig> implements OnInit {
+    defaultConfig: Partial<TextareaFieldConfig>;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TextareaFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TextareaFieldComponent, "crispr-textarea-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class AutocompleteFieldComponent extends AbstractAutocompleteComponent<AutocompleteFieldConfig> implements OnInit, OnDestroy {
+    defaultConfig: Partial<AutocompleteFieldConfig>;
+    autoInput: MatAutocompleteTrigger;
+    autoInputRef: ElementRef<HTMLInputElement>;
+    clearFieldSubscription: Subscription;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    setControlValue(value: SelectOption): void;
+    /**
+     * The material autocomplete defaults to displaying the options value instead of its label.
+     * We only have the value from the selected option to work with, so we have to pass the options
+     * through a function called in the template and return the function that the material displayWith
+     * input is expecting.
+     * @param options the array of options to search for option with corresponding value
+     */
+    displayLabel(options: SelectOption[]): (value: unknown) => string;
+    handleSelect(event: MatAutocompleteSelectedEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteFieldComponent, "crispr-autocomplete-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class SelectFieldComponent extends CrisprControlComponent<SelectFieldConfig> implements OnInit, AfterViewInit {
+    defaultConfig: {
+        enableToggleAll: boolean;
+        color: ThemePalette;
+    };
+    options$: Observable<SelectOption[]>;
+    allSelected: boolean;
+    selectField: MatSelect;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    toggleAll(isSelected: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SelectFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SelectFieldComponent, "crispr-select-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class InputFieldComponent extends CrisprControlComponent<InputFieldConfig> implements OnInit {
+    defaultConfig: Partial<InputFieldConfig>;
+    constructor();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputFieldComponent, "crispr-input-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class RadioFieldComponent extends CrisprControlComponent<RadioFieldConfig> implements OnInit {
+    defaultConfig: {};
+    options$: Observable<SelectOption[]>;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RadioFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RadioFieldComponent, "crispr-radio-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class SliderFieldComponent extends CrisprControlComponent<SliderFieldConfig> implements OnInit {
+    defaultConfig: Partial<SliderFieldConfig>;
+    constructor();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SliderFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SliderFieldComponent, "crispr-slider-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class DividerComponent extends CrisprFieldComponent<DividerConfig> {
+    defaultConfig: {};
+    static ɵfac: i0.ɵɵFactoryDeclaration<DividerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DividerComponent, "crispr-divider", never, {}, {}, never, never, true, never>;
+}
+
+declare class ButtonComponent extends CrisprFieldComponent<ButtonConfig> implements OnInit {
+    defaultConfig: Partial<ButtonConfig>;
+    formValid$: Observable<boolean>;
+    group: i0.WritableSignal<FormGroup<any>>;
+    set inputGroup(group: ControlValue);
+    get matButtonClass(): string;
+    ngOnInit(): void;
+    handleClick(group: FormGroup, event: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "crispr-button", never, { "inputGroup": { "alias": "group"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class UnitConversionFieldComponent extends CrisprControlComponent<UnitConversionFieldConfig> implements OnInit, OnDestroy {
+    defaultConfig: Partial<UnitConversionFieldConfig>;
+    displayValueControl: FormControl<any>;
+    unitSelectControl: FormControl<any>;
+    unitOptions$: Observable<SelectOption[]>;
+    transformationSubscription: Subscription;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    setInitialDisplayValue(storedValue: any, unit: unknown): void;
+    /**
+     * We override the 'setControlValue' we inherited from crisprControlMixin and add our custom logic,
+     * This function gets called onInit because were object oriented. it's so great, so great that I'm
+     * typing a paragraph to explain what the hell is going on...
+     * @param value the initial value for the control passed down from the form components input
+     */
+    setControlValue(value: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UnitConversionFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UnitConversionFieldComponent, "crispr-unit-conversion-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class AutocompleteChiplistFieldComponent extends AbstractAutocompleteComponent<AutocompleteChiplistFieldConfig> implements OnInit {
+    defaultConfig: Partial<AutocompleteChiplistFieldConfig>;
+    chips$: BehaviorSubject<SelectOption[]>;
+    remainingOptions$: Observable<SelectOption[]>;
+    selectedChip: SelectOption;
+    controlValue$: Observable<SelectOption[]>;
+    chipInput: MatAutocompleteTrigger;
+    chipInputRef: ElementRef<HTMLInputElement>;
+    ngOnInit(): void;
+    setControlValue(value: SelectOption[]): void;
+    handleSelect(event: MatAutocompleteSelectedEvent): void;
+    /**
+     * To follow ARIA standards we want to select the active option on blur.
+     * matChipInputAddOnBlur should do this but it causes buggy behaviour
+     * @param event blur event that triggers the handle blur
+     */
+    handleTab(_event: FocusEvent): void;
+    /**
+     * Handles selection via key tokens passed through separatorKeyCodes property
+     * NOTE: If TAB is used focus does not move on to next component
+     * @param event
+     */
+    handleTokenEnd(event: MatChipInputEvent): void;
+    mapToLabel(option: SelectOption): string;
+    removeChip(removedChip: SelectOption): void;
+    highlightChip(chip: SelectOption): void;
+    blurField(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteChiplistFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteChiplistFieldComponent, "crispr-autocomplete-chiplist-field", never, {}, {}, never, never, true, never>;
+}
+
+declare class MapFieldComponent extends CrisprControlComponent<MapFieldConfig> implements OnInit {
+    /**
+   * The overlay is positioned to align the top-right corner with the origin's bottom-right corner,
+   * and the top-left corner with the origin's bottom-left corner.
+   */
+    overlayPositions: ConnectionPositionPair[];
+    geoCoder: MapGeocoder;
+    renderer: Renderer2;
+    domSanitizer: DomSanitizer;
+    infoWindow: i0.Signal<MapInfoWindow>;
+    selectedMarker: i0.WritableSignal<TftMapMarker>;
+    mapOpen: i0.WritableSignal<boolean>;
+    mapComponent: i0.Signal<GoogleMap>;
+    defaultConfig: Partial<MapFieldConfig>;
+    locationControl: FormControl<string>;
+    locationGroup: FormGroup<{
+        location: FormControl<string>;
+    }>;
+    locationConfig: AutocompleteFieldConfig;
+    inputCenter: rxjs.Observable<google.maps.LatLngLiteral>;
+    center: typeof merge;
+    currentMap: BehaviorSubject<GoogleMap>;
+    displayValue: i0.Signal<string>;
+    currentMarkers: i0.Signal<TftMapMarker[]>;
+    onMapInit(event: GoogleMap): void;
+    ngOnInit(): void;
+    onMarkerClick(clickedMarker: MapMarker): void;
+    selectMarker(marker: TftMapMarker): void;
+    onBoundsChanged(bounds: google.maps.LatLngBounds): void;
+    onMove(map: GoogleMap, group: FormGroup): void;
+    onSelectLocation(suggestion: google.maps.places.AutocompletePrediction): Promise<void>;
+    openMap(): void;
+    closeMap(): void;
+    getDisplay(value: any): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MapFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MapFieldComponent, "crispr-map", never, {}, {}, never, never, true, never>;
+}
+
+type CrisprControlComponentType = InputFieldComponent | SelectFieldComponent | RadioFieldComponent | SubGroupComponent | FormGroupListComponent | AutocompleteFieldComponent | AutocompleteChiplistFieldComponent | TextareaFieldComponent | CheckboxFieldComponent | SliderFieldComponent | FileUploadFieldComponent | ImageUploadFieldComponent | DatepickerFieldComponent | UnitConversionFieldComponent | MapFieldComponent;
+type CrisprFieldComponentType = CrisprControlComponentType | HeadingComponent | DividerComponent | ButtonComponent;
+
+declare class CrisprFieldDirective implements OnInit {
+    private container;
+    private renderer;
+    private cdr;
+    config: AnyFieldConfig;
+    group: FormGroup;
+    /**
+     * value setter updates the control's value as well
+     */
+    _value: ControlValue | any[];
+    set value(value: ControlValue | any[]);
+    get value(): ControlValue | any[];
+    component: CrisprFieldComponentType;
+    constructor(container: ViewContainerRef, renderer: Renderer2, cdr: ChangeDetectorRef);
+    ngOnInit(): Promise<void>;
+    updateComponentValue(value: ControlValue): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprFieldDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CrisprFieldDirective, "[crisprField]", never, { "config": { "alias": "config"; "required": false; }; "group": { "alias": "group"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class CrisprDisplayFieldDirective implements OnInit {
+    private container;
+    private cdr;
+    group: FormGroup;
+    /**
+     * value setter updates the control's value as well
+     */
+    _value: ControlValue | any[];
+    set value(value: ControlValue | any[]);
+    get value(): ControlValue | any[];
+    private component;
+    index?: number;
+    private componentInstance;
+    constructor(container: ViewContainerRef, cdr: ChangeDetectorRef);
+    ngOnInit(): Promise<void>;
+    updateComponentValue(value: ControlValue | any[]): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprDisplayFieldDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CrisprDisplayFieldDirective, "[crisprDisplayField]", never, { "group": { "alias": "group"; "required": false; }; "value": { "alias": "value"; "required": false; }; "component": { "alias": "component"; "required": false; }; "index": { "alias": "index"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class InitialControlValuePipe implements PipeTransform {
+    transform(initialFormValue: {
+        [key: string]: ControlValue | any;
+    }, fieldConfig: AnyFieldConfig): unknown;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InitialControlValuePipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<InitialControlValuePipe, "initialControlValue", false>;
+}
+
+declare class CrisprPipesModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprPipesModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CrisprPipesModule, [typeof InitialControlValuePipe], [typeof i2.CommonModule], [typeof InitialControlValuePipe]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CrisprPipesModule>;
+}
+
+declare class SubGroupModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SubGroupModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SubGroupModule, [typeof SubGroupComponent], [typeof i2.CommonModule, typeof CrisprFieldDirective, typeof FieldContainerComponent, typeof CrisprPipesModule, typeof i6.FormValidationHandlerModule], [typeof SubGroupComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SubGroupModule>;
+}
+
+declare class CrisprFormComponent implements OnInit {
+    config: FormConfig;
+    form: FormGroup;
+    value: ControlGroupValue;
+    submitted: EventEmitter<FormGroup<any>>;
+    valueChanges: Observable<any>;
+    statusChanges: Observable<string>;
+    submitTrigger: ElementRef<HTMLButtonElement>;
+    ngOnInit(): void;
+    handleSubmit(): void;
+    triggerSubmit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprFormComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CrisprFormComponent, "crispr-form", never, { "config": { "alias": "config"; "required": false; }; "form": { "alias": "form"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "submitted": "submitted"; "valueChanges": "valueChanges"; "statusChanges": "statusChanges"; }, never, never, true, never>;
+}
+
+declare class CrisprFormsModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CrisprFormsModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CrisprFormsModule, never, [typeof i2.CommonModule, typeof _angular_forms.ReactiveFormsModule, typeof i6.FormValidationHandlerModule, typeof FormGroupListComponent, typeof FieldContainerComponent, typeof CrisprFieldDirective, typeof CrisprDisplayFieldDirective, typeof SubGroupModule, typeof CrisprPipesModule, typeof CrisprFormComponent], [typeof CrisprFormComponent, typeof FieldContainerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CrisprFormsModule>;
+}
+
+export { AbstractAutocompleteComponent, ControlType, CrisprControlComponent, CrisprDisplayFieldComponent, CrisprFieldComponent, CrisprFormComponent, CrisprFormsModule, DEFAULT_EMPTY_OPTIONS_MESSAGE, FieldContainerComponent, FileDropzoneDirective, FileUploadFieldComponent, HeadingComponent, InfoComponent, SelectedFileComponent, allowedFileExtValidator, allowedFileType, buildFormGroupFromConfig, callOptionsIfFunction, convertBytesToMb, createControlForType, filterOptionsByLabel, isControlConfig, maxFileSizeValidator, observablifyOptions, valueIn };
+export type { AbstractAutocompleteFieldConfig, AbstractGroupConfig, AbstractUploadComponent, AnyFieldConfig, AutocompleteChiplistFieldConfig, AutocompleteFieldConfig, AutocompleteOptionsCallback, ButtonConfig, ButtonType, CheckboxFieldConfig, ControlGroupValue, ControlValue, CrisprControlConfig, CrisprFieldConfig, DatepickerFieldConfig, DividerConfig, EnabledUploadButtonConfig, FieldDescriptors, FileUploadFieldConfig, FormConfig, FormGroupListConfig, HeadingConfig, ImageUploadFieldConfig, Info, InputFieldConfig, MapFieldConfig, MatFieldProperties, OptionsCallback, OptionsType, RadioFieldConfig, ReactiveOptionsCallback, SelectFieldConfig, SelectOption, SliderFieldConfig, SubGroupConfig, TemplateBuilder, TextareaFieldConfig, TftMapMarker, UnitConversionFieldConfig };