Merge pull request #861 from nextcloud/dependabot/npm_and_yarn/vue2-d…

…atepicker-3.3.1

package.json

@@ -45,7 +45,7 @@
 		"vue-color": "^2.7.0",
 		"vue-multiselect": "^2.1.3",
 		"vue-visible": "^1.0.2",
-		"vue2-datepicker": "^2.10.0"
+		"vue2-datepicker": "^3.3.1"
 	},
 	"engines": {
 		"node": ">=10.0.0"

src/components/DatetimePicker/DatetimePicker.vue

@@ -42,9 +42,12 @@
 <template>
 	<DatePicker
 		ref="datepicker"
-		:clearable="false"
-		:minute-step="10"
+		:clearable="clearable"
+		:minute-step="minuteStep"
+		:format="format"
+		:type="type"
 		:value="value"
+		:append-to-body="false"
 		v-bind="$attrs"
 		v-on="$listeners"
 		@select-year="handleSelectYear"
@@ -57,15 +60,7 @@
 </template>
 
 <script>
-import DatePicker from 'vue2-datepicker/lib/datepicker'
-
-/**
- * remove leading zeros on hours and minutes
- * https://github.com/mengxiong10/vue2-datepicker/blob/65c5762227649430f14158c01401a8486a881336/src/panel/time.js#L38
- */
-DatePicker.components.CalendarPanel.components.PanelTime.methods.stringifyText = function(data) {
-	return data
-}
+import DatePicker from 'vue2-datepicker'
 
 /**
  * hijack the display function and avoid the
@@ -89,6 +84,40 @@ export default {
 	inheritAttrs: false,
 
 	props: {
+		clearable: {
+			type: Boolean,
+			default() {
+				return false
+			}
+		},
+
+		minuteStep: {
+			type: Number,
+			default() {
+				return 10
+			}
+		},
+
+		type: {
+			type: String,
+			default: 'date'
+		},
+
+		format: {
+			type: [String, Object],
+			default() {
+				const map = {
+					date: 'YYYY-MM-DD',
+					datetime: 'YYYY-MM-DD H:mm:ss',
+					year: 'YYYY',
+					month: 'YYYY-MM',
+					time: 'H:mm:ss',
+					week: 'w'
+				}
+				return map[this.type] || map.date
+			}
+		},
+
 		// eslint-disable-next-line
 		value: {
 			default() {