Move ItemViewAppBar to react-styleguidist folder structure w/ docs

src/App.js

@@ -4,7 +4,7 @@ import webqueueTheme from "./theme";
 import { Box, makeStyles } from "@material-ui/core";
 import ItemTableAppBar from "./components/ItemTableAppBar/";
 import ItemTable from "./components/ItemTable/";
-import ItemViewAppBar from "./ItemViewAppBar";
+import ItemViewAppBar from "./components/ItemViewAppBar/";
 import ItemView from "./ItemView";
 import clsx from "clsx";
 

src/ItemViewAppBar.js → src/components/ItemViewAppBar/ItemViewAppBar.js

@@ -1,4 +1,5 @@
 import React from "react";
+import PropTypes from "prop-types";
 import {makeStyles, Tooltip, Typography, AppBar, Toolbar, IconButton, Zoom} from "@material-ui/core"
 import CloseItemViewIcon from '@material-ui/icons/ChevronRight';
 
@@ -36,4 +37,17 @@ export default function ItemViewAppBar(props){
 			</AppBar>
 		</>
 	);
-}
+}
+
+ItemViewAppBar.propTypes = {
+	/** The webqueue2 MUI theme. */
+	"theme": PropTypes.object.isRequired,
+	/** Function to toggle sidebar open. */
+	"setSidebarOpen": PropTypes.func.isRequired,
+	/** The title of the app bar. */
+	"title": PropTypes.string
+};
+
+ItemViewAppBar.defaultProps = {
+	"title": ""
+};

src/components/ItemViewAppBar/ItemViewAppBar.md

@@ -0,0 +1,17 @@
+The ItemViewAppBar is the primary toolbar for the [ItemView](/#/Components/ItemView). It displays the item title and action for closing the sidebar.
+
+```jsx
+import React, { useState } from "react";
+import ItemViewAppBar from "./ItemViewAppBar";
+import webqueue2Theme from "../../theme.js";
+
+const theme = webqueue2Theme(false);
+
+const [sidebarOpen, setSidebarOpen] = useState(false);
+
+<ItemViewAppBar title="ce 100" setSidebarOpen={setSidebarOpen} theme={theme} />
+```
+
+```jsx static
+<ItemViewAppBar title={"ce 100"} setSidebarOpen={someFunc} theme={theme} />
+```

src/components/ItemViewAppBar/index.js

@@ -0,0 +1,3 @@
+import ItemViewAppBar from "./ItemViewAppBar";
+
+export default ItemViewAppBar;