import { ChangeDetectorRef, EventEmitter, OnDestroy, OnInit } from '@angular/core'; import { AbstractControl, FormControl, FormGroup } from '@angular/forms'; import { TsStyleThemeTypes } from '@terminus/ui/utilities'; import { BehaviorSubject } from 'rxjs'; /** * Define the structure of the date range object used by {@link TsDateRangeComponent} */ export interface TsDateRange { /** * The start date of the range */ start: Date | undefined; /** * The end date of the range */ end: Date | undefined; } /** * This is the date-range UI Component * * @example * * * https://getterminus.github.io/ui-demos-release/components/date-range */ export declare class TsDateRangeComponent implements OnInit, OnDestroy { private changeDetectorRef; /** * Getter to return the date range as an object * * @returns The current date range */ private get dateRange(); /** * Provide quick access to the endDate form control */ get endDateControl(): AbstractControl; /** * Expose the minimum date for the endDate * * NOTE: `any` is used since we cannot seem to use union types in a BehaviorSubject and the value could be a Date or undefined */ endMinDate$: BehaviorSubject; /** * Define the end date label */ endLabel: string; /** * The internal FormControl to manage the end date */ internalEndControl: FormControl; /** * The internal FormControl to manage the start date */ internalStartControl: FormControl; /** * Define the separator between the two date inputs */ separator: string; /** * Provide quick access to the startDate form control */ get startDateControl(): AbstractControl; /** * Expose the maximum date for the startDate * * NOTE: `any` is used since we cannot seem to use union types in a BehaviorSubject and the value could be a Date or undefined */ startMaxDate$: BehaviorSubject; /** * Define the start date label */ startLabel: string; /** * Define the form group to attach the date range to * * @param value */ set dateFormGroup(value: FormGroup | AbstractControl | undefined); get dateFormGroup(): FormGroup | AbstractControl | undefined; private _dateFormGroup; /** * Define the date locale */ dateLocale: string | undefined; /** * Define the max date for the end date */ endMaxDate: Date | undefined; /** * Define the min date for the end date */ endMinDate: Date | undefined; /** * Define if the range should be disabled */ isDisabled: boolean; /** * Define the starting view for both datepickers */ startingView: 'month' | 'year'; /** * Define the max date for the starting date */ startMaxDate: Date | undefined; /** * Define the min date for the starting date */ startMinDate: Date | undefined; /** * Define the component theme */ theme: TsStyleThemeTypes; /** * Event emitted anytime the range is changed */ readonly dateRangeChange: EventEmitter; /** * Output the end date when selected */ readonly endSelected: EventEmitter; /** * Output the start date when selected */ readonly startSelected: EventEmitter; constructor(changeDetectorRef: ChangeDetectorRef); /** * Seed initial date range values */ ngOnInit(): void; /** * Needed for untilComponentDestroyed */ ngOnDestroy(): void; /** * Set up subscriptions to sync the internal FormControl to the external FormControl */ private setUpFormControlSync; /** * Set up initial min and max dates * * @param formGroup - The date form group */ private initializeMinAndMax; /** * Emit the selected start date and date range * * @param date */ startDateSelected(date: Date): void; /** * Emit the selected end date and date range * * @param date */ endDateSelected(date: Date): void; /** * Update dates when the start date input receives a blur event * * @param date - The date entered */ startBlur(date: Date | undefined): void; /** * Update dates when the end date input receives a blur event * * @param date - The date entered */ endBlur(date: Date | undefined): void; }