import { useNav } from '@slidev/client' /_ eslint-disable import/first _/ // ---cut--- import { defineContextMenuSetup } from '@slidev/types' import { computed } from 'vue' // ---cut-start--- // @ts-expect-error missing types // ---cut-end--- import Icon3DCursor from '~icons/carbon/3d-cursor'
export default defineContextMenuSetup((items) => { const { isPresenter } = useNav() return computed(() => [ ...items.value, { small: false, icon: Icon3DCursor, // if small is true, only the icon is shown label: 'Custom Menu Item', // or a Vue component action() { alert('Custom Menu Item Clicked!') }, disabled: isPresenter.value, }, ]) })
This will append a new menu item to the context menu.
To disable context menu globally, set `contextMenu` to `false` in the frontmatter. `contextMenu` can also be set to `dev` or `build` to only enable the context menu in development or build mode.