Thanks a lot for a such cool video. But I have a question: how to prototype date components in a way that will allow me to pick one day then click on another and the previous will not be active anymore? I have to turn each day in radio button? Hope that makes sense😄
Thanks Esequiel, I appreciate it! You mean whether this component will make it in Chakra UI? Not that I'm aware of, but they're working on a bunch of other amazing things at the moment.
@@JaviAlaves I am working on a prototype that include multiple overlays. I want to show first overlay and then the second overlay. First overlay still appears behind the second overlay. I need to hide first overlay. Thanks for advance.
@@irfanali-cr6up Could you send me a screen capture of what you're working on, or a share a Figma file with me? Feel free to direct message me on Twitter and I'll be happy to help you - twitter.com/javalaves
ehhhhhhhhhhhm I expected to see it get implemented in code.... Preferably with @chakra-ui/react. How is this design "for Chakra UI"? its just a Figma design, it leaves the implementation open. I am very disappointed tbh, 30 min wasted. The video title is missleading, if it said "how to create datepicker Figma design" I wouldn't have watched.
The interesting / hard part about creating a custom datepicker is not the design. As a beginner I can tell you that its the component choice within a new library that makes the implementation hard. If I just use for everything its fairly easy to style them and get my expected Result. The hard choice is to decide if you wanna use for example an input field with a table or a grid or just , , ..... There are so many different ways to implement the design you have created with Chakra UI and thats whats overwhelming for beginners. Let's be real everyone knows how a datepicker should look.... Even for creating a simple Form there are like 20+ ways to create it within chakra-ui. Choosing one that makes sense is what makes it hard!
Just saw the work file on figma community, seems like month selection is missing when the year was there!
Thanks a lot for a such cool video.
But I have a question: how to prototype date components in a way that will allow me to pick one day then click on another and the previous will not be active anymore? I have to turn each day in radio button?
Hope that makes sense😄
Needed more info on the interactive components setup
Great walkthrough of your process loved it
Thank you, I'm glad it was helpful!
I just leave a comment on other video but you rock mate! Thanks for sharing this ⚡
would you know how to make an event calendar?
Hi Javier, thank you for the tutorial. Do you have one where you share how to animate the calendar? (next step)?
Thank you
yep, like this is great, but the actual big deal is how to actually set up the prototype 😅
Can you share that design spec doc, please?
You're a life saver thanks 🙌🙌❤
I'm not a designer and yet loved your video man, really sick.
Is there anyone working on implementing this feature?
Thanks Esequiel, I appreciate it! You mean whether this component will make it in Chakra UI? Not that I'm aware of, but they're working on a bunch of other amazing things at the moment.
great content!
Thank you, I appreciate it!
Thanks!
Did you work on multiple overlays ? I am facing an issue.
Where did you get stuck specifically?
@@JaviAlaves I am working on a prototype that include multiple overlays. I want to show first overlay and then the second overlay. First overlay still appears behind the second overlay. I need to hide first overlay.
Thanks for advance.
@@irfanali-cr6up Could you send me a screen capture of what you're working on, or a share a Figma file with me? Feel free to direct message me on Twitter and I'll be happy to help you - twitter.com/javalaves
Love it
Great thank you, please can you share the design file of the component ?
Yes! It’s available in my Figma Community profile at figma.com/@javi
@@JaviAlaves Thank you very much ❤
How do i get the code please?
This component hasn't been coded by the Chakra UI team, but you can make a request on their GitHub repos :)
when i downloaded my date picker, it gave me a blanked Art Board with nothing in it. how can i solve that problem ? @javier alves
ehhhhhhhhhhhm I expected to see it get implemented in code.... Preferably with @chakra-ui/react. How is this design "for Chakra UI"? its just a Figma design, it leaves the implementation open. I am very disappointed tbh, 30 min wasted. The video title is missleading, if it said "how to create datepicker Figma design" I wouldn't have watched.
The interesting / hard part about creating a custom datepicker is not the design. As a beginner I can tell you that its the component choice within a new library that makes the implementation hard. If I just use for everything its fairly easy to style them and get my expected Result. The hard choice is to decide if you wanna use for example an input field with a table or a grid or just , , ..... There are so many different ways to implement the design you have created with Chakra UI and thats whats overwhelming for beginners. Let's be real everyone knows how a datepicker should look.... Even for creating a simple Form there are like 20+ ways to create it within chakra-ui. Choosing one that makes sense is what makes it hard!
How do you add the fonts and colours to your library? I’m new to Figma 🫣