An opaque type representing messages that are passed inside the DatePicker.

A record which represents the main datepicker model

The subscriptions for the datepicker

Sub.map DatePickerMsgs <|
    DateRangePicker.subscriptions model.datePicker

The view for the datepicker. You will have to pass in the current time as well as the local zone and the datepicker model.

DateRangePicker.view datePicker

The update for the datepicker. You will need to integrate this into your own update.

DatePickerMsgs msg_ ->
    let
        ( newDateRangePicker, dateRangePickerCmd ) =
            DateRangePicker.update msg_ model.datePicker
    in
    ( { model | datePicker = newDateRangePicker }, Cmd.map DatePickerMsgs dateRangePickerCmd )

The open date picker msg so you can open the date picker with a custom event

A helper attribute which allows you to open the datepicker using any html element.

The element you place this attribute on has to have an id so that the datepicker can dynamically be placed.


Html.map DatePickerMsgs <| button [Html.Attribute.id openerId, open openerId ] [ text "Open Me!" ]

You will need to call convert the message to the appropriate type via Html.map

A pre-made opener that can be used to open the datepicker instead of @open.

It will need an id so that the datepicker can dynamically be placed.


Html.map DatePickerMsgs <| defaultOpener model.datePicker openerId

You will need to call convert the message to the appropriate type via Html.map

The type which represents what the current selection is in the datepicker.

If you select a preset you can use @presetToPartsRange to get the appropriate posix range for the selection.

The type which specifies if a user had specified a time in the input box as well as the selected date.

The type of that represents a range of two posix times.

Holds the beginning and end of the selection

Get the current selection in local time.

A convenience function to get the current selection as a parts range in local time.

A record which specifies config options which can be set when initializes the datepicker

A record that can be used if a language other than english is wanted.

The type of that represents the current visibility of the date picker

Represents if times should be displayed in 24 hours or 12 hour format

The default english language

Represents if a single date or a range of dates should be selected.

The type of that represents available presets that can be put in a preset menu.

There are a couple premade presets, but you can create a CustomPreset of your own as well.

The type of interval for a custom preset

A record that represents a user created custom preset

A custom preset represents how to select a range of posix given today's date.

The type which specifies what size calendar you want to display

A default config which can be combined with @initWithOptions so that you only need to specify the fields which you want to customize

Initialize the datepicker with the default settings

Change the datePicker's current config. This will reset changed state.

A helper function to change the calendar type on an existing model. Usually you should use @initWithOptions and configure this at initialization.

Gets the current presets

Set whether or not the datepicker is open. Usually you should use @open or @defaultOpener to manage this.

Sets the datepicker's selection outside of the ui. Normally the ui should have all the interactions you would want.

Gets the current languageConfig

A helper function to set a preset outside of the default preset ui

Gets the current selection format

Checks if the datepicker is open

Change the datePicker's current config. This will reset changed state.

sets the current selection format

conversion from partsrnage to posix range

A helper function to get the display value for a given preset

Check if the selection has changed.

Check if the selection has changed.

Converts a preset to a selectable value

A helper function to display the selection in the same way that the datepicker does

A helper function to display the selection in the same way that the datepicker does. It is in utc time.

The defaults for the preset buttons

focuses the inputbox

Gets the current languageConfig

Sets all of the time parts to their logical end except for milliseconds

sets all of the timne parts to 0