Fixs for svelte4

[splimter]

• Fixing Modal
• Fixing the .d.ts files

[LoopControl]

When I do npm install 'git+https://github.com/bestguy/sveltestrap.git#pull/574/head' to install from this pull request, I'm getting the following error:

npm ERR! Found: svelte@4.2.1
npm ERR! node_modules/svelte
npm ERR!   dev svelte@"^4.0.5" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer svelte@"^3.53.1" from sveltestrap@5.11.2
npm ERR! node_modules/sveltestrap
npm ERR!   sveltestrap@"git+https://github.com/bestguy/sveltestrap.git#pull/574/head" from the root project

Looks like this PR needs a package.json update to change the svelte dependency to 4.x?

[LoopControl]

Still getting error after the 3 commits above. When I --force the install it works with this error:

npm WARN using --force Recommended protections disabled.
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: sveltestrap@5.11.2
npm WARN Found: svelte@4.2.1
npm WARN node_modules/svelte
npm WARN   peer svelte@"^3.54.0 || ^4.0.0-next.0" from @sveltejs/kit@1.25.0
npm WARN   node_modules/@sveltejs/kit
npm WARN     peer @sveltejs/kit@"^1.0.0" from @sveltejs/adapter-auto@2.1.0
npm WARN     node_modules/@sveltejs/adapter-auto
npm WARN     1 more (the root project)
npm WARN   9 more (@sveltejs/vite-plugin-svelte, ...)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer svelte@"^3.53.1" from sveltestrap@5.11.2
npm WARN node_modules/sveltestrap
npm WARN   sveltestrap@"git+https://github.com/bestguy/sveltestrap.git#pull/574/head" from the root project
npm WARN 
npm WARN Conflicting peer dependency: svelte@3.59.2
npm WARN node_modules/svelte
npm WARN   peer svelte@"^3.53.1" from sveltestrap@5.11.2
npm WARN   node_modules/sveltestrap
npm WARN     sveltestrap@"git+https://github.com/bestguy/sveltestrap.git#pull/574/head" from the root project

[splimter]

Hi @LoopControl thank you for checking our work. Please try with --legacy-peer-deps, it did the trick for me.

[splimter]

Hello @LoopControl please disregard my last message, and try again.

[benmccann]

Thanks for this!!

[milansimek]

@splimter I think the peer dependency version also needs to be updated in package.json?

Right now only v3 is added:

  "peerDependencies": {
    "svelte": "^3.53.1"
  },

Most likely it needs to be updated the same as the dev dependency?

"svelte": "^3.53.1 || ^4.2.1"

[milansimek]

@splimter Created pull request: https://github.com/edraj/sveltestrap/pull/1

Can confirm installing without --legacy-peer-deps works after this change

[kefahi]

Thank you @milansimek !

@splimter I have merged the pull request against our main PR.

Kindly let me know if there is any known issues left on this front. (e..g upgrading any other dependencies)

[benmccann]

Hmm. It looks like this project doesn't run the CI against PRs. Can you update the file in the .github directory to include the following?

on:
  push:
    branches:
      - master
  pull_request:

I suspect this PR will need some changes to avoid breaking the tests, but I can't tell if they're passing or not until we run them

[kefahi]

Hello @benmccann Thank you for your input. I made a number of changes and upgrades to make it work. The CI now runs successfully.

[wilmardo]

Thanks for the work on this PR! For me the modal isn't working yet, it shows up (better then the main branch). But it has no close icon and does not close when clicking next to the Modal.

Just my first Svelte project so I have no clue how to debug this further. I just copied the example Modal from the docs :)

[splimter]

hi @wilmardo thanks for the feedback, please make sure that the toggle prop is on both Modal and ModalHeader, lemme know if that did solve your issue.

[georgeemr]

Can confirm this works on my current project.

[SoyaNyan]

I've tested this PR from our Sveltekit (Svelte4) project and there is no issue related to both modal and offcanvas. Have to test more for completely migrate, but still looks good to me.

[vdp641]

Hi, how long this PR will be merged? The modal is currently not working. I cannot use sveltestrap with Svelte 4 on cloud CI/CD. I only fixed it in local env but in the cloud it always gets the not-working version.

[splimter]

Hello @vdp641 , what is the issue that you are facing with the modal.

[vdp641]

@splimter hi, in the current version of sveltestrap, with Svelte 4, that does not fix the issue with global transition in Modal.svelte. It leads to Modal not opened. This PR will fix this issue, but it has not been merged yet.