Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expose the AllProps and PickerBaseProps objects #1032

Open
DenisLantero opened this issue Nov 5, 2024 · 1 comment
Open

Expose the AllProps and PickerBaseProps objects #1032

DenisLantero opened this issue Nov 5, 2024 · 1 comment
Labels
enhancement New feature or request

Comments

@DenisLantero
Copy link

Describe the problem that you have
I am trying to create a rapper to VueDatePicker, the issue that I'm having is that as soon as I use Vue's withDefaults and defineProps, and v-bind the props objects to VueDatePicker, I rightfully lose the default values of the props, like this:

<template>
  <VueDatePicker
    v-bind="props"
    v-model="date"
  />
</template>

<script setup lang="ts">
import type { ModelValue as DatePickerModelValue, VueDatePickerProps } from '@vuepic/vue-datepicker'
import VueDatePicker from '@vuepic/vue-datepicker'
import '@vuepic/vue-datepicker/dist/main.css'

const props = withDefaults(defineProps<VueDatePickerProps>(), {
})

const date = defineModel<DatePickerModelValue>('')
</script>

It would be nice to have them available somewhere, either via exports or via the VueDatePicker exposes.

Describe the solution you'd like
I noticed that there are already 2 objects defined in your source code that define the defaults for the component, AllProps and PickerBaseProps.
The problem is that you don't export them in entry.esm.ts, and, when we install the package, the source code isn't included, therefore I don't have a real way to access these objects.

You could either export those and any other useful constants/objects in the entry.esm.ts file, include the source code in the npm registry, or expose them using Vue's defineExpose in VueDatePicker, as you are already doing for the following methods:

    defineExpose({
        closeMenu,
        selectDate,
        clearValue,
        openMenu,
        onScroll,
        formatInputValue, // exposed for testing purposes
        updateInternalModelValue, // modify internal modelValue
        setMonthYear,
        parseModel,
        switchView,
        toggleMenu,
        handleFlow,
        dpWrapMenuRef,
    });

Describe alternatives you've considered
I already tried the following, but nothing worked:

1:

const props = withDefaults(defineProps<VueDatePickerProps>(), {
  ...VueDatePicker.props
})
TypeError: parent.insertBefore is not a function

2:

const props = withDefaults(defineProps<VueDatePickerProps>(), {
  ...new VueDatePicker().$options.props,
})
 VueDatePicker is not a constructor

Are there any other ways to do this, without changing the library that might work? Please let me know, thanks

@DenisLantero DenisLantero added awaiting triage The issue is not reviewed by the maintainers enhancement New feature or request labels Nov 5, 2024
@DenisLantero
Copy link
Author

DenisLantero commented Nov 5, 2024

For anyone wondering, the workaround is this:

const props = withDefaults(defineProps<BsdkNewDatePickerProps>(), {
  ...Object.entries(VueDatePicker.props).reduce((acc, [key, prop]: any[]) => {
    acc[key] = prop.default
    return acc
  }, {} as Record<string, any>),
  
  // Redifine all the props' defaults here
  enableTimePicker: false,
})

Still, it would be nice to have access to those interfaces, or to the source code directly

@Jasenkoo Jasenkoo removed the awaiting triage The issue is not reviewed by the maintainers label Dec 25, 2024
Jasenkoo added a commit that referenced this issue Jan 3, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants