vikunja
/
frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

feat: align with vue-flatpickr-component 10

This commit is contained in:
Dominik Pschenitschni 2022-10-24 16:52:38 +02:00
parent 5772cf7483
commit 2316fa3a46
Signed by: dpschen
GPG Key ID: B257AC0149F43A77
1 changed files with 11 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/misc/flatpickr/Flatpickr.vue
View File

@ -9,15 +9,15 @@
</template>
<script lang="ts">
import Flatpickr from 'flatpickr'
import flatpickr from 'flatpickr'
import 'flatpickr/dist/flatpickr.css'
// FIXME: Not sure how to alias these correctly
// import Options = Flatpickr.Options doesn't work
type Hook = Flatpickr.Options.Hook
type HookKey = Flatpickr.Options.HookKey
type Options = Flatpickr.Options.Options
type DateOption = Flatpickr.Options.DateOption
type Hook = flatpickr.Options.Hook
type HookKey = flatpickr.Options.HookKey
type Options = flatpickr.Options.Options
type DateOption = flatpickr.Options.DateOption
function camelToKebab(string: string) {
return string.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()
@ -35,10 +35,6 @@ function nullify<T = unknown>(value: T) {
: null
}
function cloneObject<T = Record<string, unknown>>(obj: T): T {
return Object.assign({}, obj)
}
// Events to emit, copied from flatpickr source
const includedEvents = [
'onChange',
@ -88,8 +84,8 @@ const props = defineProps({
config: {
type: Object as PropType<Options>,
default: () => ({
wrap: false,
defaultDate: null,
wrap: false,
}),
},
events: {
@ -114,16 +110,16 @@ const {modelValue, config, disabled} = toRefs(props)
const attrs = useAttrs()
const root = ref<HTMLInputElement | null>(null)
const fp = ref<Flatpickr.Instance | null>(null)
const safeConfig = ref<Options>(cloneObject(props.config))
const fp = ref<flatpickr.Instance | null>(null)
const safeConfig = ref<Options>({ ...props.config })
function prepareConfig() {
// Don't mutate original object on parent component
const newConfig = cloneObject(props.config)
const newConfig: Options = { ...props.config }
props.events.forEach((hook) => {
// Respect global callbacks registered via setDefault() method
const globalCallbacks = Flatpickr.defaultConfig[hook] || []
const globalCallbacks = flatpickr.defaultConfig[hook] || []
// Inject our own method along with user callback
const localCallback: Hook = (...args) => emit(camelToKebab(hook), ...args)
@ -170,7 +166,7 @@ onMounted(() => {
: root.value
// Init flatpickr
fp.value = Flatpickr(element, safeConfig.value)
fp.value = flatpickr(element, safeConfig.value)
})
onBeforeUnmount(() => fp.value?.destroy())