| 1 | /// <reference types="unplugin-icons/types/vue3" /> |
| 2 | |
| 3 | import type { ContextMenuItem } from '@slidev/types' |
| 4 | import type { ComputedRef } from 'vue' |
| 5 | import { computed } from 'vue' |
| 6 | import setups from '#slidev/setups/context-menu' |
| 7 | import { useDrawings } from '../composables/useDrawings' |
| 8 | import { useNav } from '../composables/useNav' |
| 9 | import { fullscreen, showEditor, toggleOverview } from '../state' |
| 10 | |
| 11 | // @unocss-include |
| 12 | |
| 13 | let items: ComputedRef<ContextMenuItem[]> | undefined |
| 14 | |
| 15 | export default () => { |
| 16 | if (items) |
| 17 | return items |
| 18 | |
| 19 | const { |
| 20 | next, |
| 21 | nextSlide, |
| 22 | prev, |
| 23 | prevSlide, |
| 24 | hasNext, |
| 25 | hasPrev, |
| 26 | currentPage, |
| 27 | total, |
| 28 | isPresenter, |
| 29 | enterPresenter, |
| 30 | exitPresenter, |
| 31 | isEmbedded, |
| 32 | isPresenterAvailable, |
| 33 | } = useNav() |
| 34 | const { drawingEnabled } = useDrawings() |
| 35 | const { |
| 36 | isFullscreen, |
| 37 | toggle: toggleFullscreen, |
| 38 | } = fullscreen |
| 39 | |
| 40 | return items = setups.reduce( |
| 41 | (items, fn) => fn(items), |
| 42 | computed(() => [ |
| 43 | { |
| 44 | small: true, |
| 45 | icon: 'i-carbon:arrow-left', |
| 46 | label: 'Previous Click', |
| 47 | action: prev, |
| 48 | disabled: !hasPrev.value, |
| 49 | }, |
| 50 | { |
| 51 | small: true, |
| 52 | icon: 'i-carbon:arrow-right', |
| 53 | label: 'Next Click', |
| 54 | action: next, |
| 55 | disabled: !hasNext.value, |
| 56 | }, |
| 57 | { |
| 58 | small: true, |
| 59 | icon: 'i-carbon:arrow-up', |
| 60 | label: 'Previous Slide', |
| 61 | action: prevSlide, |
| 62 | disabled: currentPage.value <= 1, |
| 63 | }, |
| 64 | { |
| 65 | small: true, |
| 66 | icon: 'i-carbon:arrow-down', |
| 67 | label: 'Next Slide', |
| 68 | action: nextSlide, |
| 69 | disabled: currentPage.value >= total.value, |
| 70 | }, |
| 71 | 'separator', |
| 72 | { |
| 73 | icon: 'i-carbon:text-annotation-toggle', // IconTextNotationToggle, |
| 74 | label: showEditor.value ? 'Hide editor' : 'Show editor', |
| 75 | action: () => (showEditor.value = !showEditor.value), |
| 76 | show: __DEV__, |
| 77 | }, |
| 78 | { |
| 79 | icon: 'i-carbon:pen', |
| 80 | label: drawingEnabled.value ? 'Hide drawing toolbar' : 'Show drawing toolbar', |
| 81 | action: () => (drawingEnabled.value = !drawingEnabled.value), |
| 82 | }, |
| 83 | { |
| 84 | icon: 'i-carbon:apps', |
| 85 | label: 'Show slide overview', |
| 86 | action: toggleOverview, |
| 87 | }, |
| 88 | isPresenter.value && { |
| 89 | icon: 'i-carbon:presentation-file', |
| 90 | label: 'Exit Presenter Mode', |
| 91 | action: exitPresenter, |
| 92 | }, |
| 93 | __SLIDEV_FEATURE_PRESENTER__ && isPresenterAvailable.value && { |
| 94 | icon: 'i-carbon:user-speaker', |
| 95 | label: 'Enter Presenter Mode', |
| 96 | action: enterPresenter, |
| 97 | }, |
| 98 | !isEmbedded.value && { |
| 99 | icon: isFullscreen.value ? 'i-carbon:minimize' : 'i-carbon:maximize', |
| 100 | label: isFullscreen.value ? 'Close fullscreen' : 'Enter fullscreen', |
| 101 | action: toggleFullscreen, |
| 102 | }, |
| 103 | ].filter(Boolean) as ContextMenuItem[]), |
| 104 | ) |
| 105 | } |
| 106 |