@if (!inline) {
    <div [class]="containerClass">
        <label [for]="inputId">{{ label }}</label>
        @if (isRequired()) {
            <span class="required-star">*</span>
        }

        <p-datepicker
            [id]="inputId"
            [formControl]="control"
            [placeholder]="showPlaceholder ? placeholder : ''"
            [disabled]="disabled"
            [class]="inputClass || ''"
            [showTime]="showTime"
            [timeOnly]="timeOnly"
            [showButtonBar]="showButtonBar"
            [showIcon]="showIcon"
            [dateFormat]="dateFormat"
            [minDate]="minDate"
            [maxDate]="maxDate"
            [disabledDates]="disabledDates"
            [disabledDays]="disabledDays"
            [selectionMode]="selectionMode ? selectionMode : undefined"
            showIcon
        ></p-datepicker>
    </div>
}

@if (inline) {
    <div [class]="containerClass">
        <label [for]="inputId" class="inline-calendar-label">{{ label }}</label>
        <p-datepicker
            [id]="inputId"
            [formControl]="control"
            [disabled]="disabled"
            [class]="inputClass || ''"
            [showTime]="showTime"
            [timeOnly]="timeOnly"
            [showButtonBar]="showButtonBar"
            [dateFormat]="dateFormat"
            [minDate]="minDate"
            [maxDate]="maxDate"
            [disabledDates]="disabledDates"
            [disabledDays]="disabledDays"
            [selectionMode]="selectionMode ? selectionMode : undefined"
            showIcon
        ></p-datepicker>
    </div>
}

@if (control.invalid && (control.dirty || control.touched)) {
    <div class="error-messages">
        @for (error of getErrorMessages(); track error) {
            <small class="p-error block">
                {{ error }}
            </small>
        }
    </div>
}