import { Component, ContentChild, Pipe, Directive } from '@angular/core';
import { NgControl } from '@angular/forms';
import { IgxInputDirective } from '../input-group/public_api';
import { IgxInputGroupComponent } from '../input-group/input-group.component';
import { IgxInputGroupBase } from '../input-group/input-group.common';
import { DateTimeUtil } from '../date-common/util/date-time.util';
import { IgxDateTimeEditorDirective } from '../directives/date-time-editor/public_api';
import { isDate } from '../core/utils';
import { IgxIconComponent } from '../icon/icon.component';
import { IgxSuffixDirective } from '../directives/suffix/suffix.directive';
import { IgxButtonDirective } from '../directives/button/button.directive';
import { IgxPrefixDirective } from '../directives/prefix/prefix.directive';
import { NgIf, NgTemplateOutlet, NgClass, NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common';
import * as i0 from "@angular/core";
/** @hidden @internal */
export class DateRangePickerFormatPipe {
    transform(values, appliedFormat, locale, formatter) {
        if (!values || !values.start && !values.end) {
            return '';
        }
        if (formatter) {
            return formatter(values);
        }
        let { start, end } = values;
        if (!isDate(start)) {
            start = DateTimeUtil.parseIsoDate(start);
        }
        if (!isDate(end)) {
            end = DateTimeUtil.parseIsoDate(end);
        }
        const startDate = appliedFormat ? DateTimeUtil.formatDate(start, appliedFormat, locale || 'en') : start?.toLocaleDateString();
        const endDate = appliedFormat ? DateTimeUtil.formatDate(end, appliedFormat, locale || 'en') : end?.toLocaleDateString();
        let formatted;
        if (start) {
            formatted = `${startDate} - `;
            if (end) {
                formatted += endDate;
            }
        }
        return formatted ? formatted : '';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: DateRangePickerFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.2", ngImport: i0, type: DateRangePickerFormatPipe, isStandalone: true, name: "dateRange" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: DateRangePickerFormatPipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'dateRange',
                    standalone: true
                }]
        }] });
/** @hidden @internal */
export class IgxDateRangeInputsBaseComponent extends IgxInputGroupComponent {
    /** @hidden @internal */
    get nativeElement() {
        return this.element.nativeElement;
    }
    /** @hidden @internal */
    setFocus() {
        this.input.focus();
    }
    /** @hidden @internal */
    updateInputValue(value) {
        if (this.ngControl) {
            this.ngControl.control.setValue(value);
        }
        else {
            this.dateTimeEditor.value = value;
        }
    }
    /** @hidden @internal */
    updateInputValidity(state) {
        this.inputDirective.valid = state;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeInputsBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.2", type: IgxDateRangeInputsBaseComponent, isStandalone: true, selector: "igx-date-range-base", providers: [{ provide: IgxInputGroupBase, useExisting: IgxDateRangeInputsBaseComponent }], queries: [{ propertyName: "dateTimeEditor", first: true, predicate: IgxDateTimeEditorDirective, descendants: true }, { propertyName: "inputDirective", first: true, predicate: IgxInputDirective, descendants: true }, { propertyName: "ngControl", first: true, predicate: NgControl, descendants: true }], usesInheritance: true, ngImport: i0, template: ``, isInline: true }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeInputsBaseComponent, decorators: [{
            type: Component,
            args: [{
                    template: ``,
                    selector: `igx-date-range-base`,
                    providers: [{ provide: IgxInputGroupBase, useExisting: IgxDateRangeInputsBaseComponent }],
                    standalone: true
                }]
        }], propDecorators: { dateTimeEditor: [{
                type: ContentChild,
                args: [IgxDateTimeEditorDirective]
            }], inputDirective: [{
                type: ContentChild,
                args: [IgxInputDirective]
            }], ngControl: [{
                type: ContentChild,
                args: [NgControl]
            }] } });
/**
 * Defines the start input for a date range picker
 *
 * @igxModule IgxDateRangePickerModule
 *
 * @igxTheme igx-input-group-theme, igx-calendar-theme, igx-date-range-picker-theme
 *
 * @igxKeywords date, range, date range, date picker
 *
 * @igxGroup scheduling
 *
 * @remarks
 * When templating, start input has to be templated separately
 *
 * @example
 * ```html
 * <igx-date-range-picker mode="dropdown">
 *      <igx-date-range-start>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-start>
 *      ...
 * </igx-date-range-picker>
 * ```
 */
