c8r / kit

Tools for developing, documenting, and testing React component libraries
https://compositor.io/kit
MIT License
1.21k stars 30 forks source link

add "container" prop to Cartesian #197

Closed VinSpee closed 6 years ago

VinSpee commented 6 years ago

Allow the consumer to provide an optional container prop. This prop is the same type as the component prop and behaves the same way. The container prop is a way for consumers to control the way each child of the Cartesian component may look. I anticipate this being used primarily for spacing and layout, when the product of the cartesian component does not have any opinions about its container.

I ran into this need here:

<Cartesian
  component={Button}
  type={['normal', 'medium', 'dark']}
>
  {['Short', 'Really Really Long Label', 'Medium Label']}
</Cartesian>

image

I desired this output, and in order to get it I have to be allowed inside of Cartesian's .map fn. The only way I can see is the pass a prop:

const Wrap = withTheme(
  emotion.View(({ theme: t }) => ({
    padding: t.size(1),
  })),
);

…

<Cartesian
  container={Wrap}
  component={Button}
  type={['normal', 'medium', 'dark']}
>
  {['Short', 'Really Really Long Label', 'Medium Label']}
</Cartesian>

image

Any interest in adding something like this? as far as I can tell there's no way to do it from user-land as it currently stands.

VinSpee commented 6 years ago

additionally, I'll add some coverage for this case.

VinSpee commented 6 years ago

wew lad

johno commented 6 years ago

Thanks!

VinSpee commented 6 years ago

released in v1.0.46!

any thoughts on docs? I'm happy to add it if you'd like

johno commented 6 years ago

If you wanted to add a props table with descriptions/types that'd be great!