useTourContext

Low-level access to the raw TourContext value. Most consumers should use useTour — useTourContext is the escape hatch when you need direct access to context internals (custom hooks, testing, headless integrations).

Usage

import { useTourContext } from '@tour-kit/core';

function CustomTourBridge() {
  const ctx = useTourContext();
  // ctx is TourContextValue — full state machine + actions
  return <span>Step: {ctx.state.currentStepIndex}</span>;
}

useTourContext throws if no <TourProvider> is mounted above. Use useTourContextOptional if rendering inside a tree that may or may not have a provider.

Return Value

Returns TourContextValue — the full state + actions object. See Types for the complete shape.

useTourContextOptional

Same as useTourContext but returns null instead of throwing when no provider is present. Useful for components that may render outside a tour context.

import { useTourContextOptional } from '@tour-kit/core';

function ContextAwareButton() {
  const ctx = useTourContextOptional();
  if (!ctx) return <button>Static</button>;
  return <button onClick={ctx.actions.next}>Next</button>;
}

Returns TourContextValue | null.