aps-datepicker

APS Angular Datepicker Component

This is a reusable Angular component for a datepicker input. This component uses the Angular Material datepicker.

Inputs

• minDate: Date | undefined: The minimum date that the user can select.
• maxDate: Date | undefined: The maximum date that the user can select.
• placeholder: string: The placeholder for the input field. Default is an empty string.
• value: any: The initial value of the input field. This can be any value that is compatible with the Angular Material datepicker.
• isDisabled: boolean: A boolean to determine whether the datepicker is disabled. Default is false.
• dataCy: string: A string that can be used for Cypress testing. Default is an empty string.

Outputs

• dateChange: EventEmitter<any>: Event emitter for the dateChange event. This emits when the selected date is changed.
• dateInput: EventEmitter<any>: Event emitter for the dateInput event. This emits when the input is changed.

How to Use

Import the ApsDatepickerComponent into your Angular module.

import { ApsDatepickerComponent } from 'path-to-component';

Include it in your module declarations:

@NgModule({
  declarations: [
    ApsDatepickerComponent,
    // other components...
  ],
})
export class YourModule {}

Then, in your Angular template, you can use the aps-datepicker component like this:

<form [formGroup]="yourForm">
  <aps-datepicker
    formControlName="yourFormControlName"
    [minDate]="yourMinDateValue"
    [maxDate]="yourMaxDateValue"
    [placeholder]="'Your placeholder'"
    [isDisabled]="false"
    [dataCy]="'yourDataCy'"
    (dateChange)="yourDateChangeHandler($event)"
    (dateInput)="yourDateInputHandler($event)">
  </aps-datepicker>
</form>

Replace the your... parts with your own variables and functions.

README is created by ChatGpt