feat: add minimal source files

source/container.js

@@ -0,0 +1,22 @@
+import * as React from 'react';
+
+
+const Container = ({ className, style, children, ...props}) => {
+	return (
+		<div
+			className={className}
+			style={style}
+			{...props}
+			>
+			{children}
+		</div>
+	);
+};
+
+Container.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	style: React.PropTypes.object
+};
+
+export default Container;

source/fill.js

@@ -0,0 +1,35 @@
+import * as React from 'react';
+
+const defaultStyle = {
+	display: 'block',
+	overflow: 'hidden',
+	position: 'absolute',
+	top: 0,
+	left: 0,
+	bottom: 0,
+	right: 0
+};
+
+
+const Fill = ({ className, style, children, ...props}) => {
+	return (
+		<div
+			className={className}
+			style={{
+				...defaultStyle,
+				...style
+			}}
+			{...props}
+			>
+			{children}
+		</div>
+	);
+};
+
+Fill.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	style: React.PropTypes.object
+};
+
+export default Fill;

source/fixed-height.js

@@ -0,0 +1,30 @@
+import * as React from 'react';
+
+
+const FixedHeight = ({ children, className, height, style, ...props}) => {
+	return (
+		<div
+			className={className}
+			style={{
+				height,
+				...style
+			}}
+			{...props}
+			>
+			{children}
+		</div>
+	);
+};
+
+FixedHeight.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	height: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	]).isRequired,
+	style: React.PropTypes.object,
+	width: React.PropTypes.oneOf([undefined, 'auto'])
+};
+
+export default FixedHeight;

source/fixed.js

@@ -0,0 +1,39 @@
+import * as React from 'react';
+
+const defaultStyle = {
+	display: 'inline-block'
+};
+
+
+const Fixed = ({ children, className, height, style, width, ...props}) => {
+	return (
+		<div
+			className={className}
+			style={{
+				...defaultStyle,
+				height,
+				width,
+				...style
+			}}
+			{...props}
+			>
+			{children}
+		</div>
+	);
+};
+
+Fixed.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	height: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	]).isRequired,
+	style: React.PropTypes.object,
+	width: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	]).isRequired
+};
+
+export default Fixed;

source/index.js

@@ -0,0 +1,92 @@
+import * as React from 'react';
+
+import Container from './container';
+import Fill from './fill';
+import Fixed from './fixed';
+import FixedHeight from './fixed-height';
+import NoDisplay from './nodisplay';
+import Responsive from './responsive';
+
+const typeMap = {
+	container: Container,
+	fill: Fill,
+	fixed: Fixed,
+	'fixed-height': FixedHeight,
+	nodisplay: NoDisplay,
+	responsive: Responsive
+};
+
+const determineType = ({ height, heights, sizes, width }) => {
+	const hasHeight = typeof height !== 'undefined';
+	const hasHeights = typeof heights !== 'undefined';
+	const hasSizes = typeof sizes !== 'undefined';
+	const hasWidth = typeof width !== 'undefined';
+
+	if (!hasWidth && !hasHeight) {
+		return Container;
+	} else if ((hasWidth || hasHeight) && (hasSizes || hasHeights)) {
+		return Responsive;
+	} else if (hasHeight && (!hasWidth || width === 'auto')) {
+		return FixedHeight;
+	} else {
+		return Fixed;
+	}
+};
+
+
+const Layout = ({ children, className, style, type, ...props}) => {
+	const Component = (type && typeMap[type]) || determineType(props);
+	return (
+		<Component
+			className={className}
+			style={style}
+			{...props}
+			>
+			{children}
+		</Component>
+	);
+};
+
+Layout.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	fallback: React.PropTypes.bool,
+	height: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	]),
+	heights: React.PropTypes.arrayOf(
+		React.PropTypes.oneOfType([
+			React.PropTypes.number,
+			React.PropTypes.string
+		])
+	),
+	media: React.PropTypes.string,
+	noloading: React.PropTypes.bool,
+	placeholder: React.PropTypes.bool,
+	sizes: React.PropTypes.arrayOf(React.PropTypes.string),
+	style: React.PropTypes.object,
+	type: React.PropTypes.oneOf([
+		'container',
+		'fill',
+		'fixed',
+		'fixed-height',
+		'nodisplay',
+		'responsive'
+	]),
+	width: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	])
+};
+
+
+export {
+	Container,
+	Fill,
+	Fixed,
+	FixedHeight,
+	NoDisplay,
+	Responsive,
+	Layout as default
+};

source/nodisplay.js

@@ -0,0 +1,29 @@
+import * as React from 'react';
+
+const defaultStyle = {
+	display: 'none'
+};
+
+
+const NoDisplay = ({ className, style, children, ...props}) => {
+	return (
+		<div
+			className={className}
+			style={{
+				...defaultStyle,
+				...style
+			}}
+			{...props}
+			>
+			{children}
+		</div>
+	);
+};
+
+NoDisplay.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	style: React.PropTypes.object
+};
+
+export default NoDisplay;

source/responsive.js

@@ -0,0 +1,50 @@
+import * as React from 'react';
+
+const wrapperStyle = {
+	position: 'relative',
+	height: 0
+};
+
+const stretchStyle = {
+	position: 'absolute',
+	top: 0,
+	left: 0,
+	bottom: 0,
+	right: 0
+};
+
+
+const Responsive = ({ children, className, height, style, width, ...props}) => {
+	return (
+		<div
+			className={className}
+			style={{
+				...wrapperStyle,
+				paddingBottom: `${(height / width) * 100}%`,
+				...style
+			}}
+			{...props}>
+			<div
+				style={stretchStyle}
+				>
+				{children}
+			</div>
+		</div>
+	);
+};
+
+Responsive.propTypes = {
+	children: React.PropTypes.node,
+	className: React.PropTypes.string,
+	height: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	]).isRequired,
+	style: React.PropTypes.object,
+	width: React.PropTypes.oneOfType([
+		React.PropTypes.number,
+		React.PropTypes.string
+	]).isRequired
+};
+
+export default Responsive;