@superrb/react-addons 1.2.2 → 1.2.3

package/context.js

@@ -1,7 +1,7 @@
 /**
  * Context
  */
-import { CookiesContext, CookiesContextProvider, } from "./context/cookies-context-provider";
-import { ModalContext, ModalContextProvider, } from "./context/modal-context-provider";
-import { NavContext, NavContextProvider } from "./context/nav-context-provider";
+import { CookiesContext, CookiesContextProvider, } from './context/cookies-context-provider';
+import { ModalContext, ModalContextProvider, } from './context/modal-context-provider';
+import { NavContext, NavContextProvider } from './context/nav-context-provider';
 export { CookiesContext, CookiesContextProvider, ModalContext, ModalContextProvider, NavContext, NavContextProvider, };

package/hooks/use-async.d.ts

@@ -1,4 +1,4 @@
-export type Status = "idle" | "pending" | "success" | "error";
+export type Status = 'idle' | 'pending' | 'success' | 'error';
 interface ReturnType<T, E = string> {
     execute: (...args: any) => Promise<void>;
     status: Status;

package/hooks/use-async.js

@@ -1,13 +1,12 @@
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useState } from 'react';
 // Hook
 const useAsync = (asyncFunction, // eslint-disable-line @typescript-eslint/no-explicit-any
-immediate = false, dependencies = [] // eslint-disable-line @typescript-eslint/no-explicit-any
-) => {
-    const [status, setStatus] = useState("idle");
+immediate = false, dependencies = []) => {
+    const [status, setStatus] = useState('idle');
     const [value, setValue] = useState(null);
     const [error, setError] = useState(null);
     useEffect(() => {
-        setStatus("idle");
+        setStatus('idle');
         setValue(null);
         setError(null);
     }, dependencies);
@@ -16,17 +15,17 @@ immediate = false, dependencies = [] // eslint-disable-line @typescript-eslint/n
     // useCallback ensures the below useEffect is not called
     // on every render, but only if asyncFunction changes.
     const execute = useCallback(async (...args) => {
-        setStatus("pending");
+        setStatus('pending');
         setValue(null);
         setError(null);
         try {
             const response = await asyncFunction(...args);
             setValue(response);
-            setStatus("success");
+            setStatus('success');
         }
         catch (err) {
             setError(err.message);
-            setStatus("error");
+            setStatus('error');
         }
     }, [asyncFunction]);
     // Call execute if we want to fire it right away.

package/hooks/use-draggable-scroll.d.ts

@@ -1,4 +1,4 @@
-import { MouseEventHandler, MutableRefObject } from "react";
+import { MouseEventHandler, MutableRefObject } from 'react';
 interface Events {
     onMouseDown: MouseEventHandler<HTMLElement>;
 }

package/hooks/use-draggable-scroll.js

@@ -1,6 +1,6 @@
-import { useEffect, useRef, useState, } from "react";
-import { useDraggable } from "react-use-draggable-scroll";
-import { useEventListener, useIsInViewport } from "../hooks";
+import { useEffect, useRef, useState, } from 'react';
+import { useDraggable } from 'react-use-draggable-scroll';
+import { useEventListener, useIsInViewport } from '../hooks';
 const useDraggableScroll = (ref, { className, ...opts }) => {
     const { isInViewport, setRef } = useIsInViewport(false);
     const { events } = useDraggable(ref, {
@@ -16,7 +16,7 @@ const useDraggableScroll = (ref, { className, ...opts }) => {
         const shouldScroll = ref.current?.scrollWidth > ref.current?.clientWidth ||
             ref.current?.scrollHeight > ref.current?.clientHeight;
         setShouldScroll(shouldScroll);
-        const fn = shouldScroll ? "add" : "remove";
+        const fn = shouldScroll ? 'add' : 'remove';
         ref.current?.classList[fn](`${className}--draggable`);
     }, [ref.current]);
     const onDragStart = () => {
@@ -34,8 +34,8 @@ const useDraggableScroll = (ref, { className, ...opts }) => {
             ref.current?.classList.remove(`${className}--dragging`);
         }, 100);
     };
-    useEventListener("mousemove", onDragMove, undefined, undefined, isInViewport && shouldScroll);
-    useEventListener("mouseup", onDragEnd, undefined, undefined, isInViewport && shouldScroll);
+    useEventListener('mousemove', onDragMove, undefined, undefined, isInViewport && shouldScroll);
+    useEventListener('mouseup', onDragEnd, undefined, undefined, isInViewport && shouldScroll);
     useEffect(() => {
         if (!shouldScroll) {
             setModifiedEvents({
@@ -45,7 +45,7 @@ const useDraggableScroll = (ref, { className, ...opts }) => {
         }
         const originalOnMouseDown = events.onMouseDown;
         setModifiedEvents({
-            onMouseDown: event => {
+            onMouseDown: (event) => {
                 onDragStart();
                 originalOnMouseDown(event);
             },

package/hooks/use-event-listener.js

@@ -1,4 +1,4 @@
-import { useEffect, useRef } from "react";
+import { useEffect, useRef } from 'react';
 // Hook
 const useEventListener = (eventName, handler, options = {}, element, flag = true) => {
     // Create a ref that stores handler
@@ -21,7 +21,7 @@ const useEventListener = (eventName, handler, options = {}, element, flag = true
         if (!isSupported)
             return;
         // Create event listener that calls handler function stored in ref
-        const eventListener = event => savedHandler.current(event);
+        const eventListener = (event) => savedHandler.current(event);
         if (flag) {
             // Add event listener
             elementRef.current.addEventListener(eventName, eventListener, options);
@@ -40,7 +40,6 @@ const useEventListener = (eventName, handler, options = {}, element, flag = true
         element,
         elementRef.current,
         flag,
-    ] // Re-run if eventName or element changes
-    );
+    ]);
 };
 export default useEventListener;

package/hooks/use-hide-on-scroll.js

@@ -1,5 +1,5 @@
-import { useEventListener } from "../hooks";
-import { useCallback, useEffect, useState } from "react";
+import { useEventListener } from '../hooks';
+import { useCallback, useEffect, useState } from 'react';
 const useHideOnScroll = (hiddenOnLoad = false) => {
     const [hidden, setHidden] = useState(hiddenOnLoad);
     const handleScroll = useCallback(() => {
@@ -26,10 +26,10 @@ const useHideOnScroll = (hiddenOnLoad = false) => {
     useEffect(() => {
         handleScroll();
     }, []);
-    useEventListener("scroll", handleScroll, { passive: true }, typeof window !== "undefined" ? window : undefined);
-    useEventListener("resize", handleLoad, { passive: true }, typeof window !== "undefined" ? window : undefined);
-    useEventListener("popstate", handleLoad, { passive: true }, typeof window !== "undefined" ? window : undefined);
-    useEventListener("pageshow", handleLoad, { passive: true }, typeof window !== "undefined" ? window : undefined);
+    useEventListener('scroll', handleScroll, { passive: true }, typeof window !== 'undefined' ? window : undefined);
+    useEventListener('resize', handleLoad, { passive: true }, typeof window !== 'undefined' ? window : undefined);
+    useEventListener('popstate', handleLoad, { passive: true }, typeof window !== 'undefined' ? window : undefined);
+    useEventListener('pageshow', handleLoad, { passive: true }, typeof window !== 'undefined' ? window : undefined);
     return hidden;
 };
 export default useHideOnScroll;

package/hooks/use-is-in-viewport.js

@@ -5,8 +5,8 @@ const useIsInViewport = (initial = false, rootMargin = '0px 0px', threshold = [0
     const observer = useRef();
     useEffect(() => {
         if (!observer.current) {
-            observer.current = new IntersectionObserver(entries => {
-                entries.forEach(entry => {
+            observer.current = new IntersectionObserver((entries) => {
+                entries.forEach((entry) => {
                     setIsInViewport(entry.isIntersecting && entry.intersectionRatio > 0);
                 });
             }, {

package/hooks/use-is-overflowing.d.ts

@@ -0,0 +1,4 @@
+import { MutableRefObject } from 'react';
+declare const useIsOverflowing: ({ current }: MutableRefObject<HTMLElement>) => boolean;
+export default useIsOverflowing;
+//# sourceMappingURL=use-is-overflowing.d.ts.map

package/hooks/use-is-overflowing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-is-overflowing.d.ts","sourceRoot":"","sources":["../src/hooks/use-is-overflowing.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAA;AAExC,QAAA,MAAM,gBAAgB,gBAAiB,iBAAiB,WAAW,CAAC,YAGpB,CAAA;AAEhD,eAAe,gBAAgB,CAAA"}

package/hooks/use-is-overflowing.js

@@ -0,0 +1,4 @@
+const useIsOverflowing = ({ current }) => current &&
+    (current.scrollWidth > current.clientWidth ||
+        current.scrollHeight > current.clientHeight);
+export default useIsOverflowing;

package/hooks/use-modal.js

@@ -1,5 +1,5 @@
-import { useContext, useEffect, useState } from "react";
-import { ModalContext } from "../context";
+import { useContext, useEffect, useState } from 'react';
+import { ModalContext } from '../context';
 const useModal = (name) => {
     const [open, setOpen] = useState(false);
     const { openState, openModal, closeModal } = useContext(ModalContext);

package/hooks/use-parallax.js

@@ -1,5 +1,5 @@
-import { useEventListener, useMotionAllowed } from "../hooks";
-import { useCallback } from "react";
+import { useEventListener, useMotionAllowed } from '../hooks';
+import { useCallback } from 'react';
 const useParallax = (items, flag = true) => {
     const isMotionAllowed = useMotionAllowed();
     const onScroll = useCallback((event) => {
@@ -13,6 +13,6 @@ const useParallax = (items, flag = true) => {
             });
         });
     }, [items]);
-    useEventListener("scroll", onScroll, { passive: true }, undefined, flag && isMotionAllowed);
+    useEventListener('scroll', onScroll, { passive: true }, undefined, flag && isMotionAllowed);
 };
 export default useParallax;

package/hooks.d.ts

@@ -1,16 +1,17 @@
 /**
  * Hooks
  */
-import useAsync from "./hooks/use-async";
-import useDraggableScroll from "./hooks/use-draggable-scroll";
-import useEventListener from "./hooks/use-event-listener";
-import useHideOnScroll from "./hooks/use-hide-on-scroll";
-import useId from "./hooks/use-id";
-import useIsInViewport from "./hooks/use-is-in-viewport";
-import useIsMobile from "./hooks/use-is-mobile";
-import useLockBodyScroll from "./hooks/use-lock-body-scroll";
-import useModal from "./hooks/use-modal";
-import useMotionAllowed from "./hooks/use-motion-allowed";
-import useParallax from "./hooks/use-parallax";
-export { useAsync, useDraggableScroll, useEventListener, useHideOnScroll, useId, useIsInViewport, useIsMobile, useLockBodyScroll, useModal, useMotionAllowed, useParallax, };
+import useAsync from './hooks/use-async';
+import useDraggableScroll from './hooks/use-draggable-scroll';
+import useEventListener from './hooks/use-event-listener';
+import useHideOnScroll from './hooks/use-hide-on-scroll';
+import useId from './hooks/use-id';
+import useIsInViewport from './hooks/use-is-in-viewport';
+import useIsOverflowing from './hooks/use-is-overflowing';
+import useIsMobile from './hooks/use-is-mobile';
+import useLockBodyScroll from './hooks/use-lock-body-scroll';
+import useModal from './hooks/use-modal';
+import useMotionAllowed from './hooks/use-motion-allowed';
+import useParallax from './hooks/use-parallax';
+export { useAsync, useDraggableScroll, useEventListener, useHideOnScroll, useId, useIsOverflowing, useIsInViewport, useIsMobile, useLockBodyScroll, useModal, useMotionAllowed, useParallax, };
 //# sourceMappingURL=hooks.d.ts.map

package/hooks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["src/hooks.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,kBAAkB,MAAM,8BAA8B,CAAA;AAC7D,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,KAAK,MAAM,gBAAgB,CAAA;AAClC,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,WAAW,MAAM,uBAAuB,CAAA;AAC/C,OAAO,iBAAiB,MAAM,8BAA8B,CAAA;AAC5D,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,sBAAsB,CAAA;AAE9C,OAAO,EACL,QAAQ,EACR,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,EACf,KAAK,EACL,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,gBAAgB,EAChB,WAAW,GACZ,CAAA"}
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["src/hooks.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,kBAAkB,MAAM,8BAA8B,CAAA;AAC7D,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,KAAK,MAAM,gBAAgB,CAAA;AAClC,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,uBAAuB,CAAA;AAC/C,OAAO,iBAAiB,MAAM,8BAA8B,CAAA;AAC5D,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,sBAAsB,CAAA;AAE9C,OAAO,EACL,QAAQ,EACR,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,EACf,KAAK,EACL,gBAAgB,EAChB,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,gBAAgB,EAChB,WAAW,GACZ,CAAA"}

package/hooks.js

@@ -1,15 +1,16 @@
 /**
  * Hooks
  */
-import useAsync from "./hooks/use-async";
-import useDraggableScroll from "./hooks/use-draggable-scroll";
-import useEventListener from "./hooks/use-event-listener";
-import useHideOnScroll from "./hooks/use-hide-on-scroll";
-import useId from "./hooks/use-id";
-import useIsInViewport from "./hooks/use-is-in-viewport";
-import useIsMobile from "./hooks/use-is-mobile";
-import useLockBodyScroll from "./hooks/use-lock-body-scroll";
-import useModal from "./hooks/use-modal";
-import useMotionAllowed from "./hooks/use-motion-allowed";
-import useParallax from "./hooks/use-parallax";
-export { useAsync, useDraggableScroll, useEventListener, useHideOnScroll, useId, useIsInViewport, useIsMobile, useLockBodyScroll, useModal, useMotionAllowed, useParallax, };
+import useAsync from './hooks/use-async';
+import useDraggableScroll from './hooks/use-draggable-scroll';
+import useEventListener from './hooks/use-event-listener';
+import useHideOnScroll from './hooks/use-hide-on-scroll';
+import useId from './hooks/use-id';
+import useIsInViewport from './hooks/use-is-in-viewport';
+import useIsOverflowing from './hooks/use-is-overflowing';
+import useIsMobile from './hooks/use-is-mobile';
+import useLockBodyScroll from './hooks/use-lock-body-scroll';
+import useModal from './hooks/use-modal';
+import useMotionAllowed from './hooks/use-motion-allowed';
+import useParallax from './hooks/use-parallax';
+export { useAsync, useDraggableScroll, useEventListener, useHideOnScroll, useId, useIsOverflowing, useIsInViewport, useIsMobile, useLockBodyScroll, useModal, useMotionAllowed, useParallax, };

package/index.d.ts

@@ -1,7 +1,7 @@
-import * as Components from "./components";
-import * as Context from "./context";
-import * as Hooks from "./hooks";
-import * as Storage from "./storage";
-import * as Utils from "./utils";
+import * as Components from './components';
+import * as Context from './context';
+import * as Hooks from './hooks';
+import * as Storage from './storage';
+import * as Utils from './utils';
 export { Components, Context, Hooks, Storage, Utils };
 //# sourceMappingURL=index.d.ts.map

package/index.js

@@ -1,7 +1,7 @@
-import * as Components from "./components";
-import * as Context from "./context";
-import * as Hooks from "./hooks";
-import * as Storage from "./storage";
+import * as Components from './components';
+import * as Context from './context';
+import * as Hooks from './hooks';
+import * as Storage from './storage';
 // import * as Types from './types'
-import * as Utils from "./utils";
+import * as Utils from './utils';
 export { Components, Context, Hooks, Storage, Utils };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@superrb/react-addons",
   "type": "module",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "main": "index.js",
   "repository": "https://github.com/superrbstudio/react-addons",
   "author": "@molovo",
@@ -18,8 +18,6 @@
   },
   "peerDependencies": {
     "@superrb/react-addons": "^1.0.0",
-    "@types/node": "^20.5.7",
-    "@types/react": "^18.2.21",
     "react": "^18.2.0",
     "typescript": "^5.2.2"
   },
@@ -31,6 +29,15 @@
   },
   "devDependencies": {
     "@types/js-cookie": "^3.0.3",
+    "@types/node": "^20.5.7",
+    "@types/react": "^18.2.21",
+    "eslint": "^8.50.0",
+    "eslint-config-next": "^13.5.3",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "typescript-eslint": "^0.0.1-alpha.0",
     "watch": "^1.0.2"
   }
 }

package/storage.js

@@ -1,3 +1,3 @@
-import { storageFactory } from "./utils/storage-factory";
+import { storageFactory } from './utils/storage-factory';
 export const local = storageFactory(() => localStorage);
 export const session = storageFactory(() => sessionStorage);