promptslide 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,377 @@
+import { Variants, Transition } from 'framer-motion';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React$1 from 'react';
+import { ClassValue } from 'clsx';
+
+/**
+ * Centralized animation configuration for the slide deck framework.
+ * All animation timings, easings, and spring configs are defined here.
+ */
+/** Duration for slide-to-slide transitions (seconds) */
+declare const SLIDE_TRANSITION_DURATION = 0.3;
+/** Duration for morph/layout animations between slides (seconds) */
+declare const MORPH_DURATION = 0.8;
+/** Duration for within-slide step animations (seconds) */
+declare const STEP_ANIMATION_DURATION = 0.4;
+/** Default stagger delay for grouped animations (seconds) */
+declare const STAGGER_DELAY = 0.1;
+declare const EASE_DEFAULT: "easeInOut";
+declare const EASE_OUT: "easeOut";
+declare const EASE_IN: "easeIn";
+/** Smooth ease-in-out curve for morph animations (cubic bezier) */
+declare const EASE_MORPH: readonly [0.4, 0, 0.2, 1];
+/** Spring config for snappy, responsive animations */
+declare const SPRING_SNAPPY: {
+    type: "spring";
+    stiffness: number;
+    damping: number;
+};
+/** Spring config for smooth, gentle animations */
+declare const SPRING_SMOOTH: {
+    type: "spring";
+    stiffness: number;
+    damping: number;
+};
+/** Spring config for bouncy animations */
+declare const SPRING_BOUNCY: {
+    type: "spring";
+    stiffness: number;
+    damping: number;
+};
+/** Standard transition for slide transitions */
+declare const SLIDE_TRANSITION: {
+    readonly duration: 0.3;
+    readonly ease: "easeInOut";
+};
+/** Standard transition for morph animations (smooth ease-in-out) */
+declare const MORPH_TRANSITION: {
+    duration: number;
+    ease: readonly [0.4, 0, 0.2, 1];
+};
+/** Standard transition for step animations (spring-based, duration computed from stiffness/damping) */
+declare const STEP_TRANSITION: {
+    type: "spring";
+    stiffness: number;
+    damping: number;
+};
+/** Distance for slide animations */
+declare const SLIDE_DISTANCE = 100;
+/** Distance for within-slide element animations */
+declare const ELEMENT_SLIDE_DISTANCE = 30;
+/** Standard slide dimensions (16:9 aspect ratio) */
+declare const SLIDE_DIMENSIONS: {
+    readonly width: 1280;
+    readonly height: 720;
+    readonly aspectRatio: number;
+};
+
+/**
+ * Slide transition variants for the slide deck framework.
+ * These define how slides enter and exit during navigation.
+ */
+
+type SlideTransitionType = "fade" | "slide-left" | "slide-right" | "slide-up" | "slide-down" | "zoom" | "zoom-fade" | "morph" | "none";
+interface SlideTransitionConfig {
+    /** The transition type */
+    type: SlideTransitionType;
+    /** Optional custom duration (overrides default) */
+    duration?: number;
+    /** Whether to use directional transitions based on navigation direction */
+    directional?: boolean;
+}
+declare const SLIDE_VARIANTS: Record<SlideTransitionType, Variants>;
+declare function createDirectionalVariants(axis?: "x" | "y"): (direction: number) => Variants;
+/** Horizontal directional slide (left/right based on direction) */
+declare const directionalSlideX: (direction: number) => Variants;
+/** Vertical directional slide (up/down based on direction) */
+declare const directionalSlideY: (direction: number) => Variants;
+declare function getSlideVariants(config: SlideTransitionConfig | SlideTransitionType, direction?: number): Variants;
+declare function getSlideTransition(config?: SlideTransitionConfig | SlideTransitionType): {
+    duration: number;
+    ease: typeof SLIDE_TRANSITION.ease;
+};
+declare const DEFAULT_SLIDE_TRANSITION: SlideTransitionType;
+
+/**
+ * Shared types for the slide deck framework.
+ */
+
+/**
+ * Props that all slide components receive.
+ */
+interface SlideProps {
+    slideNumber: number;
+    totalSlides: number;
+}
+/**
+ * A React component that renders a slide.
+ */
+type SlideComponent = React.ComponentType<SlideProps>;
+/**
+ * Configuration for a single slide including its animation step count.
+ * The `steps` property declares how many animation steps the slide has,
+ * eliminating the need for runtime step discovery.
+ */
+interface SlideConfig {
+    /** The slide component to render */
+    component: SlideComponent;
+    /** Number of animation steps (0 = no animations). This is the max step number used in <Animated step={N}> */
+    steps: number;
+    /** Display name for grid view thumbnails, navigation, and accessibility */
+    title?: string;
+    /** Speaker notes (not rendered on slide, shown in notes panel) */
+    notes?: string;
+    /** Per-slide transition override (falls back to deck-level transition) */
+    transition?: SlideTransitionType;
+    /** Section/chapter name for grouping slides in grid view */
+    section?: string;
+}
+/**
+ * Direction of slide navigation.
+ * - 1: Forward (next slide)
+ * - -1: Backward (previous slide)
+ * - 0: Direct jump (no direction)
+ */
+type NavigationDirection = -1 | 0 | 1;
+/**
+ * Logo variants for different contexts.
+ */
+interface ThemeLogos {
+    /** Full logo (default, used in footers) */
+    full?: string;
+    /** Icon-only mark (used in compact spaces) */
+    icon?: string;
+    /** Light version for dark backgrounds */
+    fullLight?: string;
+    /** Light icon for dark backgrounds */
+    iconLight?: string;
+}
+/**
+ * Brand color overrides using OKLCH strings.
+ * Injected as CSS custom properties at runtime.
+ * If omitted, the existing globals.css values apply.
+ */
+interface ThemeColors {
+    primary?: string;
+    primaryForeground?: string;
+    secondary?: string;
+    secondaryForeground?: string;
+    accent?: string;
+    accentForeground?: string;
+}
+/**
+ * Corporate visual assets (paths relative to public/).
+ */
+interface ThemeAssets {
+    /** Background image URL (e.g. for title slides) */
+    backgroundImage?: string;
+    /** Subtle pattern overlay URL */
+    patternImage?: string;
+}
+/**
+ * Typography preferences. Font names must be loaded via
+ * <link> in index.html or @font-face in globals.css.
+ */
+interface ThemeFonts {
+    heading?: string;
+    body?: string;
+}
+/**
+ * Full theme configuration.
+ */
+interface ThemeConfig {
+    /** Company/product name (shown in footers) */
+    name: string;
+    /** Optional tagline */
+    tagline?: string;
+    /** Logo configuration */
+    logo?: ThemeLogos;
+    /** Brand color overrides (OKLCH strings) */
+    colors?: ThemeColors;
+    /** Corporate visual assets */
+    assets?: ThemeAssets;
+    /** Typography preferences */
+    fonts?: ThemeFonts;
+}
+
+interface AnimationContextValue {
+    /** Current animation step (0 = no animations shown yet) */
+    currentStep: number;
+    /** Total animation steps in this slide (declared in slide config) */
+    totalSteps: number;
+    /** When true, all animation steps should be visible (used for backward navigation) */
+    showAllAnimations: boolean;
+}
+interface AnimationProviderProps {
+    children: React.ReactNode;
+    /** Current animation step (0 = no animations shown yet) */
+    currentStep: number;
+    /** Total animation steps declared in slide config */
+    totalSteps: number;
+    /** When true, show all animations regardless of currentStep (for backward navigation) */
+    showAllAnimations?: boolean;
+}
+/**
+ * Provides animation context to child components.
+ *
+ * The totalSteps is now passed from parent (declared in slide config)
+ * rather than discovered at runtime, eliminating race conditions.
+ */
+declare function AnimationProvider({ children, currentStep, totalSteps, showAllAnimations }: AnimationProviderProps): react_jsx_runtime.JSX.Element;
+declare function useAnimationContext(): AnimationContextValue;
+
+type AnimationType = "fade" | "slide-up" | "slide-down" | "slide-left" | "slide-right" | "scale";
+interface AnimatedProps {
+    /** Which step reveals this content (1-indexed) */
+    step: number;
+    /** Animation type */
+    animation?: AnimationType;
+    /** Animation duration in seconds */
+    duration?: number;
+    /** Delay after trigger in seconds */
+    delay?: number;
+    /** Custom className */
+    className?: string;
+    children: React.ReactNode;
+}
+/**
+ * Animated element that appears at a specific animation step.
+ *
+ * The step count is now declared in slide config rather than discovered
+ * at runtime, so this component simply consumes the context without
+ * needing to register itself.
+ */
+declare function Animated({ step, animation, duration, delay, className, children }: AnimatedProps): react_jsx_runtime.JSX.Element;
+/**
+ * Wrapper for staggering multiple children.
+ * Each direct child will be animated in sequence.
+ */
+interface AnimatedGroupProps {
+    /** Starting step for the first child */
+    startStep: number;
+    /** Animation type for all children */
+    animation?: AnimationType;
+    /** Delay between each child in seconds */
+    staggerDelay?: number;
+    className?: string;
+    children: React.ReactNode;
+}
+declare function AnimatedGroup({ startStep, animation, staggerDelay, className, children }: AnimatedGroupProps): react_jsx_runtime.JSX.Element;
+
+interface MorphProps {
+    layoutId: string;
+    transition?: Transition;
+    className?: string;
+    children: React.ReactNode;
+}
+interface MorphGroupProps {
+    groupId: string;
+    transition?: Transition;
+    className?: string;
+    children: React.ReactNode;
+}
+/**
+ * Wrapper component that enables morph/shared-layout animations between slides.
+ *
+ * Usage:
+ * ```tsx
+ * // Slide 1 - Large version
+ * <Morph layoutId="hero-title">
+ *   <h1 className="text-6xl">Title</h1>
+ * </Morph>
+ *
+ * // Slide 2 - Small version (same layoutId = morphs between them)
+ * <Morph layoutId="hero-title">
+ *   <h1 className="text-2xl">Title</h1>
+ * </Morph>
+ * ```
+ */
+declare function Morph({ layoutId, transition, className, children }: MorphProps): react_jsx_runtime.JSX.Element;
+declare function MorphGroup({ groupId, transition, className, children }: MorphGroupProps): react_jsx_runtime.JSX.Element;
+interface MorphItemProps {
+    id: string;
+    prefix?: string;
+    transition?: Transition;
+    className?: string;
+    children: React.ReactNode;
+}
+declare function MorphItem({ id, prefix, transition, className, children }: MorphItemProps): react_jsx_runtime.JSX.Element;
+interface MorphTextProps {
+    layoutId: string;
+    as?: "h1" | "h2" | "h3" | "h4" | "p" | "span";
+    transition?: Transition;
+    className?: string;
+    children: React.ReactNode;
+}
+declare function MorphText({ layoutId, as: Component, transition, className, children }: MorphTextProps): react_jsx_runtime.JSX.Element;
+
+interface UseSlideNavigationOptions {
+    slides: SlideConfig[];
+    initialSlide?: number;
+    onSlideChange?: (slideIndex: number) => void;
+}
+interface UseSlideNavigationReturn {
+    currentSlide: number;
+    animationStep: number;
+    totalSteps: number;
+    direction: NavigationDirection;
+    isTransitioning: boolean;
+    showAllAnimations: boolean;
+    advance: () => void;
+    goBack: () => void;
+    goToSlide: (index: number) => void;
+    onTransitionComplete: () => void;
+}
+declare function useSlideNavigation({ slides, initialSlide, onSlideChange }: UseSlideNavigationOptions): UseSlideNavigationReturn;
+
+/**
+ * Access the full theme config. Returns null outside SlideThemeProvider.
+ */
+declare function useTheme(): ThemeConfig | null;
+interface SlideThemeProviderProps {
+    theme: ThemeConfig;
+    children: React.ReactNode;
+}
+/**
+ * Provides the full theme to all descendants.
+ * Injects CSS variable overrides via inline style.
+ */
+declare function SlideThemeProvider({ theme, children }: SlideThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+interface SlideFooterProps {
+    slideNumber: number;
+    totalSlides: number;
+    /** Use light text/logo for dark slide backgrounds */
+    variant?: "default" | "light";
+}
+declare function SlideFooter({ slideNumber, totalSlides, variant }: SlideFooterProps): react_jsx_runtime.JSX.Element | null;
+
+interface SlideDeckProps {
+    slides: SlideConfig[];
+    transition?: SlideTransitionType;
+    directionalTransition?: boolean;
+}
+declare function SlideDeck({ slides, transition, directionalTransition }: SlideDeckProps): react_jsx_runtime.JSX.Element;
+
+interface SlideErrorBoundaryProps {
+    slideIndex: number;
+    slideTitle?: string;
+    children: React$1.ReactNode;
+}
+interface SlideErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+declare class SlideErrorBoundary extends React$1.Component<SlideErrorBoundaryProps, SlideErrorBoundaryState> {
+    state: SlideErrorBoundaryState;
+    static getDerivedStateFromError(error: Error): {
+        hasError: boolean;
+        error: Error;
+    };
+    componentDidCatch(error: Error, errorInfo: React$1.ErrorInfo): void;
+    render(): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
+}
+
+declare function cn(...inputs: ClassValue[]): string;
+
+export { Animated, AnimatedGroup, AnimationProvider, type AnimationType, DEFAULT_SLIDE_TRANSITION, EASE_DEFAULT, EASE_IN, EASE_MORPH, EASE_OUT, ELEMENT_SLIDE_DISTANCE, MORPH_DURATION, MORPH_TRANSITION, Morph, MorphGroup, MorphItem, MorphText, type NavigationDirection, SLIDE_DIMENSIONS, SLIDE_DISTANCE, SLIDE_TRANSITION, SLIDE_TRANSITION_DURATION, SLIDE_VARIANTS, SPRING_BOUNCY, SPRING_SMOOTH, SPRING_SNAPPY, STAGGER_DELAY, STEP_ANIMATION_DURATION, STEP_TRANSITION, type SlideComponent, type SlideConfig, SlideDeck, SlideErrorBoundary, SlideFooter, type SlideProps, SlideThemeProvider, type SlideTransitionConfig, type SlideTransitionType, type ThemeConfig, type UseSlideNavigationOptions, type UseSlideNavigationReturn, cn, createDirectionalVariants, directionalSlideX, directionalSlideY, getSlideTransition, getSlideVariants, useAnimationContext, useSlideNavigation, useTheme };