@brightleaf/react-hooks - npm Package Compare versions

Comparing version 0.11.0 to 0.12.0

lib/index.js

@@ -18,2 +18,14 @@ "use strict";
 });
+Object.defineProperty(exports, "useEvent", {
+  enumerable: true,
+  get: function () {
+    return _useEvent.default;
+  }
+});
+Object.defineProperty(exports, "useEventListener", {
+  enumerable: true,
+  get: function () {
+    return _useEventListener.default;
+  }
+});
 Object.defineProperty(exports, "useFavicon", {
@@ -90,2 +102,6 @@ enumerable: true,
 
+var _useEvent = _interopRequireDefault(require("./use-event"));
+
+var _useEventListener = _interopRequireDefault(require("./use-event-listener"));
+
 var _useFavicon = _interopRequireDefault(require("./use-favicon"));
@@ -92,0 +108,0 @@

lib/use-async.js

@@ -12,2 +12,16 @@ "use strict";
 
+/**
+ * @typedef {Object} Async~State
+ * @property {Object|array} data - The data returned from the function.
+ * @property {boolean} error - Indicates whether the function had an error.
+ * @property {boolean} loading - Indicates whether the function is executing
+ * @property {function} execute - The function to call to execute the async function
+ */
+
+/**
+ * useAsync hook to handle executing asynchronous function
+ *
+ * @param {*} workflow - The async function that will be executed
+ * @returns {...Async~State} - The states and results and the call to execute function
+ */
 const useAsync = workflow => {
@@ -14,0 +28,0 @@ const [state, dispatch] = (0, _react.useReducer)(_reducer.reducer, {

lib/use-get.js

@@ -21,2 +21,18 @@ "use strict";
   referrer: 'no-referrer'
+  /**
+   * @typedef {Object} GetRequest~State
+   * @property {Object|array} data - The data returned from the function.
+   * @property {boolean} error - Indicates whether the function had an error.
+   * @property {boolean} loading - Indicates whether the function is executing
+   * @property {function} getUrl - The function to call to make the request
+   */
+
+  /**
+   * useGet hook to handle fetching data from a url
+   *
+   * @param {string} url - The url to request
+   * @param {object} config - The config object to be used with the fetch
+   * @returns {...GetRequest~State} - The states and results and the call to make the request
+   */
+
 };
@@ -40,2 +56,7 @@
   };
+  /**
+   * getUrl - HTTP Get the url passed in
+   *
+   * @param {string} [urlToGet=url] - the url to get
+   */
 
@@ -42,0 +63,0 @@ const getUrl = async (urlToGet = url) => {

lib/use-graphql.js

@@ -37,3 +37,19 @@ "use strict";
 };
+/**
+ * @typedef {Object} GraphQL~State
+ * @property {Object|array} data - The data returned from the function.
+ * @property {boolean} error - Indicates whether the function had an error.
+ * @property {boolean} loading - Indicates whether the function is executing
+ */
 
+/**
+ * useGet hook to handle fetching data from a url
+ *
+ * @param {string} url - The url to be used
+ * @param {string|object} query - The query to make
+ * @param {object} variables - The variables object to be used with query
+ * @returns {...GraphQL~State} - The states and results and the call to make the request
+ */
+
+
 const useGraphQL = function (url, query, variables) {
@@ -63,3 +79,3 @@ const [state, dispatch] = (0, _react.useReducer)(reducer, {
     fetchQuery(variables);
-  }, holder);
+  }, [fetchQuery, variables]);
   return { ...state
@@ -66,0 +82,0 @@ };

lib/use-post.js

@@ -21,2 +21,18 @@ "use strict";
   referrer: 'no-referrer'
+  /**
+   * @typedef {Object} PostRequest~State
+   * @property {Object|array} data - The data returned from the function.
+   * @property {boolean} error - Indicates whether the function had an error.
+   * @property {boolean} loading - Indicates whether the function is executing
+   * @property {function} postData - The function to call to make the POST request
+   */
+
+  /**
+   * usePost hook to handle posting data to a url
+   *
+   * @param {string} url - The url to request
+   * @param {object} config - The config object to be used with the fetch
+   * @returns {...PostRequest~State} - The states and results and the call to make the request
+   */
+
 };
@@ -40,2 +56,7 @@
   };
