Ask a user for a birthday

const [birthdate, setBirthdate] = useState<Date | undefined>(undefined);

<GoabxFormItem label="What is your date of birth?">
      <GoabxDatePicker
        name="birthdate"
        type="input"
        value={birthdate}
        onChange={(e) => setBirthdate(e.value)}
      />
    </GoabxFormItem>

birthdate: Date | undefined;

  onDateChange(event: { value: Date }) {
    this.birthdate = event.value;
  }

<goabx-form-item label="What is your date of birth?">
  <goabx-date-picker
    name="birthdate"
    type="input"
    [value]="birthdate"
    (onChange)="onDateChange($event)">
  </goabx-date-picker>
</goabx-form-item>

const datePicker = document.getElementById("birthdate");
datePicker.addEventListener("_change", (e) => {
  console.log("Selected date:", e.detail.value);
});

<goa-form-item version="2" label="What is your date of birth?">
  <goa-date-picker version="2" name="birthdate" type="input" id="birthdate"></goa-date-picker>
</goa-form-item>