kulakowka / react-bulma

React.js components for Modern CSS framework based on Flexbox
https://code-typing-tutor.com
MIT License
471 stars 52 forks source link

Why this approach ? #17

Closed gaillota closed 6 years ago

gaillota commented 6 years ago

Hi, First of all, thank you for the great work, it's very nice what you've done !

This is not an issue, but just a general wonder that you may be able to answer: Why did you choose to implements your components with booleans values, instead of enums.

For example, for the Icon component, you have to manually set the size like so

<Icon small>
  <i class="icon"></i>
</Icon>

Why not do the following:

const size = 'small'

<Icon size={size}>
  <i class="icon"></i>
</Icon>

where the size props is an enumerable value, with the following possibilities: small, medium, large. And, you have the possibility to dynamically inject the size variable from a wrapper component or an external config. Or is there something that I'm missing with React, and you actually can work with a variable ?

I was just wondering why you choose this approach over another one ? Best regards.

kulakowka commented 6 years ago

This was done for brevity. Initially, it was an experiment. It turned out that bulma.css is perfect for this.

Because of this choice, problems can arise. But we hope that no one in their right mind will write something like

<Button small large>i'm small or large?</Button>

You can take a look at this project: http://bokuweb.github.io/re-bulma/#Button

gaillota commented 6 years ago

Ok, thank you for the clarification, and the re-bulma package that I didn't know.

Regards.