unovue / shadcn-vue

Vue port of shadcn-ui
https://www.shadcn-vue.com/
MIT License
4.79k stars 274 forks source link

[Feature]: Resizable component (Splitpane) #238

Closed wasimTQ closed 7 months ago

wasimTQ commented 9 months ago

Describe the feature

Part of #220

Additional information

sadeghbarati commented 9 months ago

a years ago 👽😪

Maybe we could use @ark-ui/vue Splitter If it's headless and tree-shakable?

I saw some projects that were based on the main shadcn-ui uses Material UI Base UI for some components that not yet existed in shadcn-ui

O god why Material UI has Base UI but Vuetify hasn't 😬


Anthony Fu worked on the same thing with SplitPanes but he disabled the Splitpanes Trigger with a CSS workaround

https://www.youtube.com/live/IJ27LUb6BAo?si=dUuEH2nGboEIidmB&t=1424

wasimTQ commented 9 months ago

Splitpanes has more features than any other projects tho.

But the problem is it's not currently maintained.

I thought maybe we can fork it.

wasimTQ commented 9 months ago

I'll play with both this and splitpanes to see which one fits best in a project and which one has more features.

wasimTQ commented 9 months ago

@sadeghbarati I was able to get the functionality ready with splitpanes but with ark-ui/vue not so much luck.

You can check it out here https://github.com/wasimTQ/shadcn-vue/tree/feature/resizable/apps/www/src/lib/registry/default/ui/resizable.

In the branch feature/resizable

wasimTQ commented 9 months ago

@sadeghbarati If possible can you play around with ark-ui splitter component. And tell me your thoughts. As far as I worked with it, I couldn't get the exact implementations as the docs

sadeghbarati commented 9 months ago

Go with SplitPane then if you think that is better?

I'll check your branch, Thanks

wasimTQ commented 9 months ago

Problem is Splitpane don't have typescript support. Other than that, it's pretty good for our usecase

sadeghbarati commented 9 months ago

Let's fork it and build it with TypeScript support, are you in? I can help

wasimTQ commented 9 months ago

I'm in. Let's do it.

wasimTQ commented 9 months ago

Shall we merge it as it is for now? I can make all the changes look like the shadcn's resizable

sadeghbarati commented 9 months ago

Why not both 🤪 idk

Btw if we want to include both, we have to discuss with other maintainers

wasimTQ commented 9 months ago

@sadeghbarati Let's discuss whether we should merge it with the current implementation that is without Typescript support for the package.

We already added custom types for props. So I guess that should be enough already.

The @types/splitpanes package is not compatible with version 3.5.*. But it's not much of an issue now.

I'll fork the repo and add typescript support and some additional functionality like accessibility that's not built in.

How it sounds?

sadeghbarati commented 9 months ago

@wasimTQ

There is no rush just here to say if you fork the project You can add me

I can take Bundling Task with unbuild or rollup or bunchee or tsup or any other good bundlers

wasimTQ commented 8 months ago

@sadeghbarati I was little busy with my job. So I couldn't focus on it more. I did clone the project and saw how I can improve it.

The code is currently written using options API. And I want to change it to composition api and cleanup some code for better readability. And change the documentation to vite.

It'll take some time. I'll add you to the repo once I forked it.

In the meantime, let me know if I can help with any other components. Maybe small fix works.

sadeghbarati commented 8 months ago

Wow that a nice of you

We are all on the same page so go for it when you have free time thanks 💯

zernonia commented 8 months ago

Do ping me @wasimTQ @sadeghbarati when the forked project is ready ya 😁 We can publish it under custom npm scope 😉