+  /**
+   * postData - Post data to url
+   *
+   * @param {object} data - the data to post
+   */
 
@@ -42,0 +63,0 @@ const postData = async data => {

lib/use-put.js

@@ -21,2 +21,18 @@ "use strict";
   referrer: 'no-referrer'
+  /**
+   * @typedef {Object} PutRequest~State
+   * @property {Object|array} data - The data returned from the function.
+   * @property {boolean} error - Indicates whether the function had an error.
+   * @property {boolean} loading - Indicates whether the function is executing
+   * @property {function} putData - The function to call to make the POST request
+   */
+
+  /**
+   * usePut hook to handle putting data to a url
+   *
+   * @param {string} url - The url to request
+   * @param {object} config - The config object to be used with the fetch
+   * @returns {...PutRequest~State} - The states and results and the call to make the request
+   */
+
 };
@@ -40,4 +56,9 @@
   };
+  /**
+   * putData - PUT data to url
+   *
+   * @param {object} data - the data to post
+   */
 
-  const postData = async data => {
+  const putData = async data => {
     await makeRequest({
@@ -54,3 +75,3 @@ method: 'PUT',
     loading,
-    postData
+    putData
   };
@@ -57,0 +78,0 @@ };

lib/use-request.js

@@ -21,2 +21,18 @@ "use strict";
   referrer: 'no-referrer'
+  /**
+   * @typedef {Object} Request~State
+   * @property {Object|array} data - The data returned from the function.
+   * @property {boolean} error - Indicates whether the function had an error.
+   * @property {boolean} loading - Indicates whether the function is executing
+   * @property {function} makeRequest - The function to call to make the request
+   */
+
+  /**
+   * useGet hook to handle fetching data from a url
+   *
+   * @param {string} url - The url to request
+   * @param {object} config - The config object to be used with the fetch
+   * @returns {...Request~State} - The states and results and the call to make the request
+   */
+
 };
@@ -35,2 +51,7 @@
   };
+  /**
+   * makeRequest - HTTP Get the url passed in
+   * @param {object} config - The fetch configuration
+   * @param {string} [urlToGet=url] - the url to get
+   */
 
@@ -37,0 +58,0 @@ const makeRequest = async (config = fullConfig, urlToFetch = url) => {

lib/use-title.js

@@ -10,2 +10,7 @@ "use strict";
 
+/**
+ * useTitle Hook to allow setting of the page title
+ *
+ * @param {string} title - The text to be used to set the page title
+ */
 const useTitle = title => {
@@ -12,0 +17,0 @@ (0, _react.useEffect)(() => {

package.json

 {
   "name": "@brightleaf/react-hooks",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "Useful react hooks",
@@ -5,0 +5,0 @@ "files": [

readme.md

@@ -5,2 +5,3 @@ # Brightleaf React Hooks
 
+* `useAsync` - Hook to an async function
 * `useFetch` - Hook to use Fetch
@@ -15,3 +16,27 @@ * `useGet` - Hook to make a get request
 * `useHover` - Hook for binding to hover of an element
+* `useEventListener` - Hook for binding to an hander to DOM event
+* `useFavicon` - Hook to set a favicon
+* `useTitle` - Hook to manipulate the page title
 
+## Async Hook
+
+```jsx
+import React, { useEffect } from 'react'
+import { useAsync } from '@brightleaf/react-hooks'
+
+export default () => {
+  const { loading, error, data, execute } = useAsync(asyncFunction)
+  useEffect(() => {
+    execute()
+  }, [])
+  if (loading) {
+    return <div>Executing Async Function</div>
+  }
+  if (error) {
+    return <div>Error executing async function</div>
+  }
+  return <div>{data}</div>
+}
+```
+
 ## GraphQL Hook
@@ -159,2 +184,14 @@
 
+## Title Hook
+
+```jsx
+import React, { useEffect } from 'react'
+import { useTitle } from '@brightleaf/react-hooks'
+
+export default () => {
+  useTitle('Brightleaf JS Hooks')
+
+  return <div>The Page</div>
+}
+```
 # NES Hook
@@ -161,0 +198,0 @@

No alert changes

Improved metrics

Total package byte prevSize

37342

increased by21.39%

Number of package files

23

increased by4.55%

Lines of code

1057

increased by16.67%

Number of lines in readme file

302

increased by13.96%

No dependency changes