marekrozmus / react-swipeable-list

Swipeable list component for React supporting several behaviours (e.g. iOS)
https://marekrozmus.github.io/react-swipeable-list/
MIT License
110 stars 20 forks source link

Add classname prop for elements #9

Closed rathesDot closed 3 years ago

rathesDot commented 3 years ago

Hey 👋🏾

first of all, I want to thank you for this awesome package that you have created here! I've been searching for a while to find a package that could replace my custom implementation and I think that your package here is really well done!

Is your feature request related to a problem? Please describe. The only thing that I find a bit hard to follow is how to customize the com. It looks like, I can not add custom class names to these components.

Describe the solution you'd like Would be nice if could add className as props for each component and append them to the class names that you are already using. If I understood the code base correctly, you use clsx already, so adding that option should be a big issue, is it?

Describe alternatives you've considered Alternatively, I could make use of the style option and for the items, I have to add extra elements as children. However, when trying to use this component within an existing design system and component library, it's not really supporting the DX when you have to hard-code values like colours or spacings

Additional context

What I am trying to achieve is that I use the elements in this package and re-export them in our component library with the existing styles applied already.

So the developer would use something like

<SwipeableList.Root> which them should be <SwipeableList fullSwipe={false} type={ListType.IOS} className="styles-from-my-design-system">

marekrozmus commented 3 years ago

Hi :) Thank you for kind worlds, I'm glad you like it and find it useful. I'll take a look at this issue this week and hopefully deliver a new version at the end of the week.

rathesDot commented 3 years ago

Perfect, thanks for your quick feedback! Let me know if you need some more context about this. Happy to elaborate on it!

marekrozmus commented 3 years ago

Please check if this is what you need or something more is required :) https://github.com/marekrozmus/react-swipeable-list/pull/10/files

rathesDot commented 3 years ago

Looks good to me!

marekrozmus commented 3 years ago

@all-contributors please add @rathesDot for ideas

allcontributors[bot] commented 3 years ago

@marekrozmus

I've put up a pull request to add @rathesDot! :tada:

marekrozmus commented 3 years ago

@rathesDot new release is ready. Let me know if that solves your problem. Please share some screenshots or GIFs of what you have built with this library (if you want :)) - I'm planning to make some gallery page :)

rathesDot commented 3 years ago

Amazing work @marekrozmus! Will try to implement these changes this weekend and I'll post some images here!