docs: update documentation

.github/wordlist.txt

@@ -60,4 +60,10 @@ darkMode
 isDarkMode
 Async
 env
-usr
+usr
+wordWrap
+Submenus
+Submenu
+submenu
+submenus
+MenuItem

README.md

@@ -6,10 +6,146 @@ Write xbar app plugins using JavaScript and Deno
 
 ### Deno
 
-### Xbar
+[Deno](https://github.com/denoland/deno) is a simple, modern and secure runtime
+for JavaScript and TypeScript that uses V8 and is built in Rust.
+
+Shell (Mac, Linux):
+
+```sh
+curl -fsSL https://deno.land/x/install/install.sh | sh
+```
+
+[Homebrew](https://formulae.brew.sh/formula/deno) (Mac):
+
+```sh
+brew install deno
+```
+
+See
+[deno_install](https://github.com/denoland/deno_install/blob/master/README.md)
+and [releases](https://github.com/denoland/deno/releases) for other options.
+
+### xbar
+
+[xbar](https://github.com/matryer/xbar) lets you put the output from any
+script/program in your macOS menu bar.
+
+[Download the latest release of xbar](https://github.com/matryer/xbar/releases).
+
+## Usage
+
+In the xbar plugins directory create a file named with the following format:
+
+`{name}.{refreshTime}.js`
+
+On the first line of that file include a shebang in the following format:
+
+`#!/usr/bin/env /path/to/the/deno/executable run <permissions>`
+
+This module can be imported to the plugin with the following code:
+
+`import { xbar, separator, isDarkMode } from "https://deno.land/x/xbar@LATEST_VERSION/mod.ts";`
+
+Deno is secure by default. Therefore, unless you specifically enable it, a
+program run with Deno has no file, network, or environment access. Replace
+`<permissions>` with the permissions required for the plugin. See
+[Deno Manual](https://deno.land/manual/getting_started/permissions) for more.
+
+Ensure that the file is executable by using the command `chmod +x filename.js`.
+[Read more.](https://github.com/matryer/xbar#installing-plugins)
+
+### Example
+
+```
+#!/usr/bin/env /path/to/the/deno/executable run --allow-env
+
+import { xbar, separator, isDarkMode } from "https://deno.land/x/xbar@LATEST_VERSION/mod.ts";
+
+const darkMode = await isDarkMode(); 
+
+xbar([
+	{
+		text: 'plugin text on the menu bar',
+		color: darkMode ? 'white' : 'red',
+	},
+	separator,
+	{
+		text: 'plugin text below the menu bar',
+		color: '#85b56d',
+		submenu: [
+			{
+				text: 'plugin text in a submenu menu that is long and is word wrapped',
+				wordWrap: 40
+			},
+		]
+	},
+]);
+```
 
 ## API
 
+### xbar
+
+Prints output to xbar and returns printed output as an array of strings
+
+Type: `(Array<MenuItem>) => string[]`
+
+Takes an array of MenuItem objects, that represent xbar menu items, as input.
+
+#### MenuItem
+
+Type: `object`
+
+MenuItem can contain any of the following fields:
+
+```
+{
+  text: string;
+  submenu: Array<MenuItem>;
+  ...options
+}
+```
+
+#### submenu
+
+Type: `Array<MenuItem>`
+
+It will add a submenu to the current menu item. A submenu is composed of an
+array of menu items. Submenus can contain nested submenus.
+
+#### options
+
+Type: `option: any`
+
+You can use any of the xbar
+[supported options](https://github.com/matryer/xbar-plugins/blob/main/CONTRIBUTING.md#plugin-api).
+Additionally this module enables an additional `wordWrap` option.
+
+`wordWrap`
+
+Enabling the wordWrap option will result in the improved readability of long
+text by outputting the text as multiple lines with out breaking any apart words.
+
+Example:
+
+```
+{
+  text: 'Douglas Crockford',
+  submenu: [
+    {
+      text: `${longQuote}`
+      wordWrap: 40,
+    }
+  ]
+}
+```
+
+![' '](https://github.com/theogainey/deno-xbar/blob/main/wordWrapExample.png)
+
+### separator
+
+Used for declaring a separator.
+
 ### isDarkMode
 
 Async function to query if dark mode is enabled.

mod.ts

@@ -1 +1,2 @@
-export { isDarkMode } from './src/accessibility.js'
+export { isDarkMode } from './src/accessibility.js'
+export { xbar, separator } from './src/index.js'

src/format.js

@@ -23,7 +23,10 @@ const getFormattedOutputOptions = pipe(
 );
 
 // entry layer
-export const formatLine = (lineObj) =>
-  getSubMenuFormatting(lineObj) +
-  getFormattedText(lineObj) +
-  getFormattedOutputOptions(lineObj);
+export const formatLine = (lineObj) => {
+  const formattedLine = getSubMenuFormatting(lineObj) +
+    getFormattedText(lineObj) +
+    getFormattedOutputOptions(lineObj);
+  console.log(formattedLine);
+  return formattedLine;
+};

src/index.js

@@ -37,7 +37,7 @@ const includeSeparator = (arr) => [
 //entry layer
 /**
  * Prints output to xbar and returns printed output as an array of strings
- * @param layout - array of menu items
+ * @param layout - array of xbar menu items
  * @returns {string[]} array of strings that were printed as menu items
  */
 export const xbar = (layout) =>