@nextcloud/vue 8.4.0 → 9.0.0-alpha.0

package/dist/Components/NcDateTimePicker.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcDateTimePicker.mjs","sources":["../../node_modules/vue-material-design-icons/CalendarBlank.vue","../../node_modules/vue-material-design-icons/Web.vue","../../src/components/NcDateTimePicker/NcDateTimePicker.vue","../../src/components/NcDateTimePicker/index.js"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"!title\"\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\"\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  - @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>\n  -\n  - @author John Molakvoæ <skjnldsv@protonmail.com>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\n  -->\n\n<docs>\n> We're wrapping the awesome datepicker library here https://github.com/mengxiong10/vue2-datepicker\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\t:timezone-id.sync=\"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=\"formatter\"\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=\"value\"\n\t\tv-bind=\"$attrs\"\n\t\tv-on=\"$listeners\"\n\t\t@select-year=\"handleSelectYear\"\n\t\t@select-month=\"handleSelectMonth\"\n\t\t@update:value=\"$emit('update:value', value)\">\n\t\t<template #icon-calendar>\n\t\t\t<NcPopover v-if=\"showTimezoneSelect\"\n\t\t\t\t:shown.sync=\"showTimezonePopover\"\n\t\t\t\tpopover-base-class=\"timezone-select__popper\">\n\t\t\t\t<template #trigger>\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\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 class=\"timezone-popover-wrapper__label\">\n\t\t\t\t\t<strong>\n\t\t\t\t\t\t{{ t('Please select a time zone:') }}\n\t\t\t\t\t</strong>\n\t\t\t\t</div>\n\t\t\t\t<NcTimezonePicker v-model=\"tzVal\"\n\t\t\t\t\tclass=\"timezone-popover-wrapper__timezone-select\"\n\t\t\t\t\t@input=\"$emit('update:timezone-id', arguments[0])\" />\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 $scopedSlots\" #[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'\n\nimport NcTimezonePicker from '../NcTimezonePicker/index.js'\nimport NcPopover from '../NcPopover/index.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 'vue2-datepicker'\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 {\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\tinheritAttrs: false,\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\tvalue: {\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 the .sync modifier.\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:value',\n\t\t'update:timezone-id',\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: 'MMM',\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\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</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.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;\n}\n</style>\n","/**\n * @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>\n *\n * @author John Molakvoæ <skjnldsv@protonmail.com>\n *\n * @license AGPL-3.0-or-later\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU Affero General Public License as\n * published by the Free Software Foundation, either version 3 of the\n * License, or (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU Affero General Public License for more details.\n *\n * You should have received a copy of the GNU Affero General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n *\n */\nimport './index.scss'\nimport NcDateTimePicker from './NcDateTimePicker.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePicker)\n\nexport default NcDateTimePicker\n"],"names":["_sfc_main$2","_sfc_main$1","formatMap","_sfc_main","CalendarBlank","DatePicker","NcPopover","NcTimezonePicker","Web","getMonthNames","getMonthNamesShort","getDayNames","getDayNamesShort","getDayNamesMin","getFirstDay","t","_a","year","value","date","month","ScopeComponent","NcDateTimePicker"],"mappings":"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","x_google_ignoreList":[0,1]}
+{"version":3,"file":"NcDateTimePicker.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/Components/NcDateTimePickerNative.cjs

@@ -1,199 +1,3 @@
-var D = require("../assets/index-8b327013.css");
-const p = require("../chunks/_plugin-vue2_normalizer-7f9efb60.cjs"), h = require("../chunks/ScopeComponent-06c558d3.cjs");
-const f = ["date", "datetime-local", "month", "time", "week"], y = {
-  name: "NcDateTimePickerNative",
-  inheritAttrs: !1,
-  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.
-     */
-    value: {
-      type: Date,
-      default: null
-    },
-    /**
-     * id attribute of the input field
-     */
-    id: {
-      type: String,
-      required: !0
-    },
-    /**
-     * 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: (e) => f.includes(e)
-    },
-    /**
-     * 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: !1
-    },
-    /**
-     * Class to add to the input field.
-     * Necessary to use NcDateTimePickerNative in the NcActionInput component.
-     */
-    inputClass: {
-      type: [Object, String],
-      default: ""
-    }
-  },
-  emits: [
-    "input"
-  ],
-  computed: {
-    formattedValue() {
-      return this.formatValue(this.value);
-    },
-    formattedMin() {
-      return this.min ? this.formatValue(this.min) : !1;
-    },
-    formattedMax() {
-      return this.max ? this.formatValue(this.max) : !1;
-    },
-    listeners() {
-      return {
-        ...this.$listeners,
-        /**
-         * Handle the input event
-         *
-         * @param {InputEvent} $event input event payload
-         * @return {Date|string} new chosen Date() or an empty string
-         */
-        input: (e) => {
-          if (isNaN(e.target.valueAsNumber))
-            return this.$emit("input", null);
-          if (this.type === "time") {
-            const i = e.target.value;
-            if (this.value === "") {
-              const { yyyy: l, MM: o, dd: u } = this.getReadableDate(/* @__PURE__ */ new Date());
-              return this.$emit("input", /* @__PURE__ */ new Date(`${l}-${o}-${u}T${i}`));
-            }
-            const { yyyy: n, MM: s, dd: r } = this.getReadableDate(this.value);
-            return this.$emit("input", /* @__PURE__ */ new Date(`${n}-${s}-${r}T${i}`));
-          } else if (this.type === "month") {
-            const i = (new Date(e.target.value).getMonth() + 1).toString().padStart(2, "0");
-            if (this.value === "") {
-              const { yyyy: o, dd: u, hh: m, mm: c } = this.getReadableDate(/* @__PURE__ */ new Date());
-              return this.$emit("input", /* @__PURE__ */ new Date(`${o}-${i}-${u}T${m}:${c}`));
-            }
-            const { yyyy: n, dd: s, hh: r, mm: l } = this.getReadableDate(this.value);
-            return this.$emit("input", /* @__PURE__ */ new Date(`${n}-${i}-${s}T${r}:${l}`));
-          }
-          const t = new Date(e.target.valueAsNumber).getTimezoneOffset() * 1e3 * 60, a = e.target.valueAsNumber + t;
-          return this.$emit("input", new Date(a));
-        }
-      };
-    }
-  },
-  methods: {
-    /**
-     * Returns Object with string values of a Date
-     *
-     * @param {Date} value The selected value
-     * @return {object|undefined}
-     */
-    getReadableDate(e) {
-      if (e instanceof Date) {
-        const t = e.getFullYear().toString().padStart(4, "0"), a = (e.getMonth() + 1).toString().padStart(2, "0"), i = e.getDate().toString().padStart(2, "0"), n = e.getHours().toString().padStart(2, "0"), s = e.getMinutes().toString().padStart(2, "0");
-        return { yyyy: t, MM: a, dd: i, hh: n, mm: s };
-      }
-    },
-    /**
-     * Returns preformatted value for the input field
-     *
-     * @param {Date} value The selected value
-     * @return {string|undefined}
-     */
-    formatValue(e) {
-      if (e instanceof Date) {
-        const { yyyy: t, MM: a, dd: i, hh: n, mm: s } = this.getReadableDate(e);
-        if (this.type === "datetime-local")
-          return `${t}-${a}-${i}T${n}:${s}`;
-        if (this.type === "date")
-          return `${t}-${a}-${i}`;
-        if (this.type === "month")
-          return `${t}-${a}`;
-        if (this.type === "time")
-          return `${n}:${s}`;
-        if (this.type === "week") {
-          const r = new Date(t, 0, 1), l = Math.floor((e - r) / (24 * 60 * 60 * 1e3)), o = Math.ceil(l / 7);
-          return `${t}-W${o}`;
-        }
-      } else
-        return "";
-    }
-  }
-};
-var $ = function() {
-  var t = this, a = t._self._c;
-  return a("div", { staticClass: "native-datetime-picker" }, [a("label", { class: { "hidden-visually": t.hideLabel }, attrs: { for: t.id } }, [t._v(t._s(t.label))]), a("input", t._g(t._b({ staticClass: "native-datetime-picker--input", class: t.inputClass, attrs: { id: t.id, type: t.type, min: t.formattedMin, max: t.formattedMax }, domProps: { value: t.formattedValue } }, "input", t.$attrs, !1), t.listeners))]);
-}, g = [], _ = /* @__PURE__ */ p.normalizeComponent(
-  y,
-  $,
-  g,
-  !1,
-  null,
-  "992a6e31",
-  null,
-  null
-);
-const d = _.exports;
-/**
- * @copyright Copyright (c) 2022 Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>
- *
- * @author Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>
- *
- * @license AGPL-3.0-or-later
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- *
- */
-h.ScopeComponent(d);
-module.exports = d;
+"use strict";
+const e = require("../chunks/NcDateTimePickerNative-m30hv5MT.cjs");
+module.exports = e.NcDateTimePickerNative;

