Javascript apparently not working when working with Svelte Kit and Carbon components svelte UI library

Question

After failing to implement svelte kit with carbon components myself, I copied the example from the project github examples folder. Now importing base carbon components works, but they are not interactive. For example the DatePicker widget should display calendar widget after being clicked and it simply does not in my app.

After failing to implement svelte kit with carbon components myself, I copied the example from the project github examples folder

+page.svelte:

<script>
    import DatePicker from "carbon-components-svelte/src/DatePicker/DatePicker.svelte";
    import DatePickerInput from "carbon-components-svelte/src/DatePicker/DatePickerInput.svelte";
</script>
<DatePicker datePickerType="single" on:change>
    <DatePickerInput labelText="Meeting date" placeholder="mm/dd/yyyy" />
</DatePicker>

first picture is current state on my local machine, when the widget is being clicked, nothing happnes second picture shows desired behaviour

Answer 1

[SOLVED]

I simply updated all my dependencies to latest version by specifying each dependency version like this "*" and then ran:

npm update --save

this is how my package.json looks like currently:

{
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite dev",
    "build": "vite build",
    "preview": "vite preview"
  },
  "devDependencies": {
    "@sveltejs/kit": "^1.11.0",
    "carbon-components-svelte": "^0.73.2",
    "carbon-pictograms-svelte": "^12.3.0",
    "carbon-preprocess-svelte": "^0.9.1",
    "svelte": "^3.56.0",
    "vite": "^4.1.4"
  }
}