import { Directive, ElementRef, HostListener, Input } from '@angular/core';

@Directive({
    selector: '[kitAppCustomDateFormat]',
    standalone: true
})
export class CustomDateFormatDirective {
    @Input() monthOnly: boolean = false;

    constructor(private elRef: ElementRef) { }

    @HostListener('input', ['$event']) onInputChange(event: KeyboardEvent): void {
        const input = event.target as HTMLInputElement;
        let value = input.value;
        value = value.replace(/[^0-9]/g, '');

        if (this.monthOnly) {
            value = value.slice(0, 6);
            value = value.replace(/(\d{2})(\d)/, '$1/$2');
        } else {
            value = value.slice(0, 8);
            value = value.replace(/(\d{2})(\d)/, '$1/$2').replace(/(\d{2})(\d)/, '$1/$2');
        }

        input.value = value;
    }
}