{"version":3,"file":"NcDateTimePicker-CK4rhfEB.mjs","sources":["../../src/components/NcDateTimePicker/NcDateTimePicker.vue"],"sourcesContent":["\n\n\nIn general it is recommended to use the native date picker (see `NcDateTimePickerNative` which is based on ``).\nBut some use cases are not covered by the native date selector, like selecting ranges or selecting a timezone.\nFor those cases this component can be used.\n\n### General examples\n```vue\n\n\t
\n\t\t\n\t\t\n\t\t{{ time }}\n\t
\n\n\n\n```\n\n### Example with confirm button\n\nBy default the date is applied as soon as you select the day in the calendar.\nSometimes - especially when selecting date and time - it is required to only emit the selected date when the flow is finished.\nFor this the `confirm` prop can be used, this will add a confirmation button to the selector.\n\n```vue\n\n\t\n\t\t\n\t\t{{ time }}\n\t\n\n\n```\n\n### Range picker\n\nThe most common use case for the `NcDateTimePicker` is picking a range, as this is not supported by the native date picker.\n\nWhen selecting the range picker type, the model value type will change from `Date` to `[Date, Date]`.\nMeaning an array with two dates is used, the first date is the range start and the second date is the range end.\n\n```vue\n\n\t
\n\t\t\n\n\t\t\n\t\t
\n\t\t\t
Start: {{ formatDate(time[0]) }}
\n\t\t\t
End: {{ formatDate(time[1]) }}
\n\t\t
\n\t
\n\n\n\n\n```\n\n### Time zone aware date picker\n\nThe datepicker can optionally include a picker for the preferred time zone. The selected time does not factor in the\npicked time zone, but you will have to convert it yourself when necessary.\n\n```vue\n\n\t\n\t\t \n\t\t{{ time }} | {{ tz }}\n\t\n\n\n```\n\n### Restricting to a specific time range\n\nYou can optionally restrict the selectable time range, for example from 08:00 on Monday to 20:00 on Sunday of the current week.\nThis example shows how the `min` and `max` properties are applied to different picker types.\n\n```vue\n\n\t
\n\t\t
Date and time
\n\t\t\n\t\t
Selected: {{ selectedDatetime }}
\n\n\t\t
Date range
\n\t\t\n\t\t
Selected: {{ selectedDateRange }}
\n\n\t\t
Date and time range
\n\t\t\n\t\t
Selected: {{ selectedDatetimeRange }}
\n\n\t\t
Time range
\n\t\t\n\t\t
Selected: {{ selectedTimeRange }}
\n\n\t\t
Time
\n\t\t\n\t\t
Selected: {{ selectedTime }}
\n\t
\n\n\n```\n\n### Inline calendar\n\nRenders the calendar inline (without the text input) inside your parent component.\n\n```vue\n\n\t