DatePicker

A calendar beside the native date input, for ranges, refused days and notes on days.

framework/ui ↗

Live

Your stay

Full nights cannot be booked.

Previous yearPrevious monthNovember 2026Next monthNext year
SunMonTueWedThuFriSat

Example

// One config for the page and the month endpoint, so both agree on the days.
func stay(r *http.Request) ui.DatePickerConfig {
    return ui.DatePickerConfig{
        ID: "stay", Label: "Your stay", Endpoint: "/book/month",
        Range: &ui.DatePickerRange{StartName: "check_in", EndName: "check_out"},
        Month: r.URL.Query().Get("month"), Today: today(r), Min: today(r),
        Days:  map[string]ui.DatePickerDay{"2026-11-13": {Disabled: true, Note: "Full"}},
        Ctx:   r.Context(),
    }
}
// Page: ui.DatePicker(stay(r)) inside the booking form.
// GET /book/month: w.Write([]byte(ui.DatePickerMonth(stay(r))))