package/dist/Components/NcDateTimePickerNative.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcDateTimePickerNative.cjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue","../../src/components/NcDateTimePickerNative/index.js"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2022 Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n  -\n  - @author Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n  - @author Richard Steinmetz <richard@steinmetz.cloud>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\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</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\tv-on=\"listeners\">\n\t</div>\n</template>\n\n<script>\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default {\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\tvalue: {\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'input',\n\t],\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.value)\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\tlisteners() {\n\t\t\treturn {\n\t\t\t\t...this.$listeners,\n\t\t\t\t/**\n\t\t\t\t * Handle the input event\n\t\t\t\t *\n\t\t\t\t * @param {InputEvent} $event input event payload\n\t\t\t\t * @return {Date|string} new chosen Date() or an empty string\n\t\t\t\t */\n\t\t\t\tinput: ($event) => {\n\t\t\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @return {string} empty string\n\t\t\t\t\t\t */\n\t\t\t\t\t\treturn this.$emit('input', null)\n\t\t\t\t\t}\n\t\t\t\t\tif (this.type === 'time') {\n\t\t\t\t\t\tconst time = $event.target.value\n\t\t\t\t\t\tif (this.value === '') {\n\t\t\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.value)\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t */\n\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\t\t\tif (this.value === '') {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.value)\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t */\n\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t\t\t}\n\t\t\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\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('input', new Date(inputDateWithTimezone))\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\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</style>\n","/**\n * @copyright Copyright (c) 2022 Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n *\n * @author Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n *\n * @license AGPL-3.0-or-later\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU Affero General Public License as\n * published by the Free Software Foundation, either version 3 of the\n * License, or (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU Affero General Public License for more details.\n *\n * You should have received a copy of the GNU Affero General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n *\n */\n\nimport NcDateTimePickerNative from './NcDateTimePickerNative.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePickerNative)\n\nexport default NcDateTimePickerNative\n"],"names":["inputDateTypes","_sfc_main","name","$event","time","yyyy","MM","dd","hh","mm","timezoneOffsetSeconds","inputDateWithTimezone","value","startDate","daysSinceBeginningOfYear","weekNumber","ScopeComponent"],"mappings":"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"}
+{"version":3,"file":"NcDateTimePickerNative.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/Components/NcDateTimePickerNative.mjs

@@ -1,202 +1,4 @@
-import "../assets/index-8b327013.css";
-import { n as p } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
-import { S as c } from "../chunks/ScopeComponent-b039a43c.mjs";
-const f = ["date", "datetime-local", "month", "time", "week"], h = {
-  name: "NcDateTimePickerNative",
-  inheritAttrs: !1,
-  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.
-     */
-    value: {
-      type: Date,
-      default: null
-    },
-    /**
-     * id attribute of the input field
-     */
-    id: {
-      type: String,
-      required: !0
-    },
-    /**
-     * 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: (e) => f.includes(e)
-    },
-    /**
-     * 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: !1
-    },
-    /**
-     * Class to add to the input field.
-     * Necessary to use NcDateTimePickerNative in the NcActionInput component.
-     */
-    inputClass: {
-      type: [Object, String],
-      default: ""
-    }
-  },
-  emits: [
-    "input"
-  ],
-  computed: {
-    formattedValue() {
-      return this.formatValue(this.value);
-    },
-    formattedMin() {
-      return this.min ? this.formatValue(this.min) : !1;
-    },
-    formattedMax() {
-      return this.max ? this.formatValue(this.max) : !1;
-    },
-    listeners() {
-      return {
-        ...this.$listeners,
-        /**
-         * Handle the input event
-         *
-         * @param {InputEvent} $event input event payload
-         * @return {Date|string} new chosen Date() or an empty string
-         */
-        input: (e) => {
-          if (isNaN(e.target.valueAsNumber))
-            return this.$emit("input", null);
-          if (this.type === "time") {
-            const i = e.target.value;
-            if (this.value === "") {
-              const { yyyy: l, MM: o, dd: u } = this.getReadableDate(/* @__PURE__ */ new Date());
-              return this.$emit("input", /* @__PURE__ */ new Date(`${l}-${o}-${u}T${i}`));
-            }
-            const { yyyy: n, MM: s, dd: r } = this.getReadableDate(this.value);
-            return this.$emit("input", /* @__PURE__ */ new Date(`${n}-${s}-${r}T${i}`));
-          } else if (this.type === "month") {
-            const i = (new Date(e.target.value).getMonth() + 1).toString().padStart(2, "0");
-            if (this.value === "") {
-              const { yyyy: o, dd: u, hh: m, mm: d } = this.getReadableDate(/* @__PURE__ */ new Date());
-              return this.$emit("input", /* @__PURE__ */ new Date(`${o}-${i}-${u}T${m}:${d}`));
-            }
-            const { yyyy: n, dd: s, hh: r, mm: l } = this.getReadableDate(this.value);
-            return this.$emit("input", /* @__PURE__ */ new Date(`${n}-${i}-${s}T${r}:${l}`));
-          }
-          const t = new Date(e.target.valueAsNumber).getTimezoneOffset() * 1e3 * 60, a = e.target.valueAsNumber + t;
-          return this.$emit("input", new Date(a));
-        }
-      };
-    }
-  },
-  methods: {
-    /**
-     * Returns Object with string values of a Date
-     *
-     * @param {Date} value The selected value
-     * @return {object|undefined}
-     */
-    getReadableDate(e) {
-      if (e instanceof Date) {
-        const t = e.getFullYear().toString().padStart(4, "0"), a = (e.getMonth() + 1).toString().padStart(2, "0"), i = e.getDate().toString().padStart(2, "0"), n = e.getHours().toString().padStart(2, "0"), s = e.getMinutes().toString().padStart(2, "0");
-        return { yyyy: t, MM: a, dd: i, hh: n, mm: s };
-      }
-    },
-    /**
-     * Returns preformatted value for the input field
-     *
-     * @param {Date} value The selected value
-     * @return {string|undefined}
-     */
-    formatValue(e) {
-      if (e instanceof Date) {
-        const { yyyy: t, MM: a, dd: i, hh: n, mm: s } = this.getReadableDate(e);
-        if (this.type === "datetime-local")
-          return `${t}-${a}-${i}T${n}:${s}`;
-        if (this.type === "date")
-          return `${t}-${a}-${i}`;
-        if (this.type === "month")
-          return `${t}-${a}`;
-        if (this.type === "time")
-          return `${n}:${s}`;
-        if (this.type === "week") {
-          const r = new Date(t, 0, 1), l = Math.floor((e - r) / (24 * 60 * 60 * 1e3)), o = Math.ceil(l / 7);
-          return `${t}-W${o}`;
-        }
-      } else
-        return "";
-    }
-  }
-};
-var y = function() {
-  var t = this, a = t._self._c;
-  return a("div", { staticClass: "native-datetime-picker" }, [a("label", { class: { "hidden-visually": t.hideLabel }, attrs: { for: t.id } }, [t._v(t._s(t.label))]), a("input", t._g(t._b({ staticClass: "native-datetime-picker--input", class: t.inputClass, attrs: { id: t.id, type: t.type, min: t.formattedMin, max: t.formattedMax }, domProps: { value: t.formattedValue } }, "input", t.$attrs, !1), t.listeners))]);
-}, $ = [], g = /* @__PURE__ */ p(
-  h,
-  y,
-  $,
-  !1,
-  null,
-  "992a6e31",
-  null,
-  null
-);
-const D = g.exports;
-/**
- * @copyright Copyright (c) 2022 Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>
- *
- * @author Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>
- *
- * @license AGPL-3.0-or-later
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- *
- */
-c(D);
+import { N as f } from "../chunks/NcDateTimePickerNative-nDQjZSiZ.mjs";
 export {
-  D as default
+  f as default
 };

