From 5772cf7483f398fddba818bfabb8535c3a9f00d2 Mon Sep 17 00:00:00 2001
From: Dominik Pschenitschni <mail@celement.de>
Date: Mon, 24 Oct 2022 16:40:57 +0200
Subject: [PATCH] feat: move config preparation in separate function

---
 src/components/misc/flatpickr/Flatpickr.vue | 28 +++++++++++++--------
 1 file changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/components/misc/flatpickr/Flatpickr.vue b/src/components/misc/flatpickr/Flatpickr.vue
index 948007ce4..bbfea8600 100644
--- a/src/components/misc/flatpickr/Flatpickr.vue
+++ b/src/components/misc/flatpickr/Flatpickr.vue
@@ -84,7 +84,7 @@ const props = defineProps({
 		// 	);
 		// }
 	},
-	// https://chmln.github.io/flatpickr/options/
+	// https://flatpickr.js.org/options/
 	config: {
 		type: Object as PropType<Options>,
 		default: () => ({
@@ -117,17 +117,10 @@ const root = ref<HTMLInputElement | null>(null)
 const fp = ref<Flatpickr.Instance | null>(null)
 const safeConfig = ref<Options>(cloneObject(props.config))
 
-onMounted(() => {
+function prepareConfig() {
 	// Don't mutate original object on parent component
 	const newConfig = cloneObject(props.config)
 
-	if (
-		fp.value || // Return early if flatpickr is already loaded
-		!root.value // our input needs to be mounted
-	) {
-		return
-	}
-
 	props.events.forEach((hook) => {
 		// Respect global callbacks registered via setDefault() method
 		const globalCallbacks = Flatpickr.defaultConfig[hook] || []
@@ -155,6 +148,19 @@ onMounted(() => {
 
 	safeConfig.value = newConfig
 
+	return safeConfig.value
+}
+
+onMounted(() => {
+	if (
+		fp.value || // Return early if flatpickr is already loaded
+		!root.value // our input needs to be mounted
+	) {
+		return
+	}
+
+	prepareConfig()
+
 	/**
 	* Get the HTML node where flatpickr to be attached
 	* Bind on parent element if wrap is true
@@ -225,8 +231,8 @@ watch(
 	newValue => {
 		// Prevent updates if v-model value is same as input's current value
 		if (!root.value || newValue === nullify(root.value.value)) return
-		// Make sure we have a flatpickr instanceand
-		// Notify flatpickr instance that there is a change in value
+		// Make sure we have a flatpickr instance and
+		// notify flatpickr instance that there is a change in value
 		fp.value?.setDate(newValue, true)
 	},
 	{deep: true},