export class IgxDateRangeStartComponent extends IgxDateRangeInputsBaseComponent {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeStartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.2", type: IgxDateRangeStartComponent, isStandalone: true, selector: "igx-date-range-start", providers: [
            { provide: IgxInputGroupBase, useExisting: IgxDateRangeStartComponent },
            { provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeStartComponent }
        ], usesInheritance: true, ngImport: i0, template: "<div class=\"igx-input-group__wrapper\" *ngIf=\"isTypeBox; else bundle\">\n    <ng-container *ngTemplateOutlet=\"bundle\"></ng-container>\n</div>\n\n<div class=\"igx-input-group__hint\" (click)=\"hintClickHandler($event)\">\n    <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n</div>\n\n<ng-template #label>\n    <ng-content select=\"[igxLabel]\"></ng-content>\n</ng-template>\n\n<ng-template #input>\n    <ng-content select=\"[igxInput]\"></ng-content>\n</ng-template>\n\n<ng-template #prefix>\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #uploadButton>\n    <igx-prefix *ngIf=\"isFileType\" class=\"igx-input-group__upload-button\">\n        <button\n            igxButton=\"raised\"\n            type=\"button\"\n            (click)=\"uploadButtonHandler()\"\n            [displayDensity]=\"displayDensity\"\n            [disabled]=\"disabled\"\n            [ngClass]=\"{ 'igx-input-group__upload-button': isTypeLine }\"\n        >\n            {{ resourceStrings.igx_input_upload_button }}\n        </button>\n    </igx-prefix>\n</ng-template>\n\n<ng-template #files>\n    <div\n        *ngIf=\"isFileType\"\n        class=\"igx-input-group__file-input\"\n        [title]=\"fileNames\"\n    >\n        <span>{{ fileNames }}</span>\n    </div>\n</ng-template>\n\n<ng-template #clear>\n    <igx-suffix\n        class=\"igx-input-group__clear-icon\"\n        *ngIf=\"isFileType && isFilled\"\n        (click)=\"clearValueHandler()\"\n        (keydown.Enter)=\"clearValueHandler()\"\n        title=\"clear files\"\n        tabindex=\"0\"\n    >\n        <igx-icon>clear</igx-icon>\n    </igx-suffix>\n</ng-template>\n\n<ng-template #suffix>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #materialBundle>\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container>\n            <div class=\"igx-input-group__notch\">\n                <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n            </div>\n        </ng-container>\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__filler\"></div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #fluentBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #bootstrapBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #bundle>\n    <ng-container [ngSwitch]=\"theme\">\n        <ng-container *ngSwitchCase=\"'bootstrap'\">\n            <ng-container *ngTemplateOutlet=\"bootstrapBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'fluent'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'indigo-design'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"materialBundle\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix],[igxStart]" }, { kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxButtonColor", "igxButtonBackground", "igxLabel", "disabled"], outputs: ["buttonClick", "buttonSelected"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix],[igxEnd]" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["family", "active", "name"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeStartComponent, decorators: [{
            type: Component,
            args: [{ selector: 'igx-date-range-start', providers: [
                        { provide: IgxInputGroupBase, useExisting: IgxDateRangeStartComponent },
                        { provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeStartComponent }
                    ], standalone: true, imports: [NgIf, NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent, NgSwitch, NgSwitchCase, NgSwitchDefault], template: "<div class=\"igx-input-group__wrapper\" *ngIf=\"isTypeBox; else bundle\">\n    <ng-container *ngTemplateOutlet=\"bundle\"></ng-container>\n</div>\n\n<div class=\"igx-input-group__hint\" (click)=\"hintClickHandler($event)\">\n    <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n</div>\n\n<ng-template #label>\n    <ng-content select=\"[igxLabel]\"></ng-content>\n</ng-template>\n\n<ng-template #input>\n    <ng-content select=\"[igxInput]\"></ng-content>\n</ng-template>\n\n<ng-template #prefix>\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #uploadButton>\n    <igx-prefix *ngIf=\"isFileType\" class=\"igx-input-group__upload-button\">\n        <button\n            igxButton=\"raised\"\n            type=\"button\"\n            (click)=\"uploadButtonHandler()\"\n            [displayDensity]=\"displayDensity\"\n            [disabled]=\"disabled\"\n            [ngClass]=\"{ 'igx-input-group__upload-button': isTypeLine }\"\n        >\n            {{ resourceStrings.igx_input_upload_button }}\n        </button>\n    </igx-prefix>\n</ng-template>\n\n<ng-template #files>\n    <div\n        *ngIf=\"isFileType\"\n        class=\"igx-input-group__file-input\"\n        [title]=\"fileNames\"\n    >\n        <span>{{ fileNames }}</span>\n    </div>\n</ng-template>\n\n<ng-template #clear>\n    <igx-suffix\n        class=\"igx-input-group__clear-icon\"\n        *ngIf=\"isFileType && isFilled\"\n        (click)=\"clearValueHandler()\"\n        (keydown.Enter)=\"clearValueHandler()\"\n        title=\"clear files\"\n        tabindex=\"0\"\n    >\n        <igx-icon>clear</igx-icon>\n    </igx-suffix>\n</ng-template>\n\n<ng-template #suffix>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #materialBundle>\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container>\n            <div class=\"igx-input-group__notch\">\n                <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n            </div>\n        </ng-container>\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__filler\"></div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #fluentBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #bootstrapBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #bundle>\n    <ng-container [ngSwitch]=\"theme\">\n        <ng-container *ngSwitchCase=\"'bootstrap'\">\n            <ng-container *ngTemplateOutlet=\"bootstrapBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'fluent'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'indigo-design'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"materialBundle\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n" }]
        }] });
