Skip to content

P
paragon
Commit dbbdce6e by Ari Rizzitano
Options

init commit

parents
Showing with 382 additions and 0 deletions
.babelrc 0 → 100644
{
"presets": [
["env", {
"targets": {
"browsers": ["last 2 versions", "ie 11"]
}
}],
"babel-preset-react"
]
}
.eslintrc.json 0 → 100644
{
"extends": ["eslint-config-airbnb", "eslint-config-edx"]
}
.gitignore 0 → 100644
.DS_Store
.eslintcache
node_modules
npm-debug.log
/dist
README.md 0 → 100644
# excalibur
docs/App.js 0 → 100644
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import classnames from 'classnames';
import { BrowserRouter as Router } from 'react-router-dom';
import routes from './routes';
ReactDOM.render(
<Router>
{routes}
</Router>,
document.getElementById('root')
);
docs/index.html 0 → 100644
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<title>Component Explorer!</title>
</head>
<body>
<div id="root"></div>
<script type="text/javascript" src="bundle.js"></script>
</body>
</html>
docs/routes.js 0 → 100644
import React from 'react';
import { Route, Link } from 'react-router-dom';
import { Nav, NavItem, NavLink } from 'reactstrap';
import CourseHeader from './views/Header/CourseHeader';
import Home from './views/Home';
import Inputs from './views/Inputs';
const routes = (
<div>
<Nav>
<NavItem>
<NavLink href="/">Home</NavLink>
</NavItem>
<NavItem>
<NavLink href="/header">Header</NavLink>
</NavItem>
<NavItem>
<NavLink href="/inputs">Inputs</NavLink>
</NavItem>
</Nav>
<Route exact path="/" component={Home} />
<Route path="/header" component={CourseHeader} />
<Route path="/inputs" component={Inputs} />
</div>
);
export default routes;
docs/views/Header/CourseHeader.js 0 → 100644
import React, { Component } from 'react';
import MainNav from './MainNav';
import CourseNav from './CourseNav';
export default class CourseHeader extends Component {
render() {
const course = {
number: 'INST101X',
name: 'Interesting Course Title',
tabs: [
'Syllabus',
'Discussion',
'Progress',
'Instructor'
]
};
const user = {
displayName: 'FooBar McBaz',
image: 'http://placehold.it/40x40'
};
return (
<div className="header">
<MainNav course={course} user={user} />
<CourseNav course={course} />
</div>
);
}
}
docs/views/Header/CourseNav.js 0 → 100644
import React, { Component } from 'react';
export default class CourseNav extends Component {
render() {
return (
<div className="container-fluid course-nav">
</div>
);
}
}
docs/views/Header/MainNav.js 0 → 100644
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import {
Nav,
NavItem,
NavLink,
NavDropdown,
DropdownMenu,
DropdownItem,
DropdownToggle
} from 'reactstrap';
class MainNav extends Component {
constructor(props) {
super(props);
this.toggle = this.toggle.bind(this);
this.state = {
dropdownOpen: false
};
}
toggle() {
this.setState({
dropdownOpen: !this.state.dropdownOpen
});
}
render() {
return (
<Nav className="navbar navbar-toggleable-md navbar-dark bg-white">
<NavItem>
<button className="navbar-toggler-right btn btn-secondary hidden-lg-up" type="button" data-toggle="collapse" data-target="#mNav" aria-controls="mNav" aria-expanded="false" aria-label="Toggle navigation">
<span><i className="fa fa-bars mr-2" aria-hidden="true"></i>Menu</span>
</button>
</NavItem>
<NavItem>
<h1 className="navbar-brand mb-0">
<NavLink href="#">
<img src="static/logo.png" alt="edX Home" className="d-inline-block align-top" width="60" height="30" />
</NavLink>
</h1>
</NavItem>
<NavItem className="navbar-text mr-auto">
<h2 className="mb-auto h6">
<b>{this.props.course.number}:</b> {this.props.course.name}
</h2>
</NavItem>
<NavItem>
<NavLink href="#">Help</NavLink>
</NavItem>
<NavDropdown isOpen={this.state.dropdownOpen} toggle={this.toggle}>
<DropdownToggle nav caret>
<img src={this.props.user.image} className="rounded mr-1" width="40px" height="40px" />
{this.props.user.displayName}
</DropdownToggle>
<DropdownMenu>
<DropdownItem>Dashboard</DropdownItem>
<DropdownItem>Profile</DropdownItem>
<DropdownItem>Account</DropdownItem>
<DropdownItem divider />
<DropdownItem>Sign Out</DropdownItem>
</DropdownMenu>
</NavDropdown>
</Nav>
);
}
}
MainNav.propTypes = {
course: PropTypes.shape({
number: PropTypes.string.isRequired,
name: PropTypes.string.isRequired
}),
user: PropTypes.shape({
displayName: PropTypes.string.isRequired,
image: PropTypes.string.isRequired
})
};
export default MainNav;
docs/views/Home.js 0 → 100644
import React, { Component } from 'react';
export default class Home extends Component {
render() {
return (
<div>
hello i am a home
</div>
);
}
}
docs/views/Inputs.js 0 → 100644
import React, { Component } from 'react';
export default class Inputs extends Component {
render() {
return (
<div>
hello i am an inputs
</div>
);
}
}
package.json 0 → 100644
{
"name": "excalibur",
"version": "0.0.1",
"description": "Accessible, responsive UI component library based on Bootstrap.",
"main": "dist/excalibur.min.js",
"author": "arizzitano",
"license": "MIT",
"scripts": {
"build": "webpack",
"build-docs": "NODE_ENV=doc webpack",
"lint": "eslint .",
"prestart": "install-self-peers",
"start": "BABEL_ENV=webpack webpack-dev-server --config ./webpack.dev.config.js --watch"
},
"dependencies": {
"classnames": "^2.2.5",
"prop-types": "^15.5.8",
"react-router-dom": "^4.1.1",
"reactstrap": "^4.5.0"
},
"devDependencies": {
"@team-griffin/install-self-peers": "^1.0.0",
"babel-cli": "^6.24.1",
"babel-loader": "^7.0.0",
"babel-preset-env": "^1.4.0",
"babel-preset-react": "^6.24.1",
"eslint": "^3.19.0",
"eslint-config-airbnb": "^14.1.0",
"eslint-config-edx": "^2.0.1",
"eslint-plugin-jsx-a11y": "^4.0.0",
"eslint-plugin-react": "^6.10.3",
"webpack": "^2.4.1",
"webpack-dev-server": "^2.4.4"
},
"peerDependencies": {
"react": "^15.5.4",
"react-addons-css-transition-group": "^15.5.2",
"react-addons-transition-group": "^15.5.2",
"react-dom": "^15.5.4"
}
}
src/Button.js 0 → 100644
import React, { Component } from 'react';
export default class Button extends React.Component {
render() {
return (
<button>hello i'm a button</button>
);
}
}
src/index.js 0 → 100644
import Button from './Button';
export {
Button
};
webpack.config.js 0 → 100644
const path = require('path');
module.exports = {
entry: path.resolve('./src/index.js'),
output: {
path: path.resolve('./dist'),
filename: 'excalibur.min.js',
library: 'excalibur',
libraryTarget: 'umd',
},
externals: [{
react: {
root: 'React',
commonjs2: 'react',
commonjs: 'react',
amd: 'react',
},
},
{
'react-dom': {
root: 'ReactDOM',
commonjs2: 'react-dom',
commonjs: 'react-dom',
amd: 'react-dom',
},
},
{
'react-addons-transition-group': {
commonjs: 'react-addons-transition-group',
commonjs2: 'react-addons-transition-group',
amd: 'react-addons-transition-group',
root: ['React', 'addons', 'TransitionGroup'],
},
}],
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env'],
},
},
},
],
},
};
webpack.dev.config.js 0 → 100644
const path = require('path');
module.exports = {
devtool: 'source-map',
devServer: {
contentBase: path.resolve('./doc'),
historyApiFallback: true,
stats: {
chunks: false
}
},
entry: {
main: './doc/App.js'
},
node: {
fs: 'empty'
},
output: {
filename: 'bundle.js',
path: path.resolve('./doc'),
libraryTarget: 'umd'
},
// plugins: [
// new CleanWebpackPlugin(['build']),
// new CopyWebpackPlugin([{ from: './docs/static', to: 'assets' }]),
// new webpack.DefinePlugin({
// 'process.env.NODE_ENV': JSON.stringify(env)
// }),
// new webpack.optimize.OccurenceOrderPlugin(),
// new StaticSiteGeneratorPlugin('main', paths, {}),
// new webpack.NoErrorsPlugin(),
// new ExtractTextPlugin("/assets/style.css")
// ],
module: {
loaders: [
// {
// test: /\.json$/,
// loaders: [
// 'json-loader?cacheDirectory'
// ]
// },
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loaders: [
'babel-loader?cacheDirectory'
]
},
// {
// test: /\.css$/,
// loader: ExtractTextPlugin.extract("style-loader", "css-loader")
// },
]
},
// resolve: {
// extensions: ['', '.js', '.json'],
// alias: {
// 'bootstrap-css': path.join(__dirname,'node_modules/bootstrap/dist/css/bootstrap.css'),
// reactstrap: path.resolve('./src')
// }
// }
};
yarn.lock 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment