Run Prettier on all files

Author: TimboKZ

docs/components/QuickDemo.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import {ContextMenuWrapper, useContextMenuEvent, useContextMenuTrigger} from 'react-context-menu-wrapper';
+import { ContextMenuWrapper, useContextMenuEvent, useContextMenuTrigger } from 'react-context-menu-wrapper';
 
 // Define the context menu component
 const MyContextMenu = React.memo(() => {
@@ -25,20 +25,24 @@ const QuickDemo = React.memo(() => {
     const menuId = 'my-witcher-menu';
 
     // Create React refs for the component that will serve as our triggers.
-    const geraltRef = useContextMenuTrigger({menuId: menuId, data: {name: 'Geralt'}});
-    const yenneferRef = useContextMenuTrigger({menuId: menuId, data: {name: 'Yennefer'}});
+    const geraltRef = useContextMenuTrigger({ menuId: menuId, data: { name: 'Geralt' } });
+    const yenneferRef = useContextMenuTrigger({ menuId: menuId, data: { name: 'Yennefer' } });
 
     return (
         <div>
             {/* Attach refs to the trigger components. */}
             <div className="box-container">
-                <div className="box" ref={geraltRef}>Geralt</div>
-                <div className="box" ref={yenneferRef}>Yennefer</div>
+                <div className="box" ref={geraltRef}>
+                    Geralt
+                </div>
+                <div className="box" ref={yenneferRef}>
+                    Yennefer
+                </div>
             </div>
 
             {/* We place `MyContextMenu` inside `ContextMenuWrapper */}
             <ContextMenuWrapper id={menuId}>
-                <MyContextMenu/>
+                <MyContextMenu />
             </ContextMenuWrapper>
         </div>
     );

docs/components/QuickDemoNoComments.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import {ContextMenuWrapper, useContextMenuEvent, useContextMenuTrigger} from 'react-context-menu-wrapper';
+import { ContextMenuWrapper, useContextMenuEvent, useContextMenuTrigger } from 'react-context-menu-wrapper';
 
 const MyContextMenu = React.memo(() => {
     const menuEvent = useContextMenuEvent();
@@ -14,18 +14,22 @@ const MyContextMenu = React.memo(() => {
 
 const QuickDemo = React.memo(() => {
     const menuId = 'my-witcher-menu';
-    const geraltRef = useContextMenuTrigger({menuId: menuId, data: {name: 'Geralt'}});
-    const yenneferRef = useContextMenuTrigger({menuId: menuId, data: {name: 'Yennefer'}});
+    const geraltRef = useContextMenuTrigger({ menuId: menuId, data: { name: 'Geralt' } });
+    const yenneferRef = useContextMenuTrigger({ menuId: menuId, data: { name: 'Yennefer' } });
 
     return (
         <div>
             <div className="box-container">
-                <div className="box" ref={geraltRef}>Geralt</div>
-                <div className="box" ref={yenneferRef}>Yennefer</div>
+                <div className="box" ref={geraltRef}>
+                    Geralt
+                </div>
+                <div className="box" ref={yenneferRef}>
+                    Yennefer
+                </div>
             </div>
 
             <ContextMenuWrapper id={menuId}>
-                <MyContextMenu/>
+                <MyContextMenu />
             </ContextMenuWrapper>
         </div>
     );

docs/components/SharedMenu.js

@@ -1,4 +1,4 @@
-import React, { useCallback,  useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { ContextMenuWrapper, useContextMenuEvent, useContextMenuTrigger } from 'react-context-menu-wrapper';
 
 const MyContextMenu = React.memo(({ selection, toggleSelection }) => {
@@ -17,7 +17,7 @@ const MyContextMenu = React.memo(({ selection, toggleSelection }) => {
 });
 
 const Box = React.memo(({ name, selected, menuId }) => {
-    const boxRef = useContextMenuTrigger( { menuId: menuId, data: name });
+    const boxRef = useContextMenuTrigger({ menuId: menuId, data: name });
 
     const text = selected ? `-[ ${name} ]-` : name;
     let className = 'box';

docs/markdown/04-Local-menu.md

@@ -23,7 +23,7 @@ const MyTriggerComponent = () => {
 **That's it!** The code snippet below shows a complete example of how local menus are defined.
 
 ```jsx
-import React, { useRef } from 'react';
+import React from 'react';
 import { ContextMenuWrapper, useContextMenuTrigger } from 'react-context-menu-wrapper';
 
 export const LocalMenuExample = () => {

lib/hooks.js.map

@@ -10,6 +10,6 @@
   </head>
   <body>
     <div id="rsg-root"></div>
-    <script src="build/bundle.3fd5242a.js"></script>
+    <script src="build/bundle.42284099.js"></script>
   </body>
 </html>

public/v3/build/bundle.3fd5242a.js public/v3/build/bundle.42284099.jspublic/v3/build/bundle.3fd5242a.js renamed to public/v3/build/bundle.42284099.js

@@ -4,7 +4,7 @@
  * @license MIT
  */
 
-import {Nullable} from 'tsdef';
+import { Nullable } from 'tsdef';
 import {
     addLongPressTimeout,
     clearLongPressTimeout,

public/v3/index.html

@@ -4,8 +4,8 @@
  * @license MIT
  */
 
-import React, {CSSProperties, useCallback, useContext, useEffect, useRef} from 'react';
-import {Nullable} from 'tsdef';
+import React, { CSSProperties, useCallback, useContext, useEffect, useRef } from 'react';
+import { Nullable } from 'tsdef';
 
 import {
     addGenericListener,
@@ -19,8 +19,8 @@ import {
     removeLocalMenuHandler,
     saveHandlerData,
 } from './globalState';
-import {ContextMenuEvent, DataAttributes, LocalHandlers} from './handlers';
-import {determineMenuPlacement, warn} from './util';
+import { ContextMenuEvent, DataAttributes, LocalHandlers } from './handlers';
+import { determineMenuPlacement, warn } from './util';
 
 const UNINITIALIZED_SENTINEL = {};
 export const useLazyValue = <T>(factory: () => T): T => {
@@ -34,10 +34,12 @@ export const useContextMenuEvent = <DataType = any>(): Nullable<ContextMenuEvent
     return useContext(ContextMenuEventContext);
 };
 
-export const useContextMenuTrigger = <RefType extends HTMLElement>(
-    parameters: { menuId?: string; data?: any, ref?: React.RefObject<RefType> },
-): React.RefObject<RefType> => {
-    const {menuId, data} = parameters;
+export const useContextMenuTrigger = <RefType extends HTMLElement>(parameters: {
+    menuId?: string;
+    data?: any;
+    ref?: React.RefObject<RefType>;
+}): React.RefObject<RefType> => {
+    const { menuId, data } = parameters;
 
     // If user did not provide a ref, we simply generate a new one.
     const ref = parameters.ref ? parameters.ref : useRef<RefType>(null);
@@ -51,7 +53,7 @@ export const useContextMenuTrigger = <RefType extends HTMLElement>(
     }, [data]);
 
     useEffect(() => {
-        const {current} = ref;
+        const { current } = ref;
         if (!current) return;
 
         if (menuId) current.setAttribute(DataAttributes.MenuId, menuId);
@@ -80,14 +82,14 @@ export const useMenuToggleMethods = (
     lastShowMenuEvent: Nullable<ContextMenuEvent>,
     setShowMenuEvent: (event: Nullable<ContextMenuEvent>) => void,
     onShow?: (event: ContextMenuEvent) => void,
-    onHide?: () => void,
+    onHide?: () => void
 ): [(event: ContextMenuEvent) => void, () => void] => {
     const showMenu = useCallback(
         (event: ContextMenuEvent) => {
             setShowMenuEvent(event);
             if (onShow) onShow(event);
         },
-        [setShowMenuEvent, onShow],
+        [setShowMenuEvent, onShow]
     );
     const hideMenu = useCallback(() => {
         if (lastShowMenuEvent === null) return;
@@ -100,11 +102,11 @@ export const useMenuToggleMethods = (
 export const useMenuPlacementStyle = (
     wrapperRef: React.RefObject<HTMLElement>,
     lastShowMenuEvent: Nullable<ContextMenuEvent>,
-    setMenuPlacementStyle: (style: Nullable<CSSProperties>) => void,
+    setMenuPlacementStyle: (style: Nullable<CSSProperties>) => void
 ) => {
     useEffect(() => {
         if (lastShowMenuEvent) {
-            const {clientX, clientY} = lastShowMenuEvent;
+            const { clientX, clientY } = lastShowMenuEvent;
 
             let menuWidth = 200;
             let menuHeight = 200;
@@ -131,7 +133,7 @@ export const useInternalHandlers = (
     hideOnOutsideClick?: boolean,
     hideOnEscape?: boolean,
     hideOnScroll?: boolean,
-    hideOnWindowResize?: boolean,
+    hideOnWindowResize?: boolean
 ) => {
     const isVisible = !!lastShowMenuEvent;
     const handleClick = useCallback(
@@ -147,15 +149,15 @@ export const useInternalHandlers = (
                 else hideMenu();
             }
         },
-        [hideMenu, isVisible, wrapperRef.current, hideOnSelfClick, hideOnOutsideClick],
+        [hideMenu, isVisible, wrapperRef.current, hideOnSelfClick, hideOnOutsideClick]
     );
     const handleKeydown = useCallback(
         (event: KeyboardEvent) => {
             if (!isVisible) return;
             // Hide on escape
             if (event.key === 'Escape' || event.code === 'Escape') hideMenu();
         },
-        [hideMenu, isVisible],
+        [hideMenu, isVisible]
     );
 
     useEffect(() => {