# ivyforms/0.6/frontend/src/stores/contextMenuStore.ts

The Innovative Form Builder – IvyForms, version 0.6. 77 lines.

- Page: https://pluginprobe.com/plugins/ivyforms/0.6/code/frontend/src/stores/contextMenuStore.ts
- Raw: https://pluginprobe.com/plugins/ivyforms/0.6/raw/frontend/src/stores/contextMenuStore.ts
- Modified: 2025-11-19T18:42:10+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/ivyforms/0.6/code/frontend/src/stores/contextMenuStore.ts#L10-L20`.

```typescript
import type { ShallowRef, DefineComponent, Ref } from 'vue'
import { defineStore } from 'pinia'
import { ref, shallowRef } from 'vue'
import IvyContextMenuActions from '@/views/_components/context-menu/IvyContextMenuActions.vue'

export const useContextMenuStore = defineStore('contextMenu', () => {
  const isOpen: Ref<boolean> = ref(false)
  const contextMenuContent: ShallowRef<DefineComponent | null> = shallowRef(null)
  const contextMenuProps: Ref<{
    actions?: []
    menuTitle?: string
    contextMenuButtonRef?: HTMLElement | DefineComponent
    entityId?: number
    onClose?: () => void
  }> = ref({})

  const openContextMenu = (props = {}) => {
    if (isOpen.value) {
      closeContextMenu() // Close any existing menu
    }

    contextMenuContent.value = IvyContextMenuActions as unknown as DefineComponent
    contextMenuProps.value = props

    const buttonRef = contextMenuProps.value.contextMenuButtonRef
    let resolvedButtonRef: HTMLElement | null = null

    if (buttonRef && '$el' in buttonRef) {
      resolvedButtonRef = (buttonRef as DefineComponent).$el as HTMLElement
    } else if (buttonRef instanceof HTMLElement) {
      resolvedButtonRef = buttonRef
    }

    if (resolvedButtonRef) {
      resolvedButtonRef.classList.add('opened')
    }

    isOpen.value = true
  }

  const closeContextMenu = () => {
    isOpen.value = false
    const buttonRef = contextMenuProps.value.contextMenuButtonRef
    let resolvedButtonRef: HTMLElement | null = null

    if (buttonRef && '$el' in buttonRef) {
      resolvedButtonRef = (buttonRef as DefineComponent).$el as HTMLElement
    } else if (buttonRef instanceof HTMLElement) {
      resolvedButtonRef = buttonRef
    }

    if (resolvedButtonRef) {
      resolvedButtonRef.classList.remove('opened')
    }

    // Trigger the onClose callback if it exists
    if (typeof contextMenuProps.value.onClose === 'function') {
      contextMenuProps.value.onClose()
    }

    setTimeout(() => {
      if (!isOpen.value) {
        contextMenuProps.value = {}
        contextMenuContent.value = null
      }
    }, 200)
  }

  return {
    isOpen,
    contextMenuContent,
    contextMenuProps,
    openContextMenu,
    closeContextMenu,
  }
})

```