Draft component designs about react-bootstrap HOT 19 CLOSED

Hi,

Really like the mixins. Do you fancy forking this project or I'm happy to contribute to yours?

from react-bootstrap.

I'm not really clear on the distinction --- I'm happy enough to push code to this repo. Do you think you'll have time to work on this?

from react-bootstrap.

I'm keen to but not sure how much time I will be able to commit. Depends if my current employer adopts React or not.

from react-bootstrap.

Here's a dump of the components I have (messily) implemented at the moment: https://gist.github.com/syllog1sm/8401949

I'm not very experienced with javascript, so I'm not sure how to structure a library. No idea about testing either. I can sort that out once the code's worth showing to people, but I figured I may as well show the current work, rather than sitting on it. If you want to put some of it up in a useable state, great :).

A short write up is on my blog about the tabbed area wrapper, and forms: http://clozeit.wordpress.com/

from react-bootstrap.

Great, thanks!

I've added the BootstrapMixin (slightly modified) and got some tests working.

from react-bootstrap.

Awesome!

I think there's probably enough implemented now that we might switch to an "API-first" design policy, and nail down a document specifying how we want the components to behave.

I haven't worked on a library like this, but I think that API, documentation and testing are the 3 big things. I'm pretty confident the implementation will come together pretty quickly.

Unfortunately I don't have much time to work on this for the next two weeks. So it goes...

from react-bootstrap.

I agree API docs first would be great.

I'm doing TDD at the moment - React components are great for that I think. I've added the size and style mixins. Think I'll setup TravisCI next then refactor ButtonDropdown to take children for the options.

from react-bootstrap.

Sounds great.

I've gone back and forth a bit on child passing. I see three options:

1. Pass children as children, i.e. <Parent>...</Parent>
2. Pass children in as a prop, so you write <Parent children={...}</Parent>
3. Pass an array of props objects, and optionally a child class, so you write <Parent childModels={...} childClass={ChildClass}/>

3. is the least convenient to the client in the default case, but leaves them the most flexibility, and makes it possible to modify the child properties. 1 and 2 seem equivalent to me, but there might be something I'm missing. If they are equivalent, then I'd favour 1 between the two.

from react-bootstrap.

Think your code's been stripped. Can you send again with backticks surrounding the code? thanks

from react-bootstrap.

Oops. Done.

from react-bootstrap.

I'd go for supporting both 1 and 3.

from react-bootstrap.

I realised that we can implement 1 whilst still being able to 'modify' the necessary child properties by recreating the child components and passing the props of the real children to them:

https://github.com/stevoland/react-bootstrap/blob/master/src/TabbedArea.jsx#L26

I suppose its inefficient but I think it creates the best API - how I would expect it to work. What do you think?

handleState: function (newIndex) {
  this.state({
    index: newIndex
  });
}
...
<TabbedArea activeIndex={this.state.index} onSelect={this.handleSelect}>
  <TabPane tab="Tab 1">Content</Tab>
  <TabPane tab="Tab 2">Content 2</Tab>
</TabbedArea>

from react-bootstrap.

Definitely sympathise with the design, but I'm worried that it'll be brittle. Pete Hunt called my attention to this:

https://github.com/facebook/react/blob/master/src/utils/cloneWithProps.js
Implementation:
https://github.com/facebook/react/blob/master/src/core/ReactPropTransferer.js

So, first up, we should use their implementation instead of your mixin. But, they seemed to indicate this was Bad Form. We should consult them on IRC.

from react-bootstrap.

Great work btw. I hadnt checked the project in a few days, it's coming along really nicely!

from react-bootstrap.

Ah, you're one step ahead as usual. Yeah cloneWithProps is what I was looking for + yeah it does seem a bit hacky but if it's going to remain supported I'd definitely like it as one option at least.

from react-bootstrap.

Fair enough -- gets my +1.

I think if we're going to take the idea of "just deliver the best API" seriously, then this solution is the way to go. Worst comes to worst, if React does change underneath us, we'll just change our internals.

from react-bootstrap.

What do you think about an option for components like TabbedArea to manage their own state or is this too much temptation to use them unwisely?

from react-bootstrap.

Hi,

I'm adding a LICENCE file. What's your real name to put in the copyright bit?

from react-bootstrap.

Heya,

Matthew Honnibal.

On Fri, Feb 7, 2014 at 8:54 PM, Stephen J. Collings <
[email protected]> wrote:

Hi,

I'm adding a LICENCE file. What's your real name to put in the copyright
bit?

Reply to this email directly or view it on GitHubhttps://github.com//issues/2#issuecomment-34422357
.

from react-bootstrap.