React.Flux.Addons.Bootstrap

Bindings to React-Bootstrap. To use this binding, include the browser-global version of react-bootstrap.js so that window.ReactBootstrap is defined. You can then use bootstrap_ inside your rendering functions.

Note: I initially wrote these bindings when I was first starting React, but after some experience I think that bootstrap and react just do not fit together and I no longer use bootstrap and react together. While I am leaving this here for backwards compatibility, I suggest you use a different library. I am currently using Material UI and accessing the components using foreign_.

Documentation

bootstrap_

Arguments

:: String

The component name. Uses window['ReactBootstrap'][name] to find the class, so the name can be anything exported to the window.ReactBoostrap object.

-> [PropertyOrHandler eventHandler]

Properties and callbacks to pass to the ReactBootstrap class. You can use callback to create function properties.

-> ReactElementM eventHandler a

The child or children of the component.

-> ReactElementM eventHandler a

A bootstrap component. For example,

bootstrap_ "Alert" [ "bsStyle" $= "danger"
                   , callback "onDismiss" $ dispatch CloseAlert
                   ] $
    p_ "Hello, World!"

bootstrap_ "Nav" [ "activeKey" @= (1 :: Int)
                 , callback "onSelect" $ \(i :: Int) -> dispatch $ TabChange i
                 ] $ do
    bootstrap_ "NavItem" ["eventKey" @= (1 :: Int)] "Item 1"
    bootstrap_ "NavItem" ["eventKey" @= (2 :: Int)] "Item 2"
    bootstrap_ "NavItem" ["eventKey" @= (3 :: Int)] "Item 3"