Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-bootstrap

Package Overview
Dependencies
Maintainers
1
Versions
219
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-bootstrap - npm Package Compare versions

Comparing version 0.4.2 to 0.5.0

Accordion.js

7

main.js
var path = require('path');
var LIB = 'cjs';
require('fs').readdirSync(path.join(__dirname, LIB)).forEach(function (file) {
require('fs').readdirSync('.').forEach(function (file) {
var name;
if (file.match(/.+\.js/g)) {
if (file.match(/.+\.js/g) && !file.match(/^main\.js/g)) {
name = file.replace('.js', '');
exports[name] = require(path('.', LIB, file));
exports[name] = require(path.join('.', file));
}
});
{
"name": "react-bootstrap",
"version": "0.4.2",
"version": "0.5.0",
"description": "Bootstrap 3 components build with React",
"main": "main.js",
"scripts": {
"build": "./node_modules/.bin/grunt build",
"test-watch": "./node_modules/.bin/grunt watch 2>&1 >/dev/null & karma start karma.dev.js",
"test": "./node_modules/.bin/grunt build && karma start karma.ci.js"
},
"keywords": [
"react",
"react-component",
"bootstrap"

@@ -17,34 +13,12 @@ ],

"license": "MIT",
"repository": {
"type": "git",
"url": "stevoland/react-bootstrap"
},
"bugs": {
"url": "https://github.com/stevoland/react-bootstrap/issues"
},
"peerDependencies": {
"react": "~0.9"
},
"devDependencies": {
"karma-chai": "0.0.2",
"mocha": "~1.16.2",
"karma-script-launcher": "~0.1.0",
"karma-chrome-launcher": "~0.1.2",
"karma-html2js-preprocessor": "~0.1.0",
"karma-firefox-launcher": "~0.1.3",
"karma-jasmine": "~0.1.5",
"karma-coffee-preprocessor": "~0.1.2",
"requirejs": "~2.1.9",
"karma-requirejs": "~0.2.1",
"karma-phantomjs-launcher": "~0.1.1",
"karma": "~0.10.9",
"karma-mocha": "~0.1.1",
"react": "git://github.com/stevoland/react-with-test-utils",
"envify": "~0.2.0",
"grunt-es6-module-transpiler": "~0.6.0",
"grunt": "~0.4.2",
"grunt-contrib-uglify": "~0.3.2",
"grunt-contrib-clean": "~0.5.0",
"grunt-es6-module-wrap-default": "~0.1.0",
"grunt-contrib-watch": "~0.5.3",
"grunt-browserify": "~1.3.0",
"grunt-cli": "~0.1.13",
"grunt-react": "~0.6.0",
"grunt-contrib-requirejs": "~0.4.1",
"grunt-shell": "~0.6.4",
"grunt-contrib-copy": "~0.5.0"
}
}

@@ -1,173 +0,9 @@

# react-bootstrap
# react-bootstrap-npm
[Bootstrap 3](http://getbootstrap.com) components built with [React](http://facebook.github.io/react/)
[![Build Status](https://travis-ci.org/stevoland/react-bootstrap.png)](https://travis-ci.org/stevoland/react-bootstrap) [![NPM version](https://badge.fury.io/js/react-bootstrap.png)](http://badge.fury.io/js/react-bootstrap) [![Bower version](https://badge.fury.io/bo/react-bootstrap.png)](http://badge.fury.io/bo/react-bootstrap)
This repo contains built CommonJS modules for Node.js.
Under active development - APIs will change.
See the [source repo](https://github.com/stevoland/react-bootstrap) for docs.
## Contributors
- Huge contributions from [syllog1sm](https://github.com/syllog1sm) ([blog](http://clozeit.wordpress.com/))
- [Pieter Vanderwerff](https://github.com/pieterv)
## Contributions
Yes please!
- Run `npm install`, `npm run test-watch` to run tests while you develop (however this hides any build errors, you can see these with `grunt build`)
- Add tests for any new or changed functionality
- See [issues](https://github.com/stevoland/react-bootstrap/issues) for some ideas
- Follow exisitng style
## Getting started
NOTE: Requires the latest React: 0.9.0-alpha. Get the build from http://react.zpao.com/builds/master/latest or from my
build for npm `npm install git://github.com/stevoland/react-with-test-utils`
You can import the lib with as AMD modules, CommonJS modules as a global JS script.
First add the bootstrap CSS to your project then:
### AMD
```
bower install react-bootstrap
var Alert = require('react-bootstrap/amd/Alert');
// or
var Alert = require('react-bootstrap/amd').Alert;
```
### CommonJS
```
npm install git://github.com/stevoland/react-with-test-utils
npm install react-bootstrap
var Alert = require('react-bootstrap/cjs/Alert');
// or
var Alert = require('react-bootstrap').Alert;
```
### Browser globals
```
<script src="http://react.zpao.com/builds/master/latest/react.js"></script>
<script src="react-bootstrap/dist/react-bootstrap.min.js"></script>
<script>
var Alert = ReactBootstrap.Alert;
</script>
```
## Currently implemented (but under active development)
- [Nav, NavItem](#Nav)
- [Button](#Button)
- [DropdownButton](#DropdownButton)
- [MenuItem](#MenuItem)
- [TabbedArea, TabPane](#Tabs)
- [Alert](#Alert)
- SplitButton
### <a name="Nav"></a>Nav
```
var Nav = require('react-bootstrap/cjs/Nav');
var NavItem = require('react-bootstrap/cjs/NavItem');
var key = 1;
function handleSelect (selectedKey) {
key = selectedKey;
}
<Nav bsStyle="[tabs|pills]" bsVariation="[stacked|justified]" activeKey={key} onSelect={handleSelect}>
<NavItem key={1} href="/home">NavItem 1 content</NavItem>
<NavItem key={2} title="Item">NavItem 2 content</NavItem>
<NavItem key={3} disabled={true}>NavItem 3 content</NavItem>
</Nav>
```
### <a name="Button"></a>Button
```
var Button = require('react-bootstrap/cjs/Button');
<Button onClick={handleClick}>Title</Button>
```
### <a name="DropdownButton"></a>DropdownButton
```
var DropdownButton = require('react-bootstrap/cjs/DropdownButton');
var MenuItem = require('react-bootstrap/cjs/MenuItem');
function handleSelect (selectedKey) {
}
<DropdownButton title="Title" onSelect={handleSelect}>
<MenuItem key="1">MenuItem 1 content</MenuItem>
<MenuItem key="2">MenuItem 2 content</MenuItem>
</DropdownButton>
```
### <a name="Tabs"></a>Tabs
#### Controlled
```
var TabbedArea = require('react-bootstrap/cjs/TabbedArea');
var TabPane = require('react-bootstrap/cjs/TabPane');
var key = 1;
function handleSelect (selectedKey) {
key = selectedKey;
}
<TabbedArea title="Title" activeKey={key} onSelect={handleSelect}>
<TabPane tab="Tab 1" key={1}>TabPane 1 content</TabPane>
<TabPane tab={<strong>Tab 2</strong>} key={2}>TabPane 2 content</TabPane>
</TabbedArea>
```
#### Uncontrolled
```
var TabbedArea = require('react-bootstrap/cjs/TabbedArea');
var TabPane = require('react-bootstrap/cjs/TabPane');
<TabbedArea title="Title" initialActiveKey={1}>
<TabPane tab="Tab 1" key={1}>TabPane 1 content</TabPane>
<TabPane tab={<strong>Tab 2</strong>} key={2}>TabPane 2 content</TabPane>
</TabbedArea>
```
### <a name="Alert"></a>Alert
```
var Alert = require('react-bootstrap/cjs/Alert');
function handleDismiss () {
}
<Alert bsStyle="danger" onDismiss={handleDismiss} dismissAfter={5000}>
<strong>Oh snap!</strong> Change a few things up and try submitting again.
</Alert>
```
### <a name="MenuItem"></a>MenuItem
```
var MenuItem = require('react-bootstrap/cjs/MenuItem');
function handleSelect (key) {
}
<MenuItem key={1} bsVariation="[divider|header]" onSelect={handleSelect}>Content</MenuItem>
```
## Up next
- Panel, PanelGroup
- Input
- Label
- Accordion
- Pagination, Pager
- Modal
[![Build Status](https://travis-ci.org/stevoland/react-bootstrap.png)](https://travis-ci.org/stevoland/react-bootstrap) [![NPM version](https://badge.fury.io/js/react-bootstrap.png)](http://badge.fury.io/js/react-bootstrap)

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc