carbon-design-system / ibm-products

A Carbon-powered React component library for IBM Products
https://ibm-products.carbondesignsystem.com
Apache License 2.0
97 stars 137 forks source link

Delivering utilities ☂️ #6157

Open davidmenendez opened 3 weeks ago

davidmenendez commented 3 weeks ago

Some components, patterns, and tooling has the potential to be (re)categorized as a "utility", which is something we really haven't thought about in the past.

Cascade is a great example of something that isn't necessarily a "component" but is a utility that can be used in any number of situations. There are probably numerous helpful utilities that we have in our codebase that we can extend to users. Another good example of a common utility function that we have and could export is the hook that is used in components like ActionBar TagOverflow and TagSet for determining overflow of a list of elements in a given area.

### Tasks
- [ ] identify hooks, components, or other code that could be extended as a utility to consumers
- [ ] identify best way to offer these utilities (new package?)

Work In Progress.

elycheea commented 2 weeks ago

We’ve also noticed this both in our own library and in @carbon/react but these utilities can exist both in the form of hooks (or JS only) or as component utilities.

Cascade may be a “component-based [layout] utility” similar to Stack in @carbon/react. We also see a difference in ClassPrefix v. usePrefix() from their library.

@davidmenendez summarized this as:

we might want to consider different approaches. perhaps offering both. something like the component for easy use and the hook for something more customizable

Also @matthewgallo thoughts on how we could refactor TagSet and TagOverflow (as of yesterday, we’re now lumping ActionBar into this category too after the review of #6159).

I think it would be cool to have a hook that just handles all the resizing of TagSet and TagOverflow and the hook just returns the number of items that should be visible (there's more to think through there but it would allow for a more composable approach to components like those two.

elycheea commented 2 weeks ago

Doesn’t really need design but also wanted to tag @aubrey-oneal on this since I know you explored added a utilities section for the website launch (but we didn’t want to include only Cascade). Curious how you were envisioning documentation of these on the website. I imagine the needs here would differ from how we typically document components though.