promptslide 0.2.0

package/dist/index.js

@@ -0,0 +1,963 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+
+// src/core/animation-config.ts
+var SLIDE_TRANSITION_DURATION = 0.3;
+var MORPH_DURATION = 0.8;
+var STEP_ANIMATION_DURATION = 0.4;
+var STAGGER_DELAY = 0.1;
+var EASE_DEFAULT = "easeInOut";
+var EASE_OUT = "easeOut";
+var EASE_IN = "easeIn";
+var EASE_MORPH = [0.4, 0, 0.2, 1];
+var SPRING_SNAPPY = {
+  type: "spring",
+  stiffness: 300,
+  damping: 30
+};
+var SPRING_SMOOTH = {
+  type: "spring",
+  stiffness: 200,
+  damping: 25
+};
+var SPRING_BOUNCY = {
+  type: "spring",
+  stiffness: 400,
+  damping: 20
+};
+var SLIDE_TRANSITION = {
+  duration: SLIDE_TRANSITION_DURATION,
+  ease: EASE_DEFAULT
+};
+var MORPH_TRANSITION = {
+  duration: MORPH_DURATION,
+  ease: EASE_MORPH
+};
+var STEP_TRANSITION = {
+  ...SPRING_SNAPPY
+};
+var SLIDE_DISTANCE = 100;
+var ELEMENT_SLIDE_DISTANCE = 30;
+var SLIDE_DIMENSIONS = {
+  width: 1280,
+  height: 720,
+  aspectRatio: 16 / 9
+};
+
+// src/core/animation-context.tsx
+import { createContext, useContext, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+var AnimationContext = createContext({
+  currentStep: 0,
+  totalSteps: 0,
+  showAllAnimations: false
+});
+function AnimationProvider({
+  children,
+  currentStep,
+  totalSteps,
+  showAllAnimations = false
+}) {
+  const value = useMemo(
+    () => ({
+      currentStep,
+      totalSteps,
+      showAllAnimations
+    }),
+    [currentStep, totalSteps, showAllAnimations]
+  );
+  return /* @__PURE__ */ jsx(AnimationContext.Provider, { value, children });
+}
+function useAnimationContext() {
+  return useContext(AnimationContext);
+}
+
+// src/core/animated.tsx
+import { motion } from "framer-motion";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var animationVariants = {
+  fade: {
+    hidden: { opacity: 0 },
+    visible: { opacity: 1 }
+  },
+  "slide-up": {
+    hidden: { opacity: 0, y: ELEMENT_SLIDE_DISTANCE },
+    visible: { opacity: 1, y: 0 }
+  },
+  "slide-down": {
+    hidden: { opacity: 0, y: -ELEMENT_SLIDE_DISTANCE },
+    visible: { opacity: 1, y: 0 }
+  },
+  "slide-left": {
+    hidden: { opacity: 0, x: ELEMENT_SLIDE_DISTANCE },
+    visible: { opacity: 1, x: 0 }
+  },
+  "slide-right": {
+    hidden: { opacity: 0, x: -ELEMENT_SLIDE_DISTANCE },
+    visible: { opacity: 1, x: 0 }
+  },
+  scale: {
+    hidden: { opacity: 0, scale: 0.8 },
+    visible: { opacity: 1, scale: 1 }
+  }
+};
+function Animated({
+  step,
+  animation = "slide-up",
+  duration = STEP_ANIMATION_DURATION,
+  delay = 0,
+  className,
+  children
+}) {
+  const { currentStep, showAllAnimations } = useAnimationContext();
+  const isVisible = showAllAnimations || currentStep >= step;
+  return /* @__PURE__ */ jsx2(
+    motion.div,
+    {
+      initial: "hidden",
+      animate: isVisible ? "visible" : "hidden",
+      variants: animationVariants[animation],
+      transition: {
+        ...SPRING_SNAPPY,
+        duration,
+        delay: isVisible ? delay : 0
+      },
+      className,
+      children
+    }
+  );
+}
+function AnimatedGroup({
+  startStep,
+  animation = "slide-up",
+  staggerDelay = STAGGER_DELAY,
+  className,
+  children
+}) {
+  const { currentStep, showAllAnimations } = useAnimationContext();
+  const childArray = Array.isArray(children) ? children : [children];
+  const isVisible = showAllAnimations || currentStep >= startStep;
+  const containerVariants = {
+    hidden: {},
+    visible: {
+      transition: {
+        staggerChildren: staggerDelay
+      }
+    }
+  };
+  return /* @__PURE__ */ jsx2(
+    motion.div,
+    {
+      initial: "hidden",
+      animate: isVisible ? "visible" : "hidden",
+      variants: containerVariants,
+      className,
+      children: childArray.map((child, index) => /* @__PURE__ */ jsx2(motion.div, { variants: animationVariants[animation], children: child }, index))
+    }
+  );
+}
+
+// src/core/transitions.ts
+var fadeVariants = {
+  enter: { opacity: 0 },
+  center: { opacity: 1 },
+  exit: { opacity: 0 }
+};
+var slideLeftVariants = {
+  enter: { x: SLIDE_DISTANCE, opacity: 0 },
+  center: { x: 0, opacity: 1 },
+  exit: { x: -SLIDE_DISTANCE, opacity: 0 }
+};
+var slideRightVariants = {
+  enter: { x: -SLIDE_DISTANCE, opacity: 0 },
+  center: { x: 0, opacity: 1 },
+  exit: { x: SLIDE_DISTANCE, opacity: 0 }
+};
+var slideUpVariants = {
+  enter: { y: SLIDE_DISTANCE, opacity: 0 },
+  center: { y: 0, opacity: 1 },
+  exit: { y: -SLIDE_DISTANCE, opacity: 0 }
+};
+var slideDownVariants = {
+  enter: { y: -SLIDE_DISTANCE, opacity: 0 },
+  center: { y: 0, opacity: 1 },
+  exit: { y: SLIDE_DISTANCE, opacity: 0 }
+};
+var zoomVariants = {
+  enter: { scale: 0.8, opacity: 0 },
+  center: { scale: 1, opacity: 1 },
+  exit: { scale: 1.2, opacity: 0 }
+};
+var zoomFadeVariants = {
+  enter: { scale: 0.95, opacity: 0 },
+  center: { scale: 1, opacity: 1 },
+  exit: { scale: 1.05, opacity: 0 }
+};
+var morphVariants = {
+  enter: {
+    opacity: 0,
+    zIndex: 1
+  },
+  center: {
+    opacity: 1,
+    zIndex: 1,
+    transition: {
+      opacity: { delay: 0.05, duration: 0.25 }
+    }
+  },
+  exit: {
+    opacity: 0,
+    zIndex: 0,
+    transition: {
+      opacity: { duration: MORPH_DURATION, ease: EASE_MORPH }
+    }
+  }
+};
+var noneVariants = {
+  enter: {},
+  center: {},
+  exit: {}
+};
+var SLIDE_VARIANTS = {
+  fade: fadeVariants,
+  "slide-left": slideLeftVariants,
+  "slide-right": slideRightVariants,
+  "slide-up": slideUpVariants,
+  "slide-down": slideDownVariants,
+  zoom: zoomVariants,
+  "zoom-fade": zoomFadeVariants,
+  morph: morphVariants,
+  none: noneVariants
+};
+function createDirectionalVariants(axis = "x") {
+  return (direction) => ({
+    enter: {
+      [axis]: direction > 0 ? SLIDE_DISTANCE : -SLIDE_DISTANCE,
+      opacity: 0
+    },
+    center: {
+      [axis]: 0,
+      opacity: 1
+    },
+    exit: {
+      [axis]: direction < 0 ? SLIDE_DISTANCE : -SLIDE_DISTANCE,
+      opacity: 0
+    }
+  });
+}
+var directionalSlideX = createDirectionalVariants("x");
+var directionalSlideY = createDirectionalVariants("y");
+function getSlideVariants(config, direction = 1) {
+  const type = typeof config === "string" ? config : config.type;
+  const directional = typeof config === "object" ? config.directional : false;
+  if (directional && (type === "slide-left" || type === "slide-right")) {
+    return directionalSlideX(direction);
+  }
+  if (directional && (type === "slide-up" || type === "slide-down")) {
+    return directionalSlideY(direction);
+  }
+  return SLIDE_VARIANTS[type];
+}
+function getSlideTransition(config) {
+  if (!config) return SLIDE_TRANSITION;
+  const type = typeof config === "string" ? config : config.type;
+  const defaultDuration = type === "morph" ? MORPH_DURATION : SLIDE_TRANSITION_DURATION;
+  const duration = typeof config === "object" && config.duration ? config.duration : defaultDuration;
+  return {
+    ...SLIDE_TRANSITION,
+    duration
+  };
+}
+var DEFAULT_SLIDE_TRANSITION = "fade";
+
+// src/core/morph.tsx
+import { motion as motion2 } from "framer-motion";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function Morph({
+  layoutId,
+  transition = MORPH_TRANSITION,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx3(
+    motion2.div,
+    {
+      layout: true,
+      layoutId,
+      initial: false,
+      transition,
+      className,
+      children
+    }
+  );
+}
+function MorphGroup({
+  groupId,
+  transition = MORPH_TRANSITION,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx3(
+    motion2.div,
+    {
+      layout: true,
+      layoutId: groupId,
+      initial: false,
+      transition,
+      className,
+      children
+    }
+  );
+}
+function MorphItem({
+  id,
+  prefix,
+  transition = MORPH_TRANSITION,
+  className,
+  children
+}) {
+  const layoutId = prefix ? `${prefix}-${id}` : id;
+  return /* @__PURE__ */ jsx3(
+    motion2.div,
+    {
+      layout: true,
+      layoutId,
+      initial: false,
+      transition,
+      className,
+      children
+    }
+  );
+}
+function MorphText({
+  layoutId,
+  as: Component = "span",
+  transition = MORPH_TRANSITION,
+  className,
+  children
+}) {
+  const MotionComponent = motion2[Component];
+  return /* @__PURE__ */ jsx3(
+    MotionComponent,
+    {
+      layout: true,
+      layoutId,
+      initial: false,
+      transition,
+      className,
+      children
+    }
+  );
+}
+
+// src/core/use-slide-navigation.ts
+import { useCallback, useEffect, useState } from "react";
+function useSlideNavigation({
+  slides,
+  initialSlide = 0,
+  onSlideChange
+}) {
+  const [currentSlide, setCurrentSlide] = useState(initialSlide);
+  const [animationStep, setAnimationStep] = useState(0);
+  const [navState, setNavState] = useState({
+    status: "idle",
+    direction: 0
+  });
+  const [queuedAction, setQueuedAction] = useState(null);
+  const totalSteps = slides[currentSlide]?.steps ?? 0;
+  const onTransitionComplete = useCallback(() => {
+    setNavState((prev) => {
+      if (prev.status === "transitioning") {
+        return { status: "idle", direction: 0 };
+      }
+      return prev;
+    });
+  }, []);
+  const advance = useCallback(() => {
+    if (navState.status === "transitioning") {
+      setQueuedAction("advance");
+      return;
+    }
+    const currentTotalSteps = slides[currentSlide]?.steps ?? 0;
+    if (animationStep >= currentTotalSteps) {
+      const nextSlide = (currentSlide + 1) % slides.length;
+      setNavState({ status: "transitioning", direction: 1 });
+      setAnimationStep(0);
+      setCurrentSlide(nextSlide);
+      onSlideChange?.(nextSlide);
+    } else {
+      setAnimationStep((prev) => prev + 1);
+    }
+  }, [navState.status, animationStep, currentSlide, slides, onSlideChange]);
+  const goBack = useCallback(() => {
+    if (navState.status === "transitioning") {
+      setQueuedAction("goBack");
+      return;
+    }
+    if (animationStep <= 0) {
+      const prevSlide = (currentSlide - 1 + slides.length) % slides.length;
+      const prevSlideSteps = slides[prevSlide]?.steps ?? 0;
+      setNavState({ status: "transitioning", direction: -1 });
+      setAnimationStep(prevSlideSteps);
+      setCurrentSlide(prevSlide);
+      onSlideChange?.(prevSlide);
+    } else {
+      setAnimationStep((prev) => prev - 1);
+    }
+  }, [navState.status, animationStep, currentSlide, slides, onSlideChange]);
+  const goToSlide = useCallback(
+    (index) => {
+      if (index < 0 || index >= slides.length || index === currentSlide) {
+        return;
+      }
+      const direction = index > currentSlide ? 1 : -1;
+      setNavState({ status: "transitioning", direction });
+      setAnimationStep(0);
+      setCurrentSlide(index);
+      onSlideChange?.(index);
+    },
+    [currentSlide, slides.length, onSlideChange]
+  );
+  useEffect(() => {
+    if (navState.status === "idle" && queuedAction !== null) {
+      setQueuedAction(null);
+      if (queuedAction === "advance") {
+        advance();
+      } else if (queuedAction === "goBack") {
+        goBack();
+      }
+    }
+  }, [navState.status, queuedAction, advance, goBack]);
+  return {
+    currentSlide,
+    animationStep,
+    totalSteps,
+    direction: navState.direction,
+    isTransitioning: navState.status !== "idle",
+    showAllAnimations: navState.direction === -1 && navState.status === "transitioning",
+    advance,
+    goBack,
+    goToSlide,
+    onTransitionComplete
+  };
+}
+
+// src/core/theme-context.tsx
+import { createContext as createContext2, useContext as useContext2, useMemo as useMemo2 } from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var ThemeContext = createContext2(null);
+function useTheme() {
+  return useContext2(ThemeContext);
+}
+function buildCssOverrides(theme) {
+  const style = {};
+  if (theme.colors?.primary) style["--primary"] = theme.colors.primary;
+  if (theme.colors?.primaryForeground) style["--primary-foreground"] = theme.colors.primaryForeground;
+  if (theme.colors?.secondary) style["--secondary"] = theme.colors.secondary;
+  if (theme.colors?.secondaryForeground) style["--secondary-foreground"] = theme.colors.secondaryForeground;
+  if (theme.colors?.accent) style["--accent"] = theme.colors.accent;
+  if (theme.colors?.accentForeground) style["--accent-foreground"] = theme.colors.accentForeground;
+  if (theme.fonts?.heading) style["--font-heading"] = theme.fonts.heading;
+  if (theme.fonts?.body) style["--font-body"] = theme.fonts.body;
+  return style;
+}
+function SlideThemeProvider({ theme, children }) {
+  const cssOverrides = useMemo2(() => buildCssOverrides(theme), [theme]);
+  return /* @__PURE__ */ jsx4(ThemeContext.Provider, { value: theme, children: /* @__PURE__ */ jsx4("div", { style: cssOverrides, className: "contents", children }) });
+}
+
+// src/core/layouts/shared-footer.tsx
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+function SlideFooter({ slideNumber, totalSlides, variant = "default" }) {
+  const theme = useTheme();
+  if (!theme) return null;
+  const logoUrl = variant === "light" ? theme.logo?.fullLight ?? theme.logo?.full : theme.logo?.full;
+  const textClass = variant === "light" ? "text-white/70" : "text-muted-foreground";
+  const nameClass = variant === "light" ? "text-white font-semibold" : "text-foreground font-semibold";
+  return /* @__PURE__ */ jsxs("div", { className: `mt-4 flex shrink-0 items-center justify-between text-sm ${textClass}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-3 tracking-tight ${nameClass}`, children: [
+      logoUrl && /* @__PURE__ */ jsx5(
+        "img",
+        {
+          src: logoUrl,
+          alt: `${theme.name} Logo`,
+          className: "h-8 w-auto"
+        }
+      ),
+      /* @__PURE__ */ jsx5("span", { className: "text-lg", children: theme.name })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "font-mono", children: [
+      slideNumber,
+      " / ",
+      totalSlides
+    ] })
+  ] });
+}
+
+// src/core/slide-deck.tsx
+import { AnimatePresence, LayoutGroup, motion as motion3 } from "framer-motion";
+import { ChevronLeft, ChevronRight, Download, Grid3X3, List, Maximize, Monitor } from "lucide-react";
+import { useCallback as useCallback2, useEffect as useEffect2, useRef, useState as useState2 } from "react";
+
+// src/core/slide-error-boundary.tsx
+import React from "react";
+import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
+var SlideErrorBoundary = class extends React.Component {
+  constructor() {
+    super(...arguments);
+    __publicField(this, "state", { hasError: false, error: null });
+  }
+  static getDerivedStateFromError(error) {
+    return { hasError: true, error };
+  }
+  componentDidCatch(error, errorInfo) {
+    console.error(
+      `[PromptSlide] Slide ${this.props.slideIndex + 1}${this.props.slideTitle ? ` ("${this.props.slideTitle}")` : ""} crashed:`,
+      error,
+      errorInfo
+    );
+  }
+  render() {
+    if (this.state.hasError) {
+      return /* @__PURE__ */ jsxs2("div", { className: "flex h-full w-full flex-col items-center justify-center bg-red-950/20 p-12", children: [
+        /* @__PURE__ */ jsxs2("div", { className: "mb-4 text-lg font-semibold text-red-400", children: [
+          "Slide ",
+          this.props.slideIndex + 1,
+          " Error",
+          this.props.slideTitle && /* @__PURE__ */ jsxs2("span", { className: "ml-2 font-normal text-red-400/70", children: [
+            "(",
+            this.props.slideTitle,
+            ")"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx6("div", { className: "max-w-2xl text-center font-mono text-sm break-words text-red-300/80", children: this.state.error?.message ?? "Unknown error" })
+      ] });
+    }
+    return this.props.children;
+  }
+};
+
+// src/core/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/core/slide-deck.tsx
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+function SlideDeck({ slides, transition, directionalTransition }) {
+  const [viewMode, setViewMode] = useState2("slide");
+  const [isPresentationMode, setIsPresentationMode] = useState2(false);
+  const [scale, setScale] = useState2(1);
+  const containerRef = useRef(null);
+  const {
+    currentSlide,
+    animationStep,
+    totalSteps,
+    direction,
+    showAllAnimations,
+    advance,
+    goBack,
+    goToSlide,
+    onTransitionComplete
+  } = useSlideNavigation({
+    slides
+  });
+  const togglePresentationMode = useCallback2(async () => {
+    if (!document.fullscreenElement) {
+      await document.documentElement.requestFullscreen();
+    } else {
+      await document.exitFullscreen();
+    }
+  }, []);
+  useEffect2(() => {
+    const handleFullscreenChange = () => {
+      setIsPresentationMode(!!document.fullscreenElement);
+    };
+    document.addEventListener("fullscreenchange", handleFullscreenChange);
+    return () => document.removeEventListener("fullscreenchange", handleFullscreenChange);
+  }, []);
+  useEffect2(() => {
+    const calculateScale = () => {
+      if (!isPresentationMode) {
+        setScale(1);
+        return;
+      }
+      const viewportWidth = window.innerWidth;
+      const viewportHeight = window.innerHeight;
+      const scaleX = viewportWidth / SLIDE_DIMENSIONS.width;
+      const scaleY = viewportHeight / SLIDE_DIMENSIONS.height;
+      setScale(Math.min(scaleX, scaleY));
+    };
+    calculateScale();
+    window.addEventListener("resize", calculateScale);
+    return () => window.removeEventListener("resize", calculateScale);
+  }, [isPresentationMode]);
+  const handleExportPdf = () => {
+    const previousMode = viewMode;
+    setViewMode("list");
+    setTimeout(() => {
+      const handleAfterPrint = () => {
+        setViewMode(previousMode);
+        window.removeEventListener("afterprint", handleAfterPrint);
+      };
+      window.addEventListener("afterprint", handleAfterPrint);
+      window.print();
+    }, 100);
+  };
+  useEffect2(() => {
+    const handleKeyDown = (e) => {
+      if (e.key === "f" || e.key === "F") {
+        togglePresentationMode();
+        return;
+      }
+      if (e.key === "g" || e.key === "G") {
+        setViewMode((prev) => prev === "grid" ? "slide" : "grid");
+        return;
+      }
+      if (viewMode !== "slide") return;
+      if (e.key === "ArrowRight" || e.key === " ") {
+        e.preventDefault();
+        advance();
+      } else if (e.key === "ArrowLeft") {
+        e.preventDefault();
+        goBack();
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [advance, goBack, viewMode, togglePresentationMode]);
+  const currentSlideTransition = slides[currentSlide]?.transition;
+  const transitionType = currentSlideTransition ?? transition ?? DEFAULT_SLIDE_TRANSITION;
+  const isDirectional = directionalTransition ?? false;
+  const slideVariants = getSlideVariants(
+    { type: transitionType, directional: isDirectional },
+    direction
+  );
+  const CurrentSlideComponent = slides[currentSlide].component;
+  return /* @__PURE__ */ jsxs3("div", { className: "min-h-screen w-full bg-neutral-950 text-foreground", children: [
+    /* @__PURE__ */ jsx7("style", { children: `
+        @media print {
+          @page {
+            size: 1920px 1080px;
+            margin: 0;
+          }
+          html,
+          body {
+            width: 100%;
+            height: 100%;
+            margin: 0 !important;
+            padding: 0 !important;
+            overflow: visible !important;
+          }
+          body {
+            print-color-adjust: exact;
+            -webkit-print-color-adjust: exact;
+            background: transparent !important;
+          }
+        }
+      ` }),
+    /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        className: cn(
+          "fixed top-4 right-4 z-50 flex gap-1 rounded-lg border border-neutral-800 bg-neutral-950/90 p-1 backdrop-blur-sm print:hidden",
+          isPresentationMode && "hidden"
+        ),
+        children: [
+          /* @__PURE__ */ jsx7(
+            "button",
+            {
+              onClick: () => setViewMode("slide"),
+              className: cn(
+                "rounded-md p-2 text-neutral-400 transition-colors hover:bg-neutral-800 hover:text-white",
+                viewMode === "slide" && "bg-neutral-800 text-white"
+              ),
+              title: "Presentation View",
+              children: /* @__PURE__ */ jsx7(Monitor, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            "button",
+            {
+              onClick: () => setViewMode("list"),
+              className: cn(
+                "rounded-md p-2 text-neutral-400 transition-colors hover:bg-neutral-800 hover:text-white",
+                viewMode === "list" && "bg-neutral-800 text-white"
+              ),
+              title: "List View",
+              children: /* @__PURE__ */ jsx7(List, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            "button",
+            {
+              onClick: () => setViewMode("grid"),
+              className: cn(
+                "rounded-md p-2 text-neutral-400 transition-colors hover:bg-neutral-800 hover:text-white",
+                viewMode === "grid" && "bg-neutral-800 text-white"
+              ),
+              title: "Grid View",
+              children: /* @__PURE__ */ jsx7(Grid3X3, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx7("div", { className: "mx-1 w-px bg-neutral-800" }),
+          /* @__PURE__ */ jsx7(
+            "button",
+            {
+              onClick: handleExportPdf,
+              className: "rounded-md p-2 text-neutral-400 transition-colors hover:bg-neutral-800 hover:text-white",
+              title: "Download PDF",
+              children: /* @__PURE__ */ jsx7(Download, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            "button",
+            {
+              onClick: togglePresentationMode,
+              className: "rounded-md p-2 text-neutral-400 transition-colors hover:bg-neutral-800 hover:text-white",
+              title: "Present (F)",
+              children: /* @__PURE__ */ jsx7(Maximize, { className: "h-4 w-4" })
+            }
+          )
+        ]
+      }
+    ),
+    viewMode === "slide" && /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        ref: containerRef,
+        role: "presentation",
+        tabIndex: isPresentationMode ? 0 : void 0,
+        className: cn(
+          "flex h-screen w-full flex-col items-center justify-center overflow-hidden print:hidden",
+          isPresentationMode ? "bg-black p-0" : "p-4 md:p-8"
+        ),
+        onClick: isPresentationMode ? advance : void 0,
+        onKeyDown: isPresentationMode ? (e) => {
+          if (e.key === "Enter" || e.key === " ") advance();
+        } : void 0,
+        children: [
+          /* @__PURE__ */ jsx7(LayoutGroup, { id: "slide-deck", children: isPresentationMode ? /* @__PURE__ */ jsx7(
+            "div",
+            {
+              className: "pointer-events-none relative overflow-hidden bg-black",
+              style: {
+                width: SLIDE_DIMENSIONS.width,
+                height: SLIDE_DIMENSIONS.height,
+                transform: `scale(${scale})`,
+                transformOrigin: "center center"
+              },
+              children: /* @__PURE__ */ jsx7(AnimatePresence, { initial: false, children: /* @__PURE__ */ jsx7(
+                motion3.div,
+                {
+                  variants: slideVariants,
+                  initial: "enter",
+                  animate: "center",
+                  exit: "exit",
+                  transition: SLIDE_TRANSITION,
+                  onAnimationComplete: (definition) => {
+                    if (definition === "center") {
+                      onTransitionComplete();
+                    }
+                  },
+                  className: "absolute inset-0 h-full w-full",
+                  children: /* @__PURE__ */ jsx7(
+                    AnimationProvider,
+                    {
+                      currentStep: animationStep,
+                      totalSteps,
+                      showAllAnimations,
+                      children: /* @__PURE__ */ jsx7(
+                        SlideErrorBoundary,
+                        {
+                          slideIndex: currentSlide,
+                          slideTitle: slides[currentSlide]?.title,
+                          children: /* @__PURE__ */ jsx7(
+                            CurrentSlideComponent,
+                            {
+                              slideNumber: currentSlide + 1,
+                              totalSlides: slides.length
+                            }
+                          )
+                        }
+                      )
+                    }
+                  )
+                },
+                currentSlide
+              ) })
+            }
+          ) : /* @__PURE__ */ jsx7("div", { className: "relative aspect-video w-full max-w-7xl overflow-hidden rounded-xl border border-neutral-800 bg-black shadow-2xl", children: /* @__PURE__ */ jsx7(AnimatePresence, { initial: false, children: /* @__PURE__ */ jsx7(
+            motion3.div,
+            {
+              variants: slideVariants,
+              initial: "enter",
+              animate: "center",
+              exit: "exit",
+              transition: SLIDE_TRANSITION,
+              onAnimationComplete: (definition) => {
+                if (definition === "center") {
+                  onTransitionComplete();
+                }
+              },
+              className: "absolute inset-0 h-full w-full",
+              children: /* @__PURE__ */ jsx7(
+                AnimationProvider,
+                {
+                  currentStep: animationStep,
+                  totalSteps,
+                  showAllAnimations,
+                  children: /* @__PURE__ */ jsx7(
+                    SlideErrorBoundary,
+                    {
+                      slideIndex: currentSlide,
+                      slideTitle: slides[currentSlide]?.title,
+                      children: /* @__PURE__ */ jsx7(
+                        CurrentSlideComponent,
+                        {
+                          slideNumber: currentSlide + 1,
+                          totalSlides: slides.length
+                        }
+                      )
+                    }
+                  )
+                }
+              )
+            },
+            currentSlide
+          ) }) }) }),
+          !isPresentationMode && /* @__PURE__ */ jsxs3("div", { className: "mt-6 flex items-center gap-4", children: [
+            /* @__PURE__ */ jsx7(
+              "button",
+              {
+                onClick: goBack,
+                className: "rounded-full border border-neutral-800 bg-black/50 p-2 text-neutral-400 backdrop-blur-sm transition-colors hover:bg-neutral-900 hover:text-white",
+                children: /* @__PURE__ */ jsx7(ChevronLeft, { className: "h-5 w-5" })
+              }
+            ),
+            /* @__PURE__ */ jsxs3("div", { className: "flex min-w-[4rem] flex-col items-center", children: [
+              /* @__PURE__ */ jsxs3("span", { className: "font-mono text-sm text-neutral-500", children: [
+                currentSlide + 1,
+                " / ",
+                slides.length
+              ] }),
+              slides[currentSlide]?.title && /* @__PURE__ */ jsx7("span", { className: "mt-0.5 text-xs text-neutral-600", children: slides[currentSlide].title })
+            ] }),
+            /* @__PURE__ */ jsx7(
+              "button",
+              {
+                onClick: advance,
+                className: "rounded-full border border-neutral-800 bg-black/50 p-2 text-neutral-400 backdrop-blur-sm transition-colors hover:bg-neutral-900 hover:text-white",
+                children: /* @__PURE__ */ jsx7(ChevronRight, { className: "h-5 w-5" })
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    viewMode === "grid" && /* @__PURE__ */ jsx7("div", { className: "mx-auto max-w-7xl p-8 pt-16 print:hidden", children: /* @__PURE__ */ jsx7("div", { className: "grid grid-cols-2 gap-4 md:grid-cols-3 lg:grid-cols-4", children: slides.map((slideConfig, index) => {
+      const SlideComponent = slideConfig.component;
+      const prevSection = index > 0 ? slides[index - 1]?.section : void 0;
+      const showSectionHeader = slideConfig.section && slideConfig.section !== prevSection;
+      return /* @__PURE__ */ jsxs3("div", { className: showSectionHeader ? "col-span-full" : void 0, children: [
+        showSectionHeader && /* @__PURE__ */ jsx7("h3", { className: "mt-4 mb-3 text-xs font-bold tracking-[0.2em] text-neutral-500 uppercase first:mt-0", children: slideConfig.section }),
+        /* @__PURE__ */ jsxs3(
+          "button",
+          {
+            onClick: () => {
+              goToSlide(index);
+              setViewMode("slide");
+            },
+            className: "group relative aspect-video w-full overflow-hidden rounded-lg border border-neutral-800 bg-black shadow-sm transition-all hover:border-primary hover:shadow-lg hover:shadow-primary/10",
+            children: [
+              /* @__PURE__ */ jsx7(
+                "div",
+                {
+                  className: "h-full w-full origin-top-left scale-[0.25]",
+                  style: { width: "400%", height: "400%" },
+                  children: /* @__PURE__ */ jsx7(SlideErrorBoundary, { slideIndex: index, slideTitle: slideConfig.title, children: /* @__PURE__ */ jsx7(SlideComponent, { slideNumber: index + 1, totalSlides: slides.length }) })
+                }
+              ),
+              /* @__PURE__ */ jsx7("div", { className: "absolute inset-0 bg-black/0 transition-colors group-hover:bg-black/20" }),
+              /* @__PURE__ */ jsx7("div", { className: "absolute bottom-2 left-2 rounded bg-black/70 px-2 py-1 text-xs font-medium text-white", children: slideConfig.title ? `${index + 1}. ${slideConfig.title}` : index + 1 })
+            ]
+          }
+        )
+      ] }, index);
+    }) }) }),
+    /* @__PURE__ */ jsx7(
+      "div",
+      {
+        className: cn(
+          "mx-auto max-w-7xl p-8 pt-16",
+          "print:m-0 print:block print:max-w-none print:p-0",
+          viewMode === "list" ? "block" : "hidden print:block"
+        ),
+        children: /* @__PURE__ */ jsx7("div", { className: "grid grid-cols-1 gap-8 print:block", children: slides.map((slideConfig, index) => {
+          const SlideComponent = slideConfig.component;
+          return /* @__PURE__ */ jsx7(
+            "div",
+            {
+              className: "aspect-video w-full overflow-hidden rounded-xl border border-neutral-800 bg-black shadow-sm print:relative print:m-0 print:h-[1080px] print:w-[1920px] print:break-after-page print:overflow-hidden print:rounded-none print:border-0 print:shadow-none",
+              children: /* @__PURE__ */ jsx7("div", { className: "h-full w-full print:h-[720px] print:w-[1280px] print:origin-top-left print:scale-[1.5]", children: /* @__PURE__ */ jsx7(
+                AnimationProvider,
+                {
+                  currentStep: slideConfig.steps,
+                  totalSteps: slideConfig.steps,
+                  showAllAnimations: true,
+                  children: /* @__PURE__ */ jsx7(SlideErrorBoundary, { slideIndex: index, slideTitle: slideConfig.title, children: /* @__PURE__ */ jsx7(SlideComponent, { slideNumber: index + 1, totalSlides: slides.length }) })
+                }
+              ) })
+            },
+            index
+          );
+        }) })
+      }
+    )
+  ] });
+}
+export {
+  Animated,
+  AnimatedGroup,
+  AnimationProvider,
+  DEFAULT_SLIDE_TRANSITION,
+  EASE_DEFAULT,
+  EASE_IN,
+  EASE_MORPH,
+  EASE_OUT,
+  ELEMENT_SLIDE_DISTANCE,
+  MORPH_DURATION,
+  MORPH_TRANSITION,
+  Morph,
+  MorphGroup,
+  MorphItem,
+  MorphText,
+  SLIDE_DIMENSIONS,
+  SLIDE_DISTANCE,
+  SLIDE_TRANSITION,
+  SLIDE_TRANSITION_DURATION,
+  SLIDE_VARIANTS,
+  SPRING_BOUNCY,
+  SPRING_SMOOTH,
+  SPRING_SNAPPY,
+  STAGGER_DELAY,
+  STEP_ANIMATION_DURATION,
+  STEP_TRANSITION,
+  SlideDeck,
+  SlideErrorBoundary,
+  SlideFooter,
+  SlideThemeProvider,
+  cn,
+  createDirectionalVariants,
+  directionalSlideX,
+  directionalSlideY,
+  getSlideTransition,
+  getSlideVariants,
+  useAnimationContext,
+  useSlideNavigation,
+  useTheme
+};
+//# sourceMappingURL=index.js.map