search

canonical / react-components

A set of components based on Vanilla Framework
https://canonical.github.io/react-components
102 stars 55 forks source link

Investigate components composition patterns #774

Open petermakowski opened 2 years ago

petermakowski commented 2 years ago

@huwshimi @petermakowski it seems this PR leans into being a discussion about how we approach props API in our components. The more complex the component gets (like MainTable, this navigation, etc) the harder it is to pass all needed data as props and maintain flexibility that we are used to with Vanilla (being able to adjust HTML structure, class names, etc).

I'm starting to think that the way MUI approaches it (by using the composable child components) seems to be more flexible in this regard (for example: https://mui.com/material-ui/react-bottom-navigation/).

I feel that we had a similar discussion in the past (when Modular Table was started maybe?), but I don't remember where it landed.

I don't know what's the best approach, but the more complicated "items" props will be the harder it will be to use it or maintain in future. Or maybe some compromise would be to have a set of smaller composable components (NavigationBar, NavigationItems, NavigationSearch, etc) that you can use to custom build any "non standard" configuration for navigation, but we also provide MainNavigation component that you just pass props to that should cover most cases - kind of similar to what we have with MainTable being a controller component for Table/TableRow/TableCell, etc…

_Originally posted by @bartaz in https://github.com/canonical-web-and-design/react-components/pull/767#discussion_r865855599_

bartaz commented 3 weeks ago

Triage: architecture level decision that should be revisited in new architecture of design system.