paperless-ngx/src-ui/src/app/components/common/input/date/date.component.html

<div class="mb-3">
  <label class="form-label" [for]="inputId">{{title}}</label>
  <div class="input-group" [class.is-invalid]="error">
    <input class="form-control" [class.is-invalid]="error" [placeholder]="placeholder" [id]="inputId" maxlength="10"
          (dateSelect)="onChange(value)" (change)="onChange(value)" (keypress)="onKeyPress($event)" (paste)="onPaste($event)"
          name="dp" [(ngModel)]="value" ngbDatepicker #datePicker="ngbDatepicker" #datePickerContent="ngModel" [disabled]="disabled">
    <button class="btn btn-outline-secondary calendar" (click)="datePicker.toggle()" type="button" [disabled]="disabled">
      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-calendar" viewBox="0 0 16 16">
        <path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
      </svg>
    </button>
    <button *ngIf="showFilter" class="btn btn-outline-secondary" type="button" (click)="onFilterDocuments()" [disabled]="this.value === null" i18n-title title="Filter documents with this {{title}}">
      <svg class="buttonicon" fill="currentColor">
        <use xlink:href="assets/bootstrap-icons.svg#filter" />
      </svg>
    </button>
  </div>
  <div class="invalid-feedback" i18n>Invalid date.</div>
  <small *ngIf="hint" class="form-text text-muted">{{hint}}</small>
  <small *ngIf="getSuggestions().length > 0">
    <span i18n>Suggestions:</span>&nbsp;
    <ng-container *ngFor="let s of getSuggestions()">
      <a (click)="onSuggestionClick(s)" [routerLink]="[]">{{s}}</a>&nbsp;
    </ng-container>
  </small>
</div>