Handling date picker properties in Vue JS

Describe the bug Thank you very much for all your hard work, this date picker is incredibly neat!

I’ve been trying to implement this date picker into a Vue JS project. I’m a bit new and as I understand from your documentation, in order to use the properties of duet date picker (e.g. Localization, dateAdapter, direction, etc.) I need to override their defaults. I’ve been trying to add them as props to my component but so far no luck. Is this a bug or just a gap on my own understanding?

To Reproduce Steps to reproduce the behavior:

1. Create a Vue component that uses duet date picker
2. Pass localization object as a prop

Expected behavior I expect the placeholder to change it’s label from “YYYY-MM-DD” to “DD/MM/YYYY”

Desktop (please complete the following information):

• OS: Catalina 10.5.15
• Browser: [Chrome, FF, IE11, Safari]
• Version: Duet date-picker version 1.0.1

Additional context Component in case:

  <duet-date-picker 
    ref="date-picker"
    identifier="date"
    direction="left"
    :value="enteredDate"
    v-bind:class="{'has-error': hasErrors}"
    v-bind:required="isRequired"
    :name="name"
    :localization="{placeholder: 'DD/MM/YYYY'}"
    :dateAdapter="format_date()"
    @duetChange="dateChanged"
  />

[RiqueBR]

Hey @viljamis @WickyNilliams, thank you so much for this! I’ll send a wee update of the docs to reflect this at some point this week.

[viljamis]

@WickyNilliams @RiqueBR The first issue I see here is that you can’t change just one value inside the localization object. You need to pass in the whole object for things to work. Please see the last example on this page: https://duetds.github.io/date-picker/