feat: hide context menu when onRenderContextMenu return false

README.md

@@ -333,10 +333,11 @@ const editor = new JSONEditor({
       }
       ```
 
-  - `onRenderContextMenu(items: ContextMenuItem[], context: { mode: 'tree' | 'text' | 'table', modal: boolean, selection: JSONEditorSelection | null }) : ContextMenuItem[] | undefined`.
+  - `onRenderContextMenu(items: ContextMenuItem[], context: { mode: 'tree' | 'text' | 'table', modal: boolean, selection: JSONEditorSelection | null }) : ContextMenuItem[] | false | undefined`.
     Callback which can be used to make changes to the context menu items. New items can
     be added, or existing items can be removed or reorganized. When the function
-    returns `undefined`, the original `items` will be applied. Using the context values `mode`, `modal` and `selection`, different actions can be taken depending on the mode of the editor, whether the editor is rendered inside a modal or not and the path of selection.
+    returns `undefined`, the original `items` will be applied and the context menu will be displayed when `readOnly` is `false`. When the function
+    returns `false`, the context menu will never be displayed. Using the context values `mode`, `modal` and `selection`, different actions can be taken depending on the mode of the editor, whether the editor is rendered inside a modal or not and the path of selection.
 
     A menu item `ContextMenuItem` can be one of the following types:
 

src/lib/components/modes/JSONEditorRoot.svelte

@@ -117,7 +117,7 @@
 
   let handleRenderContextMenu: OnRenderContextMenuInternal
   $: handleRenderContextMenu = (items: ContextMenuItem[]) => {
-    return onRenderContextMenu(items, { mode, modal: insideModal, selection }) || items
+    return onRenderContextMenu(items, { mode, modal: insideModal, selection }) ?? (readOnly ? false: items)
   }
 
   export function patch(operations: JSONPatchDocument): JSONPatchResult {

src/lib/components/modes/tablemode/TableMode.svelte

@@ -979,7 +979,7 @@
   }
 
   function handleContextMenu(event: Event) {
-    if (readOnly || isEditingSelection(documentState.selection)) {
+    if (!onRenderContextMenu([])  || isEditingSelection(documentState.selection)) {
       return
     }
 
@@ -1028,7 +1028,7 @@
   }
 
   function handleContextMenuFromTableMenu(event: MouseEvent) {
-    if (readOnly) {
+    if (!onRenderContextMenu([]) ) {
       return
     }
 

src/lib/components/modes/treemode/TreeMode.svelte

@@ -1879,7 +1879,7 @@
   }
 
   function handleContextMenu(event?: Event) {
-    if (readOnly || isEditingSelection(documentState.selection)) {
+    if (!onRenderContextMenu([]) || isEditingSelection(documentState.selection)) {
       return
     }
 
@@ -1928,7 +1928,7 @@
   }
 
   function handleContextMenuFromTreeMenu(event: MouseEvent) {
-    if (readOnly) {
+    if (!onRenderContextMenu([])) {
       return
     }
 

src/lib/types.ts

@@ -313,8 +313,8 @@ export type RenderContextMenuContext = RenderMenuContext & { selection: JSONEdit
 export type OnRenderContextMenu = (
   items: ContextMenuItem[],
   context: RenderContextMenuContext
-) => ContextMenuItem[] | undefined
-export type OnRenderContextMenuInternal = (items: ContextMenuItem[]) => ContextMenuItem[]
+) => ContextMenuItem[] | false | undefined
+export type OnRenderContextMenuInternal = (items: ContextMenuItem[]) => ContextMenuItem[] | false
 export type OnError = (error: Error) => void
 export type OnFocus = () => void
 export type OnBlur = () => void