/**
 * Defines the end input for a date range picker
 *
 * @igxModule IgxDateRangePickerModule
 *
 * @igxTheme igx-input-group-theme, igx-calendar-theme, igx-date-range-picker-theme
 *
 * @igxKeywords date, range, date range, date picker
 *
 * @igxGroup scheduling
 *
 * @remarks
 * When templating, end input has to be template separately
 *
 * @example
 * ```html
 * <igx-date-range-picker mode="dropdown">
 *      ...
 *      <igx-date-range-end>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-end>
 * </igx-date-range-picker>
 * ```
 */
export class IgxDateRangeEndComponent extends IgxDateRangeInputsBaseComponent {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeEndComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.2", type: IgxDateRangeEndComponent, isStandalone: true, selector: "igx-date-range-end", providers: [
            { provide: IgxInputGroupBase, useExisting: IgxDateRangeEndComponent },
            { provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeEndComponent }
        ], usesInheritance: true, ngImport: i0, template: "<div class=\"igx-input-group__wrapper\" *ngIf=\"isTypeBox; else bundle\">\n    <ng-container *ngTemplateOutlet=\"bundle\"></ng-container>\n</div>\n\n<div class=\"igx-input-group__hint\" (click)=\"hintClickHandler($event)\">\n    <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n</div>\n\n<ng-template #label>\n    <ng-content select=\"[igxLabel]\"></ng-content>\n</ng-template>\n\n<ng-template #input>\n    <ng-content select=\"[igxInput]\"></ng-content>\n</ng-template>\n\n<ng-template #prefix>\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #uploadButton>\n    <igx-prefix *ngIf=\"isFileType\" class=\"igx-input-group__upload-button\">\n        <button\n            igxButton=\"raised\"\n            type=\"button\"\n            (click)=\"uploadButtonHandler()\"\n            [displayDensity]=\"displayDensity\"\n            [disabled]=\"disabled\"\n            [ngClass]=\"{ 'igx-input-group__upload-button': isTypeLine }\"\n        >\n            {{ resourceStrings.igx_input_upload_button }}\n        </button>\n    </igx-prefix>\n</ng-template>\n\n<ng-template #files>\n    <div\n        *ngIf=\"isFileType\"\n        class=\"igx-input-group__file-input\"\n        [title]=\"fileNames\"\n    >\n        <span>{{ fileNames }}</span>\n    </div>\n</ng-template>\n\n<ng-template #clear>\n    <igx-suffix\n        class=\"igx-input-group__clear-icon\"\n        *ngIf=\"isFileType && isFilled\"\n        (click)=\"clearValueHandler()\"\n        (keydown.Enter)=\"clearValueHandler()\"\n        title=\"clear files\"\n        tabindex=\"0\"\n    >\n        <igx-icon>clear</igx-icon>\n    </igx-suffix>\n</ng-template>\n\n<ng-template #suffix>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #materialBundle>\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container>\n            <div class=\"igx-input-group__notch\">\n                <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n            </div>\n        </ng-container>\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__filler\"></div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #fluentBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #bootstrapBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #bundle>\n    <ng-container [ngSwitch]=\"theme\">\n        <ng-container *ngSwitchCase=\"'bootstrap'\">\n            <ng-container *ngTemplateOutlet=\"bootstrapBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'fluent'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'indigo-design'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"materialBundle\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix],[igxStart]" }, { kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxButtonColor", "igxButtonBackground", "igxLabel", "disabled"], outputs: ["buttonClick", "buttonSelected"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix],[igxEnd]" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["family", "active", "name"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeEndComponent, decorators: [{
            type: Component,
            args: [{ selector: 'igx-date-range-end', providers: [
                        { provide: IgxInputGroupBase, useExisting: IgxDateRangeEndComponent },
                        { provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeEndComponent }
                    ], standalone: true, imports: [NgIf, NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent, NgSwitch, NgSwitchCase, NgSwitchDefault], template: "<div class=\"igx-input-group__wrapper\" *ngIf=\"isTypeBox; else bundle\">\n    <ng-container *ngTemplateOutlet=\"bundle\"></ng-container>\n</div>\n\n<div class=\"igx-input-group__hint\" (click)=\"hintClickHandler($event)\">\n    <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n</div>\n\n<ng-template #label>\n    <ng-content select=\"[igxLabel]\"></ng-content>\n</ng-template>\n\n<ng-template #input>\n    <ng-content select=\"[igxInput]\"></ng-content>\n</ng-template>\n\n<ng-template #prefix>\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #uploadButton>\n    <igx-prefix *ngIf=\"isFileType\" class=\"igx-input-group__upload-button\">\n        <button\n            igxButton=\"raised\"\n            type=\"button\"\n            (click)=\"uploadButtonHandler()\"\n            [displayDensity]=\"displayDensity\"\n            [disabled]=\"disabled\"\n            [ngClass]=\"{ 'igx-input-group__upload-button': isTypeLine }\"\n        >\n            {{ resourceStrings.igx_input_upload_button }}\n        </button>\n    </igx-prefix>\n</ng-template>\n\n<ng-template #files>\n    <div\n        *ngIf=\"isFileType\"\n        class=\"igx-input-group__file-input\"\n        [title]=\"fileNames\"\n    >\n        <span>{{ fileNames }}</span>\n    </div>\n</ng-template>\n\n<ng-template #clear>\n    <igx-suffix\n        class=\"igx-input-group__clear-icon\"\n        *ngIf=\"isFileType && isFilled\"\n        (click)=\"clearValueHandler()\"\n        (keydown.Enter)=\"clearValueHandler()\"\n        title=\"clear files\"\n        tabindex=\"0\"\n    >\n        <igx-icon>clear</igx-icon>\n    </igx-suffix>\n</ng-template>\n\n<ng-template #suffix>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #materialBundle>\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container>\n            <div class=\"igx-input-group__notch\">\n                <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n            </div>\n        </ng-container>\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__filler\"></div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #fluentBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n\n        <div class=\"igx-input-group__bundle-main\">\n            <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n\n        <div class=\"igx-input-group__line\" *ngIf=\"hasBorder\"></div>\n    </div>\n</ng-template>\n\n<ng-template #bootstrapBundle>\n    <ng-container *ngTemplateOutlet=\"label\"></ng-container>\n\n    <div class=\"igx-input-group__bundle\">\n        <div class=\"igx-input-group__bundle-start\">\n            <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"uploadButton\"></ng-container>\n        </div>\n\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"files\"></ng-container>\n\n        <div class=\"igx-input-group__bundle-end\">\n            <ng-container *ngTemplateOutlet=\"clear\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #bundle>\n    <ng-container [ngSwitch]=\"theme\">\n        <ng-container *ngSwitchCase=\"'bootstrap'\">\n            <ng-container *ngTemplateOutlet=\"bootstrapBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'fluent'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'indigo-design'\">\n            <ng-container *ngTemplateOutlet=\"fluentBundle\"></ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"materialBundle\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n" }]
        }] });
/**
 * Replaces the default separator `to` with the provided value
 *
 * @igxModule IgxDateRangePickerModule
 *
 * @igxTheme igx-date-range-picker-theme
 *
 * @igxKeywords date, range, date range, date picker
 *
 * @igxGroup scheduling
 *
 * @example
 * ```html
 * <igx-date-range-picker>
 *      <igx-date-range-start>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-start>
 *
 *      <ng-template igxDateRangeSeparator>-</ng-template>
 *
 *      <igx-date-range-end>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-end>
 *      ...
 * </igx-date-range-picker>
 * ```
 */
export class IgxDateRangeSeparatorDirective {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeSeparatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.2", type: IgxDateRangeSeparatorDirective, isStandalone: true, selector: "[igxDateRangeSeparator]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.2", ngImport: i0, type: IgxDateRangeSeparatorDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[igxDateRangeSeparator]',
                    standalone: true
                }]
        }] });
//# sourceMappingURL=data:application/json;base64, 