abadi199/datetimepicker/3.0.4

NOTE: this package is not compatible with Elm 0.19.1

DateTimePicker.Config

DateTimePicker configuration

Configuration

type alias Config otherConfig msg =
{ otherConfig
| onChange : State -> Maybe Date -> msg
, autoClose : Bool
, i18n : I18n
}

Configuration

* onChange is the message for when the selected value and internal State in the date picker has changed. * autoClose is a flag to indicate whether the dialog should be automatically closed when a date and/or time is selected. * i18n is internationalization configuration.

type alias I18n =
{ titleFormatter : Date -> String
, footerFormatter : Date -> String
, timeTitleFormatter : Date -> String
, inputFormat : InputFormat
}

Internationalization configuration

* footerFormatter is a Date to string formatter used to display the date in the footer section. * titleFormatter is a Date to string formatter used to display the date in the title section. * timeTitleFormatter is a Date to string formatter used to display the time in the title section. * inputFormat is an input date formatter and parser.

type alias InputFormat =
{ inputFormatter : Date -> String
, inputParser : String -> Maybe Date
}

Input formatter and parser

  • inputFormatter is a Date to string formatter used to display the date in the input text
  • inputParser is a String to Date parser used to parsed input text into Date
type alias DatePickerConfig otherConfig =
{ otherConfig
| nameOfDays : NameOfDays
, firstDayOfWeek : Day
, allowYearNavigation : Bool
}

Configuration for the DatePicker

* nameOfDays is the configuration for name of days in a week. * firstDayOfWeek is the first day of the week. * titleFormatter is the Date to String formatter for the dialog's title. * footerFormatter is the Date to String formatter for the dialog's footer. * allowYearNavigation show/hide year navigation button.

type alias TimePickerConfig =
{ timePickerType : TimePickerType }

Configuration for TimePicker

* timePickerType is the type of the time picker, either Analog or Digital

type alias NameOfDays =
{ sunday : String
, monday : String
, tuesday : String
, wednesday : String
, thursday : String
, friday : String
, saturday : String
}

Configuration for name of days in a week.

This will be displayed as the calendar's header. Default: * sunday = "Su" * monday = "Mo" * tuesday = "Tu" * wednesday = "We" * thursday = "Th" * friday = "Fr" * saturday = "Sa"

= Digital
| Analog

The type of time picker, can be either Digital or Analog

type Type msg
= DateType (Config (DatePickerConfig {}) msg)
| DateTimeType (Config (DatePickerConfig TimePickerConfig) msg)
| TimeType (Config TimePickerConfig msg)

The type of picker (for Internal Use)

Default Configuration

defaultDatePickerConfig : (State -> Maybe Date -> msg) -> Config (DatePickerConfig {}) msg

Default configuration for DatePicker

* onChange No Default * autoClose Default: True * nameOfDays see NameOfDays for the default values. * firstDayOfWeek Default: Sunday. * allowYearNavigation Default : True

defaultTimePickerConfig : (State -> Maybe Date -> msg) -> Config TimePickerConfig msg

Default configuration for TimePicker * onChange No Default * dateFormatter Default: "%m/%d/%Y" * dateTimeFormatter Default: "%m/%d/%Y %I:%M %p" * autoClose Default: False * timeFormatter Default: "%I:%M %p" * timePickerType Default: Analog

(State -> Maybe Date -> msg)
-> Config (DatePickerConfig TimePickerConfig) msg

Default configuration for DateTimePicker

* onChange No Default * dateFormatter Default: "%m/%d/%Y" * dateTimeFormatter Default: "%m/%d/%Y %I:%M %p" * autoClose Default: False * nameOfDays see NameOfDays for the default values. * firstDayOfWeek Default: Sunday. * titleFormatter Default: "%B %Y" * fullDateFormatter Default: "%A, %B %d, %Y" * timeFormatter Default: "%I:%M %p" * timePickerType Default: Analog * allowYearNavigation Default : True

Default Date internationalization

* titleFormatter Default: "%B %Y" * footerFormatter Default: "%A, %B %d, %Y" * inputFormat Default: "%m/%d/%Y"

Default Time internationalization

* titleFormatter Default: "%B %Y" * footerFormatter Default: "%A, %B %d, %Y" * inputFormat Default: "%I:%M %p"

Default Date and Time internationalization

* titleFormatter Default: "%B %Y" * footerFormatter Default: "%A, %B %d, %Y" * inputFormat Default: "%m/%d/%Y %I:%M %p"

Default input format for date picker

Default input format for date and time picker