Coder Social home page Coder Social logo

Comments (5)

cenkSengunlu avatar cenkSengunlu commented on June 8, 2024 1

I suspect it might be something with how things are configured, I just started up a new repo using latest chakra and chakra-ui-steps and it all seems to be working as expected:

https://stackblitz.com/edit/vitejs-vite-gcwrmp

How have you configured the theme? And could you maybe share how you're using the steps component?

It is working but It shouldn't have onClick event in 'Basic' version. When you click on the steps colors are change like it is 'Clickable' version.

from chakra-ui-steps.

jeanverster avatar jeanverster commented on June 8, 2024

Hey @Martinnord - what version of chakra-ui-steps do you have installed?

from chakra-ui-steps.

Martinnord avatar Martinnord commented on June 8, 2024

I have 1.8.0 installed. When I tried upgrading to chakra 2.5.4 it broke the styles. I downgraded chakra to 2.4.0 then it started working again.

I tried upgrading chakra-ui-steps to 2.1.0 and using it with chakra 2.5.4, but that also broke the styles.

Now I'm running chakra with 2.4.0 and chakra-ui-steps with 1.8.0 and it works good.

from chakra-ui-steps.

jeanverster avatar jeanverster commented on June 8, 2024

I suspect it might be something with how things are configured, I just started up a new repo using latest chakra and chakra-ui-steps and it all seems to be working as expected:

https://stackblitz.com/edit/vitejs-vite-gcwrmp

How have you configured the theme? And could you maybe share how you're using the steps component?

from chakra-ui-steps.

BustosAndrew avatar BustosAndrew commented on June 8, 2024

@jeanverster I think you should also update the framer motion dependency since it's complaining about my project not having version 7. I have it as version 10.

`

npm ERR! code ERESOLVE

15:41:07.909 | npm ERR! ERESOLVE could not resolve
15:41:07.909 | npm ERR!
15:41:07.910 | npm ERR! While resolving: [email protected]
15:41:07.910 | npm ERR! Found: [email protected]
15:41:07.910 | npm ERR! node_modules/framer-motion
15:41:07.910 | npm ERR! framer-motion@"^10.6.0" from the root project
15:41:07.910 | npm ERR! peer framer-motion@">=4.0.0" from @chakra-ui/[email protected]
15:41:07.910 | npm ERR! node_modules/@chakra-ui/accordion
15:41:07.910 | npm ERR! @chakra-ui/accordion@"2.1.11" from @chakra-ui/[email protected]
15:41:07.910 | npm ERR! node_modules/@chakra-ui/react
15:41:07.911 | npm ERR! @chakra-ui/react@"^2.5.2" from the root project
15:41:07.911 | npm ERR! 1 more (chakra-ui-steps)
15:41:07.911 | npm ERR! 8 more (@chakra-ui/menu, @chakra-ui/modal, @chakra-ui/popover, ...)
15:41:07.911 | npm ERR!
15:41:07.911 | npm ERR! Could not resolve dependency:
15:41:07.911 | npm ERR! peer framer-motion@"^7.0.0" from [email protected]
15:41:07.911 | npm ERR! node_modules/chakra-ui-steps
15:41:07.911 | npm ERR! chakra-ui-steps@"^2.1.0" from the root project
15:41:07.911 | npm ERR!
15:41:07.911 | npm ERR! Conflicting peer dependency: [email protected]
15:41:07.911 | npm ERR! node_modules/framer-motion
15:41:07.911 | npm ERR! peer framer-motion@"^7.0.0" from [email protected]
15:41:07.911 | npm ERR! node_modules/chakra-ui-steps
15:41:07.911 | npm ERR! chakra-ui-steps@"^2.1.0" from the root project
15:41:07.912 | npm ERR!
15:41:07.912 | npm ERR! Fix the upstream dependency conflict, or retry
15:41:07.912 | npm ERR! this command with --force, or --legacy-peer-deps
15:41:07.912 | npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

`

from chakra-ui-steps.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.