package/dist/Components/NcDateTimePickerNative.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcDateTimePickerNative.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue","../../src/components/NcDateTimePickerNative/index.js"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2022 Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n  -\n  - @author Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n  - @author Richard Steinmetz <richard@steinmetz.cloud>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\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</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\tv-on=\"listeners\">\n\t</div>\n</template>\n\n<script>\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default {\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\tvalue: {\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'input',\n\t],\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.value)\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\tlisteners() {\n\t\t\treturn {\n\t\t\t\t...this.$listeners,\n\t\t\t\t/**\n\t\t\t\t * Handle the input event\n\t\t\t\t *\n\t\t\t\t * @param {InputEvent} $event input event payload\n\t\t\t\t * @return {Date|string} new chosen Date() or an empty string\n\t\t\t\t */\n\t\t\t\tinput: ($event) => {\n\t\t\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @return {string} empty string\n\t\t\t\t\t\t */\n\t\t\t\t\t\treturn this.$emit('input', null)\n\t\t\t\t\t}\n\t\t\t\t\tif (this.type === 'time') {\n\t\t\t\t\t\tconst time = $event.target.value\n\t\t\t\t\t\tif (this.value === '') {\n\t\t\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.value)\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t */\n\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\t\t\tif (this.value === '') {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.value)\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t */\n\t\t\t\t\t\treturn this.$emit('input', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t\t\t}\n\t\t\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\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('input', new Date(inputDateWithTimezone))\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\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</style>\n","/**\n * @copyright Copyright (c) 2022 Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n *\n * @author Julia Kirschenheuter <julia.kirschenheuter@nextcloud.com>\n *\n * @license AGPL-3.0-or-later\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU Affero General Public License as\n * published by the Free Software Foundation, either version 3 of the\n * License, or (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU Affero General Public License for more details.\n *\n * You should have received a copy of the GNU Affero General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n *\n */\n\nimport NcDateTimePickerNative from './NcDateTimePickerNative.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePickerNative)\n\nexport default NcDateTimePickerNative\n"],"names":["inputDateTypes","_sfc_main","name","$event","time","yyyy","MM","dd","hh","mm","timezoneOffsetSeconds","inputDateWithTimezone","value","startDate","daysSinceBeginningOfYear","weekNumber","ScopeComponent","NcDateTimePickerNative"],"mappings":"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"}
+{"version":3,"file":"NcDateTimePickerNative.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}