v5.1.1 Add width size props to <Page />

package.json

@@ -1,6 +1,6 @@
 {
   "name": "zooid-ui",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "description": "A collection of UI components for React projects.",
   "main": "dist/index.js",
   "style": "dist/style.css",

src/page/index.css

@@ -1,10 +1,21 @@
 .Page {
   min-height: 100%;
   width: 100%;
-  max-width: 1044px;
   margin: 32px auto;
 }
 
+.Page--small {
+  max-width: 800px;
+}
+
+.Page--medium {
+  max-width: 1044px;
+}
+
+.Page--large {
+  max-width: 1600px;
+}
+
 .Page-header {
   display: flex;
   justify-content: space-between;

src/page/index.js

@@ -7,15 +7,25 @@ import PageActions from './actions'
 import PageHeader from './header'
 import PageTitle from './title'
 
-const AppTitle = (title) => {
-  if (title) return <PageTitle>{title}</PageTitle>
-  return null
+const PAGE_WIDTHS = ['medium', 'large', 'small', 'full']
+
+const propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string,
+  width: PropTypes.oneOf(PAGE_WIDTHS),
+}
+
+const defaultProps = {
+  width: PAGE_WIDTHS[0],
 }
 
-const Page = ({ children, className }) => {
-  const classes = classNames('Page', className)
+const Page = ({ children, className, width }) => {
+  const classes = classNames('Page', `Page--${width}`, className)
 
   return <main className={classes}>{children}</main>
 }
 
+Page.propTypes    = propTypes
+Page.defaultProps = defaultProps
+
 export {Page, PageActions, PageHeader, PageTitle}