Update documentation

Author: saharmor

README.md

@@ -1,14 +1,14 @@
-<p align="center">
-  <h2 align="center">React Super Command</h2>
-  <img src="https://i.ibb.co/FYWBRSb/Screenshot-2020-12-16-at-16-42-30.png"/><br/>
-</p>
+<div style="text-align:center">
+  <h2>React Super Command</h2>
+  <img width="300px" src="https://i.ibb.co/FYWBRSb/Screenshot-2020-12-16-at-16-42-30.png" alt="Commandline modal"/><br/>
+</div>
 
 [![NPM](https://img.shields.io/npm/v/react-super-cmd.svg)](https://www.npmjs.com/package/react-super-cmd) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
 
-The command line experience for the no-mouse generation.
-Allow your users to seamlessly interact with your React app with a blazing fast command line.
+The command line experience for the no-mouse generation. A blazing fast command line to allow your users to seamlessly interact with your React app.
 <br><br>
 [Live demo]()
+
 ## Installation
 
 ### npm
@@ -45,27 +45,64 @@ const App = () => {
     ADD_CONTACT: {
       name: 'Add', logo: <AddCircleOutlineIcon/>, shortcut: '⌘ A', callback: () => console.log('add')
     },
-    DELETE_CONTACT: {
-      name: 'Delete', logo: <RemoveCircleOutlineOutlinedIcon/>, shortcut: '⌘ D', callback: () => console.log('delete')
-    },
   };
 
   function toggleIsOpen() {
     setCmdLineModal(previousState => !previousState);
   };
 
   return (
-    <CommandLineModal commands={commands} isOpen={cmdLineModal} toggleIsModalOpen={toggleIsOpen}
-                      title={"Super Command"} logo={<OfflineBoltOutlined/>}/>
+    <CommandLineModal commands={commands} 
+                      isOpen={cmdLineModal} 
+                      toggleIsModalOpen={toggleIsOpen}
+                      title={"Super Command"} 
+                      logo={<OfflineBoltOutlined/>}
+                      noOptionsText = "No commands found. Try a different search term."
+    />
   );
 };
 
 export default App;
 ```
 
-## Defining commands
+## Props
+### commands
+Object representing the different commands to list. The key is command's name and value is another object containing command details. Example:
+```
+const commands = {
+    SEARCH_CONTACT: {
+      name: 'Search', logo: <SearchOutlinedIcon/>, shortcut: 'S', callback: () => console.log('search')
+    },
+    ADD_CONTACT: {
+      name: 'Add', logo: <AddCircleOutlineIcon/>, shortcut: '⌘ A', callback: () => console.log('add')
+    },
+  };
+```
+Command details varibales
+
+| Parameter  | Type      | Description | Example |
+| :--------- | :-------- | :---------- | :----- |
+| name       | `string`    | The text to be displayed for this command| Search 
+| logo       | `component` | Component that will be next to command's name |`<SearchOutlinedIcon/>` from Material UI|
+| shortcut   | `string`    | Shortcut text to display next to command name |⌘ S|
+| callback   | `func`      | A function callback text to be displayed for this command|function searchCallback(){<br/>console.log("search called")<br/>}|
+
+### isOpen
+If true, command line modal will be visible.
+
+### toggleIsModalOpen
+A function to be called to toggle modal state. Used to control isOpen state within the external component (e.g. `Super Command` in above example). 
+
+### title
+The title to be displayed for the command line modal (e.g. `<App>` in above example)
+
+### logo
+Optional<br>
+A logo component to display as part of the title
 
-`react-super-cmd` uses commands
+### noOptionsTest
+Optional<br> 
+Text to show when no commands were found based on input search term
 
 ## License
 

src/index.js

@@ -51,7 +51,7 @@ const useStyles = (theme) => ({
 
 const CommandLineModal = ({
                             classes, commands, isOpen, toggleIsModalOpen, title,
-                            noOptionsText = "No command found. Try a different search term.",
+                            noOptionsText = "No commands found. Try a different search term.",
                             logo = <OfflineBoltOutlined/>
                           }) => {
   let commandsInternal = {};