@nextcloud/vue 9.0.0-alpha.4 → 9.0.0-alpha.6

package/dist/chunks/NcDateTimePicker-BMkjvfOV.mjs

@@ -0,0 +1,377 @@
+import '../assets/NcDateTimePicker-D67l0SAR.css';
+import { r as register, F as t36, a as t } from "./_l10n-D7WwrqS-.mjs";
+import { G as GenRandomId } from "./GenRandomId-CMooMQt0.mjs";
+import { N as NcTimezonePicker } from "./NcTimezonePicker-CMpvPeCI.mjs";
+import { N as NcPopover } from "./NcPopover-Cmspgso4.mjs";
+import { S as ScopeComponent } from "./ScopeComponent-77f9B57X.mjs";
+import { openBlock, createElementBlock, mergeProps, createElementVNode, toDisplayString, createCommentVNode, resolveComponent, createBlock, createSlots, withCtx, withModifiers, createVNode, renderList, renderSlot, normalizeProps, guardReactiveProps } from "vue";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
+import { getMonthNames, getMonthNamesShort, getDayNames, getDayNamesShort, getDayNamesMin, getFirstDay } from "@nextcloud/l10n";
+import DatePicker from "vue-datepicker-next";
+register(t36);
+const _sfc_main$2 = {
+  name: "CalendarBlankIcon",
+  emits: ["click"],
+  props: {
+    title: {
+      type: String
+    },
+    fillColor: {
+      type: String,
+      default: "currentColor"
+    },
+    size: {
+      type: Number,
+      default: 24
+    }
+  }
+};
+const _hoisted_1$2 = ["aria-hidden", "aria-label"];
+const _hoisted_2$2 = ["fill", "width", "height"];
+const _hoisted_3$2 = { d: "M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1" };
+const _hoisted_4$1 = { key: 0 };
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("span", mergeProps(_ctx.$attrs, {
+    "aria-hidden": $props.title ? null : "true",
+    "aria-label": $props.title,
+    class: "material-design-icon calendar-blank-icon",
+    role: "img",
+    onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click", $event))
+  }), [
+    (openBlock(), createElementBlock("svg", {
+      fill: $props.fillColor,
+      class: "material-design-icon__svg",
+      width: $props.size,
+      height: $props.size,
+      viewBox: "0 0 24 24"
+    }, [
+      createElementVNode("path", _hoisted_3$2, [
+        $props.title ? (openBlock(), createElementBlock("title", _hoisted_4$1, toDisplayString($props.title), 1)) : createCommentVNode("", true)
+      ])
+    ], 8, _hoisted_2$2))
+  ], 16, _hoisted_1$2);
+}
+const CalendarBlank = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
+const _sfc_main$1 = {
+  name: "WebIcon",
+  emits: ["click"],
+  props: {
+    title: {
+      type: String
+    },
+    fillColor: {
+      type: String,
+      default: "currentColor"
+    },
+    size: {
+      type: Number,
+      default: 24
+    }
+  }
+};
+const _hoisted_1$1 = ["aria-hidden", "aria-label"];
+const _hoisted_2$1 = ["fill", "width", "height"];
+const _hoisted_3$1 = { d: "M16.36,14C16.44,13.34 16.5,12.68 16.5,12C16.5,11.32 16.44,10.66 16.36,10H19.74C19.9,10.64 20,11.31 20,12C20,12.69 19.9,13.36 19.74,14M14.59,19.56C15.19,18.45 15.65,17.25 15.97,16H18.92C17.96,17.65 16.43,18.93 14.59,19.56M14.34,14H9.66C9.56,13.34 9.5,12.68 9.5,12C9.5,11.32 9.56,10.65 9.66,10H14.34C14.43,10.65 14.5,11.32 14.5,12C14.5,12.68 14.43,13.34 14.34,14M12,19.96C11.17,18.76 10.5,17.43 10.09,16H13.91C13.5,17.43 12.83,18.76 12,19.96M8,8H5.08C6.03,6.34 7.57,5.06 9.4,4.44C8.8,5.55 8.35,6.75 8,8M5.08,16H8C8.35,17.25 8.8,18.45 9.4,19.56C7.57,18.93 6.03,17.65 5.08,16M4.26,14C4.1,13.36 4,12.69 4,12C4,11.31 4.1,10.64 4.26,10H7.64C7.56,10.66 7.5,11.32 7.5,12C7.5,12.68 7.56,13.34 7.64,14M12,4.03C12.83,5.23 13.5,6.57 13.91,8H10.09C10.5,6.57 11.17,5.23 12,4.03M18.92,8H15.97C15.65,6.75 15.19,5.55 14.59,4.44C16.43,5.07 17.96,6.34 18.92,8M12,2C6.47,2 2,6.5 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z" };
+const _hoisted_4 = { key: 0 };
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("span", mergeProps(_ctx.$attrs, {
+    "aria-hidden": $props.title ? null : "true",
+    "aria-label": $props.title,
+    class: "material-design-icon web-icon",
+    role: "img",
+    onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click", $event))
+  }), [
+    (openBlock(), createElementBlock("svg", {
+      fill: $props.fillColor,
+      class: "material-design-icon__svg",
+      width: $props.size,
+      height: $props.size,
+      viewBox: "0 0 24 24"
+    }, [
+      createElementVNode("path", _hoisted_3$1, [
+        $props.title ? (openBlock(), createElementBlock("title", _hoisted_4, toDisplayString($props.title), 1)) : createCommentVNode("", true)
+      ])
+    ], 8, _hoisted_2$1))
+  ], 16, _hoisted_1$1);
+}
+const Web = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
+const formatMap = {
+  date: "YYYY-MM-DD",
+  datetime: "YYYY-MM-DD H:mm:ss",
+  year: "YYYY",
+  month: "YYYY-MM",
+  time: "H:mm:ss",
+  week: "w"
+};
+const _sfc_main = ScopeComponent({
+  name: "NcDateTimePicker",
+  components: {
+    CalendarBlank,
+    DatePicker,
+    NcPopover,
+    NcTimezonePicker,
+    Web
+  },
+  props: {
+    clearable: {
+      type: Boolean,
+      default: false
+    },
+    minuteStep: {
+      type: Number,
+      default: 10
+    },
+    type: {
+      type: String,
+      default: "date"
+    },
+    format: {
+      type: String,
+      default: null
+    },
+    formatter: {
+      type: Object,
+      default: null
+    },
+    lang: {
+      type: Object,
+      default: null
+    },
+    /**
+     * The value to initialize, but also two-way bind the selected date. The date is – like the `Date` object in
+     * JavaScript – tied to UTC. The selected time zone does not have an influence of the selected time and date
+     * value. You have to translate the time yourself when you want to factor in time zones.
+     */
+    // eslint-disable-next-line
+    modelValue: {
+      default: () => /* @__PURE__ */ new Date()
+    },
+    /**
+     * The preselected IANA time zone ID for the time zone picker, only relevant in combination with `:show-timezone-select="true"`. Example: `Europe/Berlin`. The prop supports two-way binding through v-model directive.
+     */
+    timezoneId: {
+      type: String,
+      default: "UTC"
+    },
+    showTimezoneSelect: {
+      type: Boolean,
+      default: false
+    },
+    highlightTimezone: {
+      type: Boolean,
+      default: false
+    },
+    appendToBody: {
+      type: Boolean,
+      default: false
+    },
+    showWeekNumber: {
+      type: Boolean,
+      default: false
+    },
+    placeholder: {
+      type: String,
+      default: null
+    }
+  },
+  emits: [
+    "update:modelValue",
+    "update:timezone-id"
+  ],
+  setup() {
+    return {
+      timezoneDialogHeaderId: `timezone-dialog-header-${GenRandomId()}`
+    };
+  },
+  data() {
+    return {
+      showTimezonePopover: false,
+      tzVal: this.timezoneId
+    };
+  },
+  computed: {
+    /**
+     * Datepicker language
+     * https://github.com/mengxiong10/vue2-datepicker/blob/master/locale.md
+     *
+     * @return {object}
+     */
+    defaultLang() {
+      return {
+        formatLocale: {
+          months: getMonthNames(),
+          monthsShort: getMonthNamesShort(),
+          weekdays: getDayNames(),
+          weekdaysShort: getDayNamesShort(),
+          weekdaysMin: getDayNamesMin(),
+          // 0 = sunday, 1 = monday
+          firstDayOfWeek: getFirstDay()
+        },
+        monthFormat: "MMMM"
+      };
+    },
+    /**
+     * Translated placeholder
+     *
+     * @return {string}
+     */
+    defaultPlaceholder() {
+      if (this.type === "time") {
+        return t("Pick a time");
+      }
+      if (this.type === "month") {
+        return t("Pick a month");
+      }
+      if (this.type === "year") {
+        return t("Pick a year");
+      }
+      if (this.type === "week") {
+        return t("Pick a week");
+      }
+      if (this.type === "date") {
+        return t("Pick a date");
+      }
+      return t("Pick a date and a time");
+    },
+    /**
+     * If format is not provided, try to match the type
+     * or fallback to 'date'
+     *
+     * @return {string}
+     */
+    formatTypeMap() {
+      return formatMap[this.type] ?? formatMap.date;
+    },
+    /**
+     * The formatter used for the vue-datepicker to fix nextcloud-libraries/nextcloud-vue#5044
+     */
+    internalFormatter() {
+      const getWeek = (date) => {
+        const firstThursday = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));
+        firstThursday.setUTCDate(firstThursday.getUTCDate() + 4 - (firstThursday.getUTCDay() || 7));
+        const yearStart = new Date(Date.UTC(firstThursday.getUTCFullYear(), 0, 1));
+        return Math.ceil(((firstThursday - yearStart) / 864e5 + 1) / 7);
+      };
+      return {
+        getWeek,
+        // allow to override it by users using the `formatter` prop
+        ...this.formatter ?? {}
+      };
+    }
+  },
+  methods: {
+    t,
+    handleSelectYear(year) {
+      const value = this.$refs.datepicker.currentValue;
+      if (value) {
+        try {
+          const date = new Date(new Date(value).setFullYear(year));
+          this.$refs.datepicker.selectDate(date);
+        } catch (error) {
+          console.error("Invalid value", value, year);
+        }
+      }
+    },
+    handleSelectMonth(month) {
+      const value = this.$refs.datepicker.currentValue;
+      if (value) {
+        try {
+          const date = new Date(new Date(value).setMonth(month));
+          this.$refs.datepicker.selectDate(date);
+        } catch (error) {
+          console.error("Invalid value", value, month);
+        }
+      }
+    },
+    /**
+     * Toggles the visibility of the time zone popover
+     */
+    toggleTimezonePopover() {
+      if (!this.showTimezoneSelect) {
+        return;
+      }
+      this.showTimezonePopover = !this.showTimezonePopover;
+    }
+  }
+});
+const _hoisted_1 = ["aria-labelledby"];
+const _hoisted_2 = { class: "timezone-popover-wrapper__label" };
+const _hoisted_3 = ["id"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Web = resolveComponent("Web");
+  const _component_NcTimezonePicker = resolveComponent("NcTimezonePicker");
+  const _component_NcPopover = resolveComponent("NcPopover");
+  const _component_CalendarBlank = resolveComponent("CalendarBlank");
+  const _component_DatePicker = resolveComponent("DatePicker");
+  return openBlock(), createBlock(_component_DatePicker, {
+    ref: "datepicker",
+    "append-to-body": _ctx.appendToBody,
+    clearable: _ctx.clearable,
+    format: _ctx.format ? _ctx.format : _ctx.formatTypeMap,
+    formatter: _ctx.internalFormatter,
+    lang: _ctx.lang ? _ctx.lang : _ctx.defaultLang,
+    "minute-step": _ctx.minuteStep,
+    placeholder: _ctx.placeholder ? _ctx.placeholder : _ctx.defaultPlaceholder,
+    "popup-class": { "show-week-number": _ctx.showWeekNumber },
+    "show-week-number": _ctx.showWeekNumber,
+    type: _ctx.type,
+    value: _ctx.modelValue,
+    onSelectYear: _ctx.handleSelectYear,
+    onSelectMonth: _ctx.handleSelectMonth,
+    "onUpdate:value": _cache[2] || (_cache[2] = ($event) => _ctx.$emit("update:modelValue", $event))
+  }, createSlots({
+    "icon-calendar": withCtx(() => [
+      _ctx.showTimezoneSelect ? (openBlock(), createBlock(_component_NcPopover, {
+        key: 0,
+        shown: _ctx.showTimezonePopover,
+        "onUpdate:shown": _cache[1] || (_cache[1] = ($event) => _ctx.showTimezonePopover = $event),
+        "popup-role": "dialog",
+        "popover-base-class": "timezone-select__popper"
+      }, {
+        trigger: withCtx(({ attrs }) => [
+          createElementVNode("button", mergeProps({
+            class: ["datetime-picker-inline-icon", { "datetime-picker-inline-icon--highlighted": _ctx.highlightTimezone }]
+          }, attrs, {
+            onMousedown: withModifiers(() => {
+            }, ["stop", "prevent"])
+          }), [
+            createVNode(_component_Web, { size: 20 })
+          ], 16)
+        ]),
+        default: withCtx(() => [
+          createElementVNode("div", {
+            role: "dialog",
+            "aria-labelledby": _ctx.timezoneDialogHeaderId
+          }, [
+            createElementVNode("div", _hoisted_2, [
+              createElementVNode("strong", { id: _ctx.timezoneDialogHeaderId }, toDisplayString(_ctx.t("Please select a time zone:")), 9, _hoisted_3)
+            ]),
+            createVNode(_component_NcTimezonePicker, {
+              "model-value": _ctx.tzVal,
+              class: "timezone-popover-wrapper__timezone-select",
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:timezone-id", $event))
+            }, null, 8, ["model-value"])
+          ], 8, _hoisted_1)
+        ]),
+        _: 1
+      }, 8, ["shown"])) : (openBlock(), createBlock(_component_CalendarBlank, {
+        key: 1,
+        size: 20
+      }))
+    ]),
+    _: 2
+  }, [
+    renderList(_ctx.$slots, (_, slot) => {
+      return {
+        name: slot,
+        fn: withCtx((scope) => [
+          renderSlot(_ctx.$slots, slot, normalizeProps(guardReactiveProps(scope)), void 0, true)
+        ])
+      };
+    })
+  ]), 1032, ["append-to-body", "clearable", "format", "formatter", "lang", "minute-step", "placeholder", "popup-class", "show-week-number", "type", "value", "onSelectYear", "onSelectMonth"]);
+}
+const NcDateTimePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-ffd15796"]]);
+export {
+  NcDateTimePicker as N
+};

package/dist/chunks/NcDateTimePicker-BMkjvfOV.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcDateTimePicker-BMkjvfOV.mjs","sources":["../../node_modules/vue-material-design-icons/CalendarBlank.vue","../../node_modules/vue-material-design-icons/Web.vue","../../src/components/NcDateTimePicker/NcDateTimePicker.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon calendar-blank-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"CalendarBlankIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon web-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M16.36,14C16.44,13.34 16.5,12.68 16.5,12C16.5,11.32 16.44,10.66 16.36,10H19.74C19.9,10.64 20,11.31 20,12C20,12.69 19.9,13.36 19.74,14M14.59,19.56C15.19,18.45 15.65,17.25 15.97,16H18.92C17.96,17.65 16.43,18.93 14.59,19.56M14.34,14H9.66C9.56,13.34 9.5,12.68 9.5,12C9.5,11.32 9.56,10.65 9.66,10H14.34C14.43,10.65 14.5,11.32 14.5,12C14.5,12.68 14.43,13.34 14.34,14M12,19.96C11.17,18.76 10.5,17.43 10.09,16H13.91C13.5,17.43 12.83,18.76 12,19.96M8,8H5.08C6.03,6.34 7.57,5.06 9.4,4.44C8.8,5.55 8.35,6.75 8,8M5.08,16H8C8.35,17.25 8.8,18.45 9.4,19.56C7.57,18.93 6.03,17.65 5.08,16M4.26,14C4.1,13.36 4,12.69 4,12C4,11.31 4.1,10.64 4.26,10H7.64C7.56,10.66 7.5,11.32 7.5,12C7.5,12.68 7.56,13.34 7.64,14M12,4.03C12.83,5.23 13.5,6.57 13.91,8H10.09C10.5,6.57 11.17,5.23 12,4.03M18.92,8H15.97C15.65,6.75 15.19,5.55 14.59,4.44C16.43,5.07 17.96,6.34 18.92,8M12,2C6.47,2 2,6.5 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"WebIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n> We're wrapping the awesome datepicker library here https://github.com/mengxiong10/vue-datepicker-next\n> Please check there for all the available options.\n\n### Defaults\n- cleareable: false\n- minute-step: 10\n\n### Example\n```vue\n<template>\n\t<span>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\ttype=\"datetime\" />\n\t\t{{ time }}\n\t</span>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttime: new Date('2022-10-10 10:10:10'),\n\t\t}\n\t},\n}\n</script>\n```\n\n### Example with confirm button\n```vue\n<template>\n\t<span>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\ttype=\"datetime\"\n\t\t\tconfirm />\n\t\t{{ time }}\n\t</span>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\ttime: null,\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n### Range picker\n```vue\n<template>\n\t<span>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\trange\n\t\t\ttype=\"date\" />\n\t\t{{ time }}\n\t</span>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttime: null,\n\t\t}\n\t},\n}\n</script>\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<template>\n\t<span>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\ttype=\"datetime\"\n\t\t\t:show-timezone-select=\"true\"\n\t\t\tv-model:timezone-id=\"tz\" /><br>\n\t\t{{ time }} | {{ tz }}\n\t</span>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttime: undefined,\n\t\t\ttz: 'Europe/Berlin',\n\t\t}\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<DatePicker ref=\"datepicker\"\n\t\t:append-to-body=\"appendToBody\"\n\t\t:clearable=\"clearable\"\n\t\t:format=\"format ? format : formatTypeMap\"\n\t\t:formatter=\"internalFormatter\"\n\t\t:lang=\"lang ? lang : defaultLang\"\n\t\t:minute-step=\"minuteStep\"\n\t\t:placeholder=\"placeholder ? placeholder : defaultPlaceholder\"\n\t\t:popup-class=\"{ 'show-week-number': showWeekNumber }\"\n\t\t:show-week-number=\"showWeekNumber\"\n\t\t:type=\"type\"\n\t\t:value=\"modelValue\"\n\t\t@select-year=\"handleSelectYear\"\n\t\t@select-month=\"handleSelectMonth\"\n\t\t@update:value=\"$emit('update:modelValue', $event)\">\n\t\t<template #icon-calendar>\n\t\t\t<NcPopover v-if=\"showTimezoneSelect\"\n\t\t\t\tv-model:shown=\"showTimezonePopover\"\n\t\t\t\tpopup-role=\"dialog\"\n\t\t\t\tpopover-base-class=\"timezone-select__popper\">\n\t\t\t\t<template #trigger=\"{ attrs }\">\n\t\t\t\t\t<button class=\"datetime-picker-inline-icon\"\n\t\t\t\t\t\t:class=\"{'datetime-picker-inline-icon--highlighted': highlightTimezone}\"\n\t\t\t\t\t\tv-bind=\"attrs\"\n\t\t\t\t\t\t@mousedown.stop.prevent=\"() => {}\">\n\t\t\t\t\t\t<Web :size=\"20\" />\n\t\t\t\t\t</button>\n\t\t\t\t</template>\n\n\t\t\t\t<div role=\"dialog\"\n\t\t\t\t\t:aria-labelledby=\"timezoneDialogHeaderId\">\n\t\t\t\t\t<div class=\"timezone-popover-wrapper__label\">\n\t\t\t\t\t\t<strong :id=\"timezoneDialogHeaderId\">\n\t\t\t\t\t\t\t{{ t('Please select a time zone:') }}\n\t\t\t\t\t\t</strong>\n\t\t\t\t\t</div>\n\t\t\t\t\t<NcTimezonePicker :model-value=\"tzVal\"\n\t\t\t\t\t\tclass=\"timezone-popover-wrapper__timezone-select\"\n\t\t\t\t\t\t@update:model-value=\"$emit('update:timezone-id', $event)\" />\n\t\t\t\t</div>\n\t\t\t</NcPopover>\n\t\t\t<CalendarBlank v-else :size=\"20\" />\n\t\t</template>\n\t\t<template v-for=\"(_, slot) of $slots\" #[slot]=\"scope\">\n\t\t\t<slot :name=\"slot\" v-bind=\"scope\" />\n\t\t</template>\n\t</DatePicker>\n</template>\n\n<script>\nimport { t } from '../../l10n.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nimport NcTimezonePicker from '../NcTimezonePicker/index.js'\nimport NcPopover from '../NcPopover/index.js'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nimport CalendarBlank from 'vue-material-design-icons/CalendarBlank.vue'\nimport Web from 'vue-material-design-icons/Web.vue'\n\nimport {\n\tgetFirstDay,\n\tgetDayNames,\n\tgetDayNamesShort,\n\tgetDayNamesMin,\n\tgetMonthNames,\n\tgetMonthNamesShort,\n} from '@nextcloud/l10n'\n\nimport DatePicker from 'vue-datepicker-next'\nimport './index.scss'\n\nconst formatMap = {\n\tdate: 'YYYY-MM-DD',\n\tdatetime: 'YYYY-MM-DD H:mm:ss',\n\tyear: 'YYYY',\n\tmonth: 'YYYY-MM',\n\ttime: 'H:mm:ss',\n\tweek: 'w',\n}\n\nexport default ScopeComponent({\n\tname: 'NcDateTimePicker',\n\n\tcomponents: {\n\t\tCalendarBlank,\n\t\tDatePicker,\n\t\tNcPopover,\n\t\tNcTimezonePicker,\n\t\tWeb,\n\t},\n\n\tprops: {\n\t\tclearable: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\tminuteStep: {\n\t\t\ttype: Number,\n\t\t\tdefault: 10,\n\t\t},\n\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t},\n\n\t\tformat: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\tformatter: {\n\t\t\ttype: Object,\n\t\t\tdefault: null,\n\t\t},\n\n\t\tlang: {\n\t\t\ttype: Object,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * The value to initialize, but also two-way bind the selected date. The date is – like the `Date` object in\n\t\t * JavaScript – tied to UTC. The selected time zone does not have an influence of the selected time and date\n\t\t * value. You have to translate the time yourself when you want to factor in time zones.\n\t\t */\n\t\t// eslint-disable-next-line\n\t\tmodelValue: {\n\t\t\tdefault: () => new Date(),\n\t\t},\n\n\t\t/**\n\t\t * The preselected IANA time zone ID for the time zone picker, only relevant in combination with `:show-timezone-select=\"true\"`. Example: `Europe/Berlin`. The prop supports two-way binding through v-model directive.\n\t\t */\n\t\ttimezoneId: {\n\t\t\ttype: String,\n\t\t\tdefault: 'UTC',\n\t\t},\n\n\t\tshowTimezoneSelect: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\thighlightTimezone: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\tappendToBody: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\tshowWeekNumber: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:modelValue',\n\t\t'update:timezone-id',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\ttimezoneDialogHeaderId: `timezone-dialog-header-${GenRandomId()}`,\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tshowTimezonePopover: false,\n\t\t\ttzVal: this.timezoneId,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * Datepicker language\n\t\t * https://github.com/mengxiong10/vue2-datepicker/blob/master/locale.md\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tdefaultLang() {\n\t\t\treturn {\n\t\t\t\tformatLocale: {\n\t\t\t\t\tmonths: getMonthNames(),\n\t\t\t\t\tmonthsShort: getMonthNamesShort(),\n\t\t\t\t\tweekdays: getDayNames(),\n\t\t\t\t\tweekdaysShort: getDayNamesShort(),\n\t\t\t\t\tweekdaysMin: getDayNamesMin(),\n\t\t\t\t\t// 0 = sunday, 1 = monday\n\t\t\t\t\tfirstDayOfWeek: getFirstDay(),\n\t\t\t\t},\n\t\t\t\tmonthFormat: 'MMMM',\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Translated placeholder\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tdefaultPlaceholder() {\n\t\t\tif (this.type === 'time') {\n\t\t\t\treturn t('Pick a time')\n\t\t\t}\n\t\t\tif (this.type === 'month') {\n\t\t\t\treturn t('Pick a month')\n\t\t\t}\n\t\t\tif (this.type === 'year') {\n\t\t\t\treturn t('Pick a year')\n\t\t\t}\n\t\t\tif (this.type === 'week') {\n\t\t\t\treturn t('Pick a week')\n\t\t\t}\n\t\t\tif (this.type === 'date') {\n\t\t\t\treturn t('Pick a date')\n\t\t\t}\n\t\t\treturn t('Pick a date and a time')\n\t\t},\n\n\t\t/**\n\t\t * If format is not provided, try to match the type\n\t\t * or fallback to 'date'\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tformatTypeMap() {\n\t\t\treturn formatMap[this.type] ?? formatMap.date\n\t\t},\n\n\t\t/**\n\t\t * The formatter used for the vue-datepicker to fix nextcloud-libraries/nextcloud-vue#5044\n\t\t */\n\t\tinternalFormatter() {\n\t\t\t/**\n\t\t\t * Get the ISO week number of the date\n\t\t\t * @param {Date} date The date to format\n\t\t\t */\n\t\t\tconst getWeek = (date) => {\n\t\t\t\t// Adjust to nearest Thursday\n\t\t\t\tconst firstThursday = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()))\n\t\t\t\tfirstThursday.setUTCDate(firstThursday.getUTCDate() + 4 - (firstThursday.getUTCDay() || 7))\n\n\t\t\t\tconst yearStart = new Date(Date.UTC(firstThursday.getUTCFullYear(), 0, 1))\n\n\t\t\t\t// Full weeks to nearest Thursday\n\t\t\t\treturn Math.ceil((((firstThursday - yearStart) / 86400000) + 1) / 7)\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tgetWeek,\n\t\t\t\t// allow to override it by users using the `formatter` prop\n\t\t\t\t...(this.formatter ?? {}),\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\thandleSelectYear(year) {\n\t\t\tconst value = this.$refs.datepicker.currentValue\n\t\t\tif (value) {\n\t\t\t\ttry {\n\t\t\t\t\tconst date = new Date(new Date(value).setFullYear(year))\n\t\t\t\t\tthis.$refs.datepicker.selectDate(date)\n\t\t\t\t} catch (error) {\n\t\t\t\t\tconsole.error('Invalid value', value, year)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\thandleSelectMonth(month) {\n\t\t\tconst value = this.$refs.datepicker.currentValue\n\t\t\tif (value) {\n\t\t\t\ttry {\n\t\t\t\t\tconst date = new Date(new Date(value).setMonth(month))\n\t\t\t\t\tthis.$refs.datepicker.selectDate(date)\n\t\t\t\t} catch (error) {\n\t\t\t\t\tconsole.error('Invalid value', value, month)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Toggles the visibility of the time zone popover\n\t\t */\n\t\ttoggleTimezonePopover() {\n\t\t\tif (!this.showTimezoneSelect) {\n\t\t\t\t// Just a click on the icon, but not for time zones -> ignore\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.showTimezonePopover = !this.showTimezonePopover\n\t\t},\n\t},\n})\n\n</script>\n\n<style lang=\"scss\" scoped>\n.mx-datepicker :deep(.mx-input-wrapper .mx-input) {\n\tbackground-clip: border-box;\n}\n\n.datetime-picker-inline-icon {\n\topacity: .3;\n\tborder: none;\n\tbackground-color: transparent;\n\tborder-radius: 0;\n\tpadding: 0 !important;\n\tmargin: 0;\n\n\t&--highlighted {\n\t\topacity: .7;\n\t}\n\n\t&:focus,\n\t&:hover {\n\t\topacity: 1;\n\t}\n}\n</style>\n\n<style lang=\"scss\">\n// We overwrite the popover base class, so we can style\n// the popover for the timezone select only.\n.v-popper--theme-dropdown.v-popper__popper.timezone-select__popper .v-popper__wrapper {\n\tborder-radius: var(--border-radius-large);\n\n\t.v-popper__inner {\n\t\tpadding: 4px;\n\t\tborder-radius: var(--border-radius-large);\n\n\t\t.timezone-popover-wrapper {\n\t\t\t&__label {\n\t\t\t\tpadding: 4px 0;\n\t\t\t\tpadding-left: 14px; // Left-align with NcSelect text\n\t\t\t}\n\n\t\t\t// We overwrite the border radius of the input to account for the popover border-radius minus the padding\n\t\t\t&__timezone-select.v-select {\n\t\t\t\t&.select {\n\t\t\t\t\tmin-width: 246px;\n\t\t\t\t\tleft: -8px !important;\n\t\t\t\t}\n\t\t\t\t.vs__dropdown-toggle {\n\t\t\t\t\tborder-radius: calc(var(--border-radius-large) - 4px);\n\t\t\t\t}\n\n\t\t\t\t&.vs--open {\n\t\t\t\t\t.vs__dropdown-toggle {\n\t\t\t\t\t\tborder-bottom-left-radius: 0;\n\t\t\t\t\t\tborder-bottom-right-radius: 0;\n\t\t\t\t\t}\n\t\t\t\t\t&.select--drop-up .vs__dropdown-toggle {\n\t\t\t\t\t\tborder-radius: 0 0 calc(var(--border-radius-large) - 4px) calc(var(--border-radius-large) - 4px);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\n// TODO: This should be scoped or targeted by a specific selector, but the NcSelect component does not allow this yet.\n.vs__dropdown-menu--floating {\n\t// Higher z-index than the popover in which the NcSelect is located.\n\tz-index: 100001 !important;\n}\n</style>\n"],"names":["_sfc_main","_hoisted_1","_hoisted_2","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_hoisted_4","_createCommentVNode","_createBlock","_createSlots","_withCtx","_withModifiers","_createVNode","_toDisplayString","_renderList","_renderSlot","_normalizeProps","_guardReactiveProps"],"mappings":"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","x_google_ignoreList":[0,1]}

package/dist/chunks/NcDateTimePickerNative-I2YJ1mqx.mjs

@@ -0,0 +1,200 @@
+import '../assets/NcDateTimePickerNative-DLch-JRA.css';
+import { S as ScopeComponent } from "./ScopeComponent-77f9B57X.mjs";
+import { openBlock, createElementBlock, createElementVNode, normalizeClass, toDisplayString, mergeProps } from "vue";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
+const inputDateTypes = ["date", "datetime-local", "month", "time", "week"];
+const _sfc_main = ScopeComponent({
+  name: "NcDateTimePickerNative",
+  inheritAttrs: false,
+  props: {
+    /**
+     * The date is – like the `Date` object in JavaScript – tied to UTC.
+     * The selected time zone does not have an influence of the selected time and date value.
+     * You have to translate the time yourself when you want to factor in time zones.
+     * Pass null to clear the input field.
+     */
+    modelValue: {
+      type: Date,
+      default: null
+    },
+    /**
+     * id attribute of the input field
+     */
+    id: {
+      type: String,
+      required: true
+    },
+    /**
+     * type attribute of the input field
+     * default type: String
+     * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`
+     */
+    type: {
+      type: String,
+      default: "date",
+      validate: (name) => inputDateTypes.includes(name)
+    },
+    /**
+     * text inside the label element
+     * default type: String
+     */
+    label: {
+      type: String,
+      default: "Please choose a date"
+    },
+    /**
+     * min attribute of the input field
+     * default type: null
+     */
+    min: {
+      type: [Date, Boolean],
+      default: null
+    },
+    /**
+     * max attribute of the input field
+     * default type: null
+     */
+    max: {
+      type: [Date, Boolean],
+      default: null
+    },
+    /**
+     * Flag to hide the label
+     * default type: String
+     * The hidden input label for accessibility purposes.
+     */
+    hideLabel: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Class to add to the input field.
+     * Necessary to use NcDateTimePickerNative in the NcActionInput component.
+     */
+    inputClass: {
+      type: [Object, String],
+      default: ""
+    }
+  },
+  emits: [
+    "update:modelValue"
+  ],
+  computed: {
+    formattedValue() {
+      return this.formatValue(this.modelValue);
+    },
+    formattedMin() {
+      if (this.min) {
+        return this.formatValue(this.min);
+      }
+      return false;
+    },
+    formattedMax() {
+      if (this.max) {
+        return this.formatValue(this.max);
+      }
+      return false;
+    }
+  },
+  methods: {
+    /**
+     * Handle the input event
+     *
+     * @param {InputEvent} $event input event payload
+     * @return {Date|null} new chosen Date() or null
+     */
+    onInput($event) {
+      if (isNaN($event.target.valueAsNumber)) {
+        return this.$emit("update:modelValue", null);
+      }
+      if (this.type === "time") {
+        const time = $event.target.value;
+        if (this.modelValue === "") {
+          const { yyyy: yyyy2, MM: MM2, dd: dd2 } = this.getReadableDate(/* @__PURE__ */ new Date());
+          return this.$emit("update:modelValue", /* @__PURE__ */ new Date(`${yyyy2}-${MM2}-${dd2}T${time}`));
+        }
+        const { yyyy, MM, dd } = this.getReadableDate(this.modelValue);
+        return this.$emit("update:modelValue", /* @__PURE__ */ new Date(`${yyyy}-${MM}-${dd}T${time}`));
+      } else if (this.type === "month") {
+        const MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, "0");
+        if (this.modelValue === "") {
+          const { yyyy: yyyy2, dd: dd2, hh: hh2, mm: mm2 } = this.getReadableDate(/* @__PURE__ */ new Date());
+          return this.$emit("update:modelValue", /* @__PURE__ */ new Date(`${yyyy2}-${MM}-${dd2}T${hh2}:${mm2}`));
+        }
+        const { yyyy, dd, hh, mm } = this.getReadableDate(this.value);
+        return this.$emit("update:modelValue", /* @__PURE__ */ new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`));
+      }
+      const timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1e3 * 60;
+      const inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds;
+      return this.$emit("update:modelValue", new Date(inputDateWithTimezone));
+    },
+    /**
+     * Returns Object with string values of a Date
+     *
+     * @param {Date} value The selected value
+     * @return {object|undefined}
+     */
+    getReadableDate(value) {
+      if (value instanceof Date) {
+        const yyyy = value.getFullYear().toString().padStart(4, "0");
+        const MM = (value.getMonth() + 1).toString().padStart(2, "0");
+        const dd = value.getDate().toString().padStart(2, "0");
+        const hh = value.getHours().toString().padStart(2, "0");
+        const mm = value.getMinutes().toString().padStart(2, "0");
+        return { yyyy, MM, dd, hh, mm };
+      }
+    },
+    /**
+     * Returns preformatted value for the input field
+     *
+     * @param {Date} value The selected value
+     * @return {string|undefined}
+     */
+    formatValue(value) {
+      if (value instanceof Date) {
+        const { yyyy, MM, dd, hh, mm } = this.getReadableDate(value);
+        if (this.type === "datetime-local") {
+          return `${yyyy}-${MM}-${dd}T${hh}:${mm}`;
+        } else if (this.type === "date") {
+          return `${yyyy}-${MM}-${dd}`;
+        } else if (this.type === "month") {
+          return `${yyyy}-${MM}`;
+        } else if (this.type === "time") {
+          return `${hh}:${mm}`;
+        } else if (this.type === "week") {
+          const startDate = new Date(yyyy, 0, 1);
+          const daysSinceBeginningOfYear = Math.floor((value - startDate) / (24 * 60 * 60 * 1e3));
+          const weekNumber = Math.ceil(daysSinceBeginningOfYear / 7);
+          return `${yyyy}-W${weekNumber}`;
+        }
+      } else {
+        return "";
+      }
+    }
+  }
+});
+const _hoisted_1 = { class: "native-datetime-picker" };
+const _hoisted_2 = ["for"];
+const _hoisted_3 = ["id", "type", "value", "min", "max"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createElementVNode("label", {
+      class: normalizeClass({ "hidden-visually": _ctx.hideLabel }),
+      for: _ctx.id
+    }, toDisplayString(_ctx.label), 11, _hoisted_2),
+    createElementVNode("input", mergeProps({
+      id: _ctx.id,
+      class: ["native-datetime-picker--input", _ctx.inputClass],
+      type: _ctx.type,
+      value: _ctx.formattedValue,
+      min: _ctx.formattedMin,
+      max: _ctx.formattedMax
+    }, _ctx.$attrs, {
+      onInput: _cache[0] || (_cache[0] = (...args) => _ctx.onInput && _ctx.onInput(...args))
+    }), null, 16, _hoisted_3)
+  ]);
+}
+const NcDateTimePickerNative = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-2debd3a9"]]);
+export {
+  NcDateTimePickerNative as N
+};

package/dist/chunks/NcDateTimePickerNative-I2YJ1mqx.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcDateTimePickerNative-I2YJ1mqx.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html#  <br>\n\n### Examples\n\n#### Usage: type='datetime-local'\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:id=\"id\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t\tThe date selected is {{ value }}\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tid: 'date-time-picker',\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:id=\"id\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tid: 'date-time-picker',\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n#### Usage: type='week'\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:id=\"id\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"week\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tid: 'date-time-picker',\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n#### Usage: type='month'\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:id=\"id\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"month\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tid: 'date-time-picker',\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n</docs>\n\n<template>\n\t<div class=\"native-datetime-picker\">\n\t\t<label :class=\"{ 'hidden-visually': hideLabel }\" :for=\"id\">{{ label }}</label>\n\t\t<input :id=\"id\"\n\t\t\tclass=\"native-datetime-picker--input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type=\"type\"\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\t@input=\"onInput\">\n\t</div>\n</template>\n\n<script>\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default ScopeComponent({\n\tname: 'NcDateTimePickerNative',\n\tinheritAttrs: false,\n\n\tprops: {\n\t\t/**\n\t\t * The date is – like the `Date` object in JavaScript – tied to UTC.\n\t\t * The selected time zone does not have an influence of the selected time and date value.\n\t\t * You have to translate the time yourself when you want to factor in time zones.\n\t\t * Pass null to clear the input field.\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Date,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the input field\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t\t/**\n\t\t * type attribute of the input field\n\t\t * default type: String\n\t\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t\tvalidate: (name) => inputDateTypes.includes(name),\n\t\t},\n\t\t/**\n\t\t * text inside the label element\n\t\t * default type: String\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: 'Please choose a date',\n\t\t},\n\t\t/**\n\t\t * min attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmin: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * max attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmax: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Flag to hide the label\n\t\t * default type: String\n\t\t * The hidden input label for accessibility purposes.\n\t\t */\n\t\thideLabel: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Class to add to the input field.\n\t\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:modelValue',\n\t],\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.modelValue)\n\t\t},\n\t\tformattedMin() {\n\t\t\tif (this.min) {\n\t\t\t\treturn this.formatValue(this.min)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tformattedMax() {\n\t\t\tif (this.max) {\n\t\t\t\treturn this.formatValue(this.max)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Handle the input event\n\t\t *\n\t\t * @param {InputEvent} $event input event payload\n\t\t * @return {Date|null} new chosen Date() or null\n\t\t */\n\t\tonInput($event) {\n\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t/**\n\t\t\t\t * Emitted when the input value changes\n\t\t\t\t *\n\t\t\t\t * @return {null} null value\n\t\t\t\t */\n\t\t\t\treturn this.$emit('update:modelValue', null)\n\t\t\t}\n\t\t\tif (this.type === 'time') {\n\t\t\t\tconst time = $event.target.value\n\t\t\t\tif (this.modelValue === '') {\n\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t/**\n\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t *\n\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t */\n\t\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t\t}\n\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.modelValue)\n\t\t\t\t/**\n\t\t\t\t * Emitted when the input value changes\n\t\t\t\t *\n\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t */\n\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t} else if (this.type === 'month') {\n\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tif (this.modelValue === '') {\n\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t/**\n\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t *\n\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t */\n\t\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t\t}\n\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.value)\n\t\t\t\t/**\n\t\t\t\t * Emitted when the input value changes\n\t\t\t\t *\n\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t */\n\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t}\n\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\n\t\t\t/**\n\t\t\t * Emitted when the input value changes\n\t\t\t *\n\t\t\t * @return {Date} new chosen Date()\n\t\t\t */\n\t\t\treturn this.$emit('update:modelValue', new Date(inputDateWithTimezone))\n\t\t},\n\t\t/**\n\t\t * Returns Object with string values of a Date\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {object|undefined}\n\t\t */\n\t\tgetReadableDate(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\t\t\t\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tconst dd = value.getDate().toString().padStart(2, '0')\n\t\t\t\tconst hh = value.getHours().toString().padStart(2, '0')\n\t\t\t\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\t\t\t\treturn { yyyy, MM, dd, hh, mm }\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Returns preformatted value for the input field\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {string|undefined}\n\t\t */\n\t\tformatValue(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst { yyyy, MM, dd, hh, mm } = this.getReadableDate(value)\n\t\t\t\tif (this.type === 'datetime-local') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'date') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}`\n\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\treturn `${yyyy}-${MM}`\n\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\treturn `${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'week') {\n\t\t\t\t\tconst startDate = new Date(yyyy, 0, 1)\n\t\t\t\t\tconst daysSinceBeginningOfYear = Math.floor((value - startDate)\n\t\t\t\t\t\t/ (24 * 60 * 60 * 1000))\n\t\t\t\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\t\t\t\treturn `${yyyy}-W${weekNumber}`\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t},\n\t},\n})\n</script>\n\n<style lang=\"scss\" scoped>\n\t.native-datetime-picker {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--input {\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tpadding-right: 4px;\n\t}\n\n\t[data-theme-light],\n\t[data-themes*=light] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\n\t[data-theme-dark],\n\t[data-themes*=dark] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n\n\t[data-theme-default],\n\t[data-themes*=default] {\n\t\t@media (prefers-color-scheme: light) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: light;\n\t\t\t}\n\t\t}\n\t\t@media (prefers-color-scheme: dark) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: dark;\n\t\t\t}\n\t\t}\n\t}\n</style>\n"],"names":["yyyy","MM","dd","hh","mm","_openBlock","_createElementBlock","_createElementVNode","_normalizeClass","_toDisplayString","_mergeProps"],"mappings":"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"}