Files
Panama/user/agents/skills/slidev/references/core-global-context.md
T
Gabriel Brown 89761a7da3 Keep the personal half of the desktop in one place, and ask before installing it
Agent instructions, skills, SSH host aliases and expansion triggers are worth
having identical on every machine one person owns, and belong in none of the
shared configuration. They live in user/ now, with a manifest saying where each
piece goes and a link-user stage that puts it there.

That stage does nothing unless the machine said yes. Somebody who clones Panama
to try the desktop keeps their own ~/.claude/CLAUDE.md exactly where it was;
the question names the destinations and defaults to no. Anything displaced goes
to config/old rather than being deleted.

~/.claude/CLAUDE.md and ~/.codex/AGENTS.md were byte-identical copies of one
file, which is the drift this exists to prevent.

Also adds the vitals toggles for the battery and Claude usage readouts, which
had preferences and no way to reach them.
2026-08-22 08:54:43 -04:00

2.8 KiB

name, description
name description
global-context Access navigation, slide info, and configuration programmatically

Global Context & API

Access navigation, slide info, and configuration programmatically.

Template Variables

Available in slides and components:

Page {{ $page }} of {{ $nav.total }}
Title: {{ $slidev.configs.title }}

$nav

Navigation state and controls:

Property Type Description
$nav.currentPage number Current page (1-indexed)
$nav.currentLayout string Current layout name
$nav.total number Total slides
$nav.isPresenter boolean In presenter mode
$nav.next() function Next click/slide
$nav.prev() function Previous click/slide
$nav.nextSlide() function Next slide
$nav.prevSlide() function Previous slide
$nav.go(n) function Go to slide n

$slidev

Global context:

Property Description
$slidev.configs Project config (title, etc.)
$slidev.themeConfigs Theme config

$frontmatter

Current slide frontmatter:

Layout: {{ $frontmatter.layout }}

$clicks

Current click count on slide.

$page

Current page number (1-indexed).

$renderContext

Current render context:

  • 'slide' - Normal slide view
  • 'overview' - Overview mode
  • 'presenter' - Presenter mode
  • 'previewNext' - Next slide preview

Composables

Import from @slidev/client:

import {
  useNav,
  useDarkMode,
  useIsSlideActive,
  useSlideContext,
  onSlideEnter,
  onSlideLeave,
} from '@slidev/client'

useNav

const nav = useNav()
nav.next()
nav.go(5)
console.log(nav.currentPage)

useDarkMode

const { isDark, toggle } = useDarkMode()

useIsSlideActive

const isActive = useIsSlideActive()
// Returns ref<boolean>

useSlideContext

const { $page, $clicks, $frontmatter } = useSlideContext()

Lifecycle Hooks

import { onSlideEnter, onSlideLeave } from '@slidev/client'

onSlideEnter((to, from) => {
  // Slide became active
  startAnimation()
})

onSlideLeave((to, from) => {
  // Slide became inactive
  cleanup()
})

Important: Don't use onMounted/onUnmounted in slides - component instance persists. Use onSlideEnter/onSlideLeave instead.

Conditional Rendering Examples

<!-- Show only in presenter mode -->
<div v-if="$nav.isPresenter">
  Presenter notes
</div>

<!-- Hide on cover slide -->
<footer v-if="$nav.currentLayout !== 'cover'">
  Page {{ $nav.currentPage }}
</footer>

<!-- Different content by context -->
<template v-if="$renderContext === 'slide'">
  Normal view
</template>
<template v-else-if="$renderContext === 'presenter'">
  Presenter view
</template>

Type Imports

import type { TocItem } from '@slidev/types'