In Frappe-ui DatePicker is not working as expected. How to fix it?

Screenshot from 2024-07-17 17-52-08

unable to set the date on field

<templete>
  <DatePicker
                variant="subtle"
                placeholder="create date"
                :disabled="false"
                label="Create Date"
            
            />
</templete>
  <script setup>
  import { Dialog, FormControl, TextEditor, DatePicker} from 'frappe-ui';
</script>