@donotdev/adv-comps 0.0.2 → 0.0.3

package/dist/components/Crawl/Crawl.d.ts

@@ -1,34 +1,13 @@
 /**
- * @fileoverview Crawl Component
- * @description Cinematic 3D text crawl animation component with starfield background, customizable intro text, title, and content sections. Optimized for performance and Lighthouse scores.
+ * @fileoverview Crawl Component - Thin wrapper with lazy loading
+ * @description Cinematic 3D text crawl. Intro renders immediately (eager),
+ * heavy 3D animation loads lazily after user clicks play.
  *
- * @example
- * ```tsx
- * <Crawl
- *   intro="Lorem ipsum dolor sit amet"
- *   title="LOREM IPSUM"
- *   content={[
- *     "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
- *     "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
- *   ]}
- * />
- * ```
- *
- * @example
- * ```tsx
- * <Crawl
- *   title="Lorem Ipsum"
- *   content="First paragraph.\n\nSecond paragraph with <strong>bold</strong> text."
- *   duration={30}
- *   contentHeight="200vh"
- * />
- * ```
- *
- * @version 0.0.1
+ * @version 0.0.2
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-import { type ReactNode, type ComponentType, type CSSProperties } from 'react';
+import { type ReactNode, type CSSProperties } from 'react';
 export interface CrawlProps {
     /** Optional intro text displayed with play button overlay. Accepts ReactNode or string. */
     intro?: ReactNode | string;
@@ -50,46 +29,16 @@ export interface CrawlProps {
     'aria-label'?: string;
 }
 /**
- * Cinematic 3D text crawl component with performance optimizations.
- *
- * ## Features
- * - **Lighthouse-optimized**: Intro content immediately visible for LCP measurement
- * - **User-controlled**: Play button overlay for optional animation experience
- * - **Zero memory usage**: Animation only starts when user clicks play
- * - **Responsive**: Title wraps on mobile/tablet, stays on one line on desktop
- * - **Accessible**: Respects `prefers-reduced-motion` preference
- * - **SSR-safe**: Handles server-side rendering gracefully
+ * Cinematic 3D text crawl component with lazy loading.
  *
- * ## Behavior
- * 1. Component initially shows a play button overlay with optional intro text
- * 2. User clicks play button to start the animation
- * 3. Starfield background and animated text crawl begin
- * 4. Animation loops infinitely until user navigates away
+ * ## Performance
+ * - Intro overlay renders IMMEDIATELY (LCP-optimized)
+ * - Heavy 3D animation lazy loads after user clicks play
+ * - Zero initial bundle impact for animation code
  *
- * ## Customization
- * CSS variables can be customized via theme or global styles:
- * - `--crawl-title-size`: Title font size (responsive: 3rem → 4.5rem → 8rem)
- * - `--crawl-body-size`: Content font size (responsive: 1.6rem → 2.5rem → 3rem)
- * - `--crawl-text-color`: Text color (default: #ffc909)
- * - `--crawl-intro-color`: Intro text color (default: #4a9eff)
- * - `--crawl-perspective`: 3D perspective distance (default: 600px)
- * - `--crawl-tilt`: 3D tilt angle (default: 40deg)
- *
- * ## Content Parsing
- * When strings are provided for `intro`, `title`, or `content`:
- * - Blank lines (`\n\n`) split content into paragraphs
- * - Limited HTML tags are parsed: `u`, `br`, `i`, `em`, `strong`, `b`
- * - All other HTML is escaped for security
- *
- * @example
- * ```tsx
- * <Crawl
- *   intro="Lorem ipsum dolor sit amet"
- *   title="Lorem Ipsum"
- *   content="First paragraph.\n\nSecond paragraph with <strong>bold</strong> text."
- * />
- * ```
+ * @version 0.0.2
+ * @since 0.0.1
  */
-declare const Crawl: ComponentType<CrawlProps>;
+declare const Crawl: ({ content, intro, title, duration, contentHeight, tiltAngle, className, style, "aria-label": ariaLabel, }: CrawlProps) => import("react/jsx-runtime").JSX.Element;
 export default Crawl;
 //# sourceMappingURL=Crawl.d.ts.map

package/dist/components/Crawl/Crawl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Crawl.d.ts","sourceRoot":"","sources":["../../../src/components/Crawl/Crawl.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAEH,OAAO,EAKL,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,aAAa,EAEnB,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,UAAU;IACzB,2FAA2F;IAC3F,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,sFAAsF;IACtF,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,oFAAoF;IACpF,OAAO,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;IACvC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oDAAoD;IACpD,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,mCAAmC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,QAAA,MAAM,KAAK,EAAE,aAAa,CAAC,UAAU,CAsXpC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Crawl.d.ts","sourceRoot":"","sources":["../../../src/components/Crawl/Crawl.tsx"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAKL,KAAK,SAAS,EACd,KAAK,aAAa,EACnB,MAAM,OAAO,CAAC;AASf,MAAM,WAAW,UAAU;IACzB,2FAA2F;IAC3F,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,sFAAsF;IACtF,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,oFAAoF;IACpF,OAAO,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;IACvC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oDAAoD;IACpD,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,mCAAmC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;GAUG;AACH,QAAA,MAAM,KAAK,GAAI,2GAUZ,UAAU,4CA6GZ,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/Crawl/Crawl.js

@@ -1,95 +1,33 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // packages/adv-comps/src/components/Crawl/Crawl.tsx
 /**
- * @fileoverview Crawl Component
- * @description Cinematic 3D text crawl animation component with starfield background, customizable intro text, title, and content sections. Optimized for performance and Lighthouse scores.
+ * @fileoverview Crawl Component - Thin wrapper with lazy loading
+ * @description Cinematic 3D text crawl. Intro renders immediately (eager),
+ * heavy 3D animation loads lazily after user clicks play.
  *
- * @example
- * ```tsx
- * <Crawl
- *   intro="Lorem ipsum dolor sit amet"
- *   title="LOREM IPSUM"
- *   content={[
- *     "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
- *     "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
- *   ]}
- * />
- * ```
- *
- * @example
- * ```tsx
- * <Crawl
- *   title="Lorem Ipsum"
- *   content="First paragraph.\n\nSecond paragraph with <strong>bold</strong> text."
- *   duration={30}
- *   contentHeight="200vh"
- * />
- * ```
- *
- * @version 0.0.1
+ * @version 0.0.2
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-import { useEffect, useRef, useState, useMemo, isValidElement, } from 'react';
+import { useState, useMemo, lazy, Suspense, } from 'react';
 import { cn } from '@donotdev/components';
-import { isClient } from '@donotdev/core';
 import { parseHtml } from '../../utils/parseHtml';
+// Lazy load heavy 3D animation content
+const CrawlContent = lazy(() => import('./CrawlContent'));
 /**
- * Cinematic 3D text crawl component with performance optimizations.
- *
- * ## Features
- * - **Lighthouse-optimized**: Intro content immediately visible for LCP measurement
- * - **User-controlled**: Play button overlay for optional animation experience
- * - **Zero memory usage**: Animation only starts when user clicks play
- * - **Responsive**: Title wraps on mobile/tablet, stays on one line on desktop
- * - **Accessible**: Respects `prefers-reduced-motion` preference
- * - **SSR-safe**: Handles server-side rendering gracefully
+ * Cinematic 3D text crawl component with lazy loading.
  *
- * ## Behavior
- * 1. Component initially shows a play button overlay with optional intro text
- * 2. User clicks play button to start the animation
- * 3. Starfield background and animated text crawl begin
- * 4. Animation loops infinitely until user navigates away
+ * ## Performance
+ * - Intro overlay renders IMMEDIATELY (LCP-optimized)
+ * - Heavy 3D animation lazy loads after user clicks play
+ * - Zero initial bundle impact for animation code
  *
- * ## Customization
- * CSS variables can be customized via theme or global styles:
- * - `--crawl-title-size`: Title font size (responsive: 3rem → 4.5rem → 8rem)
- * - `--crawl-body-size`: Content font size (responsive: 1.6rem → 2.5rem → 3rem)
- * - `--crawl-text-color`: Text color (default: #ffc909)
- * - `--crawl-intro-color`: Intro text color (default: #4a9eff)
- * - `--crawl-perspective`: 3D perspective distance (default: 600px)
- * - `--crawl-tilt`: 3D tilt angle (default: 40deg)
- *
- * ## Content Parsing
- * When strings are provided for `intro`, `title`, or `content`:
- * - Blank lines (`\n\n`) split content into paragraphs
- * - Limited HTML tags are parsed: `u`, `br`, `i`, `em`, `strong`, `b`
- * - All other HTML is escaped for security
- *
- * @example
- * ```tsx
- * <Crawl
- *   intro="Lorem ipsum dolor sit amet"
- *   title="Lorem Ipsum"
- *   content="First paragraph.\n\nSecond paragraph with <strong>bold</strong> text."
- * />
- * ```
+ * @version 0.0.2
+ * @since 0.0.1
  */
 const Crawl = ({ content, intro, title, duration = 26, contentHeight = '150vh', tiltAngle, className, style, 'aria-label': ariaLabel, }) => {
-    // Normalize intro/title/content to ReactNodes. When strings are provided,
-    // parse limited inline HTML and wrap paragraphs automatically.
-    const renderStringAsParagraphs = (value) => {
-        if (!value || typeof value !== 'string')
-            return null;
-        // Split by blank lines to form paragraphs
-        const blocks = value
-            .split(/\n\s*\n/) // blank line delimiter
-            .map((block) => block.trim())
-            .filter((block) => block.length > 0);
-        return blocks.map((block, idx) => (_jsx("p", { children: parseHtml(block, {
-                allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
-            }) }, `p-${idx}`)));
-    };
+    const [showPlayOverlay, setShowPlayOverlay] = useState(true);
+    // Parse intro immediately (lightweight)
     const resolvedIntro = useMemo(() => {
         if (intro == null)
             return null;
@@ -97,110 +35,10 @@ const Crawl = ({ content, intro, title, duration = 26, contentHeight = '150vh',
                 allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
             }) })) : (intro);
     }, [intro]);
-    const resolvedTitle = useMemo(() => {
-        if (!title)
-            return null;
-        return typeof title === 'string' ? (_jsx("h2", { className: "dndev-crawl-title", children: parseHtml(title, {
-                allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
-            }) })) : (title);
-    }, [title]);
-    const resolvedContent = useMemo(() => {
-        if (isValidElement(content))
-            return content;
-        if (Array.isArray(content)) {
-            // string[] → each item becomes a paragraph
-            const items = content
-                .map((item) => (typeof item === 'string' ? item.trim() : ''))
-                .filter((s) => s && s.length > 0);
-            return items.map((item, idx) => (_jsx("p", { children: parseHtml(item, {
-                    allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
-                }) }, `c-${idx}`)));
-        }
-        if (typeof content === 'string') {
-            return renderStringAsParagraphs(content);
-        }
-        return content;
-    }, [content]);
-    const textRef = useRef(null);
-    const containerRef = useRef(null);
-    const [showPlayOverlay, setShowPlayOverlay] = useState(false);
-    const [isAnimationActive, setIsAnimationActive] = useState(false);
-    const [isPaused, setIsPaused] = useState(false);
-    const [isHydrated, setIsHydrated] = useState(false);
-    // SSR-safe hydration
-    useEffect(() => {
-        setIsHydrated(true);
-        // Always show play overlay (LCP) - intro is optional
-        setShowPlayOverlay(true);
-    }, []);
-    // Handle play button click
     const handlePlayClick = () => {
         setShowPlayOverlay(false);
-        setIsAnimationActive(true);
-        setIsPaused(false);
-    };
-    // Handle container click (pause when animation is active)
-    const handleContainerClick = (e) => {
-        if (isAnimationActive && !isPaused && !showPlayOverlay) {
-            setIsPaused(true);
-        }
     };
-    // Handle pause button click (resume)
-    const handlePauseClick = (e) => {
-        e.stopPropagation();
-        setIsPaused(false);
-    };
-    // Animation style - only active when user requests it
-    const animationStyle = useMemo(() => {
-        const style = {
-            '--crawl-content-height': contentHeight,
-            animationName: isAnimationActive ? 'dndev-crawl-animation' : 'none',
-            animationDuration: `${duration}s`,
-            animationTimingFunction: 'linear',
-            animationIterationCount: 'infinite',
-            animationFillMode: 'forwards',
-            animationPlayState: isPaused ? 'paused' : 'running',
-        };
-        // Only override CSS default if tiltAngle is explicitly provided
-        if (tiltAngle !== undefined) {
-            style['--crawl-tilt'] = `${tiltAngle}deg`;
-        }
-        return style;
-    }, [isAnimationActive, isPaused, duration, contentHeight, tiltAngle]);
-    // Handle reduced motion preference
-    useEffect(() => {
-        if (!isHydrated || !isClient() || !textRef.current)
-            return;
-        const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
-        const handleChange = () => {
-            if (mediaQuery.matches && textRef.current) {
-                textRef.current.classList.add('dndev-crawl-reduced-motion');
-            }
-        };
-        handleChange(); // Check initial state
-        mediaQuery.addEventListener('change', handleChange);
-        return () => mediaQuery.removeEventListener('change', handleChange);
-    }, [isHydrated]);
-    // Intersection Observer - auto-pause when scrolled out of view
-    useEffect(() => {
-        if (!isHydrated ||
-            !isClient() ||
-            !isAnimationActive ||
-            !containerRef.current)
-            return;
-        const observer = new IntersectionObserver((entries) => {
-            const isVisible = entries[0]?.isIntersecting ?? true;
-            if (!isVisible) {
-                setIsPaused(true);
-            }
-        }, { threshold: 0.1 });
-        observer.observe(containerRef.current);
-        return () => observer.disconnect();
-    }, [isHydrated, isAnimationActive]);
-    return (_jsxs("div", { ref: containerRef, className: cn('dndev-crawl-container', 'dndev-relative dndev-overflow-hidden', className), style: { ...style, height: 'calc(100dvh - var(--header-height))' }, onClick: handleContainerClick, "aria-label": ariaLabel || 'Animated text crawl', role: "region", "aria-live": "polite", children: [!showPlayOverlay && (_jsx("div", { className: "dndev-crawl-3d-container", children: _jsx("div", { ref: textRef, className: "dndev-crawl-text", style: {
-                        ...animationStyle,
-                        willChange: isAnimationActive && !isPaused ? 'transform' : 'auto',
-                    }, children: _jsxs("div", { className: "dndev-crawl-content", children: [resolvedTitle, resolvedContent] }) }) })), showPlayOverlay && isHydrated && (_jsxs("div", { className: "dndev-absolute dndev-inset-0 dndev-flex dndev-flex-col dndev-items-center dndev-justify-center", style: {
+    return (_jsxs("div", { className: cn('dndev-crawl-container', 'dndev-relative dndev-overflow-hidden', className), style: { ...style, height: 'calc(100dvh - var(--header-height))' }, "aria-label": ariaLabel || 'Animated text crawl', role: "region", "aria-live": "polite", children: [showPlayOverlay && (_jsxs("div", { className: "dndev-absolute dndev-inset-0 dndev-flex dndev-flex-col dndev-items-center dndev-justify-center", style: {
                     zIndex: 30,
                     backgroundColor: 'rgba(0, 0, 0, 0.6)',
                     backdropFilter: 'blur(4px)',
@@ -219,56 +57,14 @@ const Crawl = ({ content, intro, title, duration = 26, contentHeight = '150vh',
                             backdropFilter: 'blur(4px)',
                             cursor: 'pointer',
                             transition: 'all var(--dur-normal) var(--ease-in-out)',
-                            transformOrigin: 'center',
                         }, onMouseEnter: (e) => {
-                            e.currentTarget.style.backgroundColor =
-                                'rgba(255, 255, 255, 0.3)';
+                            e.currentTarget.style.backgroundColor = 'rgba(255, 255, 255, 0.3)';
                             e.currentTarget.style.borderColor = 'rgba(255, 255, 255, 0.6)';
                             e.currentTarget.style.transform = 'scale(1.1)';
                         }, onMouseLeave: (e) => {
-                            e.currentTarget.style.backgroundColor =
-                                'rgba(255, 255, 255, 0.2)';
+                            e.currentTarget.style.backgroundColor = 'rgba(255, 255, 255, 0.2)';
                             e.currentTarget.style.borderColor = 'rgba(255, 255, 255, 0.4)';
                             e.currentTarget.style.transform = 'scale(1)';
-                        }, "aria-label": "Start animated introduction", children: _jsx("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "white", style: { marginInlineStart: '4px' }, children: _jsx("path", { d: "M8 5v14l11-7z" }) }) })] })), isPaused && isAnimationActive && isHydrated && (_jsx("div", { className: "dndev-absolute dndev-inset-0 dndev-flex dndev-items-center dndev-justify-center", style: {
-                    zIndex: 30,
-                    backgroundColor: 'rgba(0, 0, 0, 0.3)',
-                    backdropFilter: 'blur(2px)',
-                }, onClick: handlePauseClick, children: _jsx("button", { style: {
-                        width: '96px',
-                        height: '96px',
-                        borderRadius: '50%',
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                        backgroundColor: 'rgba(255, 255, 255, 0.2)',
-                        border: '4px solid rgba(255, 255, 255, 0.4)',
-                        backdropFilter: 'blur(4px)',
-                        cursor: 'pointer',
-                        transition: 'all var(--dur-normal) var(--ease-in-out)',
-                        transformOrigin: 'center',
-                    }, onMouseEnter: (e) => {
-                        e.currentTarget.style.backgroundColor =
-                            'rgba(255, 255, 255, 0.3)';
-                        e.currentTarget.style.borderColor = 'rgba(255, 255, 255, 0.6)';
-                        e.currentTarget.style.transform = 'scale(1.1)';
-                    }, onMouseLeave: (e) => {
-                        e.currentTarget.style.backgroundColor =
-                            'rgba(255, 255, 255, 0.2)';
-                        e.currentTarget.style.borderColor = 'rgba(255, 255, 255, 0.4)';
-                        e.currentTarget.style.transform = 'scale(1)';
-                    }, "aria-label": "Resume animation", children: _jsx("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "white", children: _jsx("path", { d: "M6 4h4v16H6V4zm8 0h4v16h-4V4z" }) }) }) })), isAnimationActive && (_jsxs("div", { className: "dndev-crawl-stars", children: [_jsx("div", { className: "dndev-crawl-stars-layer-1" }), _jsx("div", { className: "dndev-crawl-stars-layer-2" }), _jsx("div", { className: "dndev-crawl-stars-layer-3" })] })), !isHydrated && (_jsxs("div", { className: "dndev-absolute dndev-inset-0 dndev-flex dndev-flex-col dndev-items-center dndev-justify-center", style: { zIndex: 20, backgroundColor: 'rgba(0, 0, 0, 0.5)' }, children: [resolvedIntro && (_jsx("div", { className: "dndev-w-full", style: {
-                            paddingInline: 'var(--content-padding)',
-                            marginBottom: '3rem',
-                        }, children: _jsx("div", { className: "dndev-crawl-intro-content", children: resolvedIntro }) })), _jsx("div", { style: {
-                            width: '96px',
-                            height: '96px',
-                            borderRadius: '50%',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            backgroundColor: 'rgba(255, 255, 255, 0.2)',
-                            border: '4px solid rgba(255, 255, 255, 0.4)',
-                        }, children: _jsx("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "white", style: { marginInlineStart: '4px' }, children: _jsx("path", { d: "M8 5v14l11-7z" }) }) })] }))] }));
+                        }, "aria-label": "Start animated introduction", children: _jsx("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "white", style: { marginInlineStart: '4px' }, children: _jsx("path", { d: "M8 5v14l11-7z" }) }) })] })), !showPlayOverlay && (_jsx(Suspense, { fallback: null, children: _jsx(CrawlContent, { title: title, content: content, duration: duration, contentHeight: contentHeight, tiltAngle: tiltAngle }) }))] }));
 };
 export default Crawl;

package/dist/components/Crawl/CrawlContent.d.ts

@@ -0,0 +1,32 @@
+/**
+ * @fileoverview CrawlContent - Heavy 3D animation content (lazy loaded)
+ * @description Contains the 3D perspective animation, starfield, and text crawl.
+ * Lazy loaded after user clicks play to keep initial bundle small.
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+import { type ReactNode } from 'react';
+export interface CrawlContentProps {
+    /** Optional title rendered at the start of the crawl */
+    title?: ReactNode | string;
+    /** Main crawl content */
+    content: ReactNode | string | string[];
+    /** Duration of the crawl animation in seconds */
+    duration?: number;
+    /** Height of the content area in viewport units */
+    contentHeight?: string;
+    /** Tilt angle for the 3D perspective effect */
+    tiltAngle?: number;
+    /** Callback when animation is paused */
+    onPause?: () => void;
+    /** Callback when animation resumes */
+    onResume?: () => void;
+}
+/**
+ * Heavy 3D crawl animation content - lazy loaded
+ */
+declare const CrawlContent: ({ content, title, duration, contentHeight, tiltAngle, onPause, onResume, }: CrawlContentProps) => import("react/jsx-runtime").JSX.Element;
+export default CrawlContent;
+//# sourceMappingURL=CrawlContent.d.ts.map

package/dist/components/Crawl/CrawlContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrawlContent.d.ts","sourceRoot":"","sources":["../../../src/components/Crawl/CrawlContent.tsx"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAKL,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAMf,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,yBAAyB;IACzB,OAAO,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;IACvC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mDAAmD;IACnD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED;;GAEG;AACH,QAAA,MAAM,YAAY,GAAI,4EAQnB,iBAAiB,4CAgKnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/Crawl/CrawlContent.js

@@ -0,0 +1,118 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// packages/adv-comps/src/components/Crawl/CrawlContent.tsx
+/**
+ * @fileoverview CrawlContent - Heavy 3D animation content (lazy loaded)
+ * @description Contains the 3D perspective animation, starfield, and text crawl.
+ * Lazy loaded after user clicks play to keep initial bundle small.
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+import { useEffect, useRef, useState, useMemo, isValidElement, } from 'react';
+import { isClient } from '@donotdev/core';
+import { parseHtml } from '../../utils/parseHtml';
+/**
+ * Heavy 3D crawl animation content - lazy loaded
+ */
+const CrawlContent = ({ content, title, duration = 26, contentHeight = '150vh', tiltAngle, onPause, onResume, }) => {
+    const textRef = useRef(null);
+    const [isPaused, setIsPaused] = useState(false);
+    // Normalize title/content to ReactNodes
+    const renderStringAsParagraphs = (value) => {
+        if (!value || typeof value !== 'string')
+            return null;
+        const blocks = value
+            .split(/\n\s*\n/)
+            .map((block) => block.trim())
+            .filter((block) => block.length > 0);
+        return blocks.map((block, idx) => (_jsx("p", { children: parseHtml(block, {
+                allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
+            }) }, `p-${idx}`)));
+    };
+    const resolvedTitle = useMemo(() => {
+        if (!title)
+            return null;
+        return typeof title === 'string' ? (_jsx("h2", { className: "dndev-crawl-title", children: parseHtml(title, {
+                allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
+            }) })) : (title);
+    }, [title]);
+    const resolvedContent = useMemo(() => {
+        if (isValidElement(content))
+            return content;
+        if (Array.isArray(content)) {
+            const items = content
+                .map((item) => (typeof item === 'string' ? item.trim() : ''))
+                .filter((s) => s && s.length > 0);
+            return items.map((item, idx) => (_jsx("p", { children: parseHtml(item, {
+                    allowedTags: ['u', 'br', 'i', 'em', 'strong', 'b'],
+                }) }, `c-${idx}`)));
+        }
+        if (typeof content === 'string') {
+            return renderStringAsParagraphs(content);
+        }
+        return content;
+    }, [content]);
+    // Animation style
+    const animationStyle = useMemo(() => {
+        const style = {
+            '--crawl-content-height': contentHeight,
+            animationName: 'dndev-crawl-animation',
+            animationDuration: `${duration}s`,
+            animationTimingFunction: 'linear',
+            animationIterationCount: 'infinite',
+            animationFillMode: 'forwards',
+            animationPlayState: isPaused ? 'paused' : 'running',
+        };
+        if (tiltAngle !== undefined) {
+            style['--crawl-tilt'] = `${tiltAngle}deg`;
+        }
+        return style;
+    }, [isPaused, duration, contentHeight, tiltAngle]);
+    // Handle reduced motion preference
+    useEffect(() => {
+        if (!isClient() || !textRef.current)
+            return;
+        const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
+        const handleChange = () => {
+            if (mediaQuery.matches && textRef.current) {
+                textRef.current.classList.add('dndev-crawl-reduced-motion');
+            }
+        };
+        handleChange();
+        mediaQuery.addEventListener('change', handleChange);
+        return () => mediaQuery.removeEventListener('change', handleChange);
+    }, []);
+    // Handle click to pause
+    const handleClick = () => {
+        if (isPaused) {
+            setIsPaused(false);
+            onResume?.();
+        }
+        else {
+            setIsPaused(true);
+            onPause?.();
+        }
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "dndev-crawl-3d-container", onClick: handleClick, children: _jsx("div", { ref: textRef, className: "dndev-crawl-text", style: {
+                        ...animationStyle,
+                        willChange: !isPaused ? 'transform' : 'auto',
+                    }, children: _jsxs("div", { className: "dndev-crawl-content", children: [resolvedTitle, resolvedContent] }) }) }), isPaused && (_jsx("div", { className: "dndev-absolute dndev-inset-0 dndev-flex dndev-items-center dndev-justify-center", style: {
+                    zIndex: 30,
+                    backgroundColor: 'rgba(0, 0, 0, 0.3)',
+                    backdropFilter: 'blur(2px)',
+                }, onClick: handleClick, children: _jsx("button", { style: {
+                        width: '96px',
+                        height: '96px',
+                        borderRadius: '50%',
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        backgroundColor: 'rgba(255, 255, 255, 0.2)',
+                        border: '4px solid rgba(255, 255, 255, 0.4)',
+                        backdropFilter: 'blur(4px)',
+                        cursor: 'pointer',
+                        transition: 'all var(--dur-normal) var(--ease-in-out)',
+                    }, "aria-label": "Resume animation", children: _jsx("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "white", children: _jsx("path", { d: "M6 4h4v16H6V4zm8 0h4v16h-4V4z" }) }) }) })), _jsxs("div", { className: "dndev-crawl-stars", children: [_jsx("div", { className: "dndev-crawl-stars-layer-1" }), _jsx("div", { className: "dndev-crawl-stars-layer-2" }), _jsx("div", { className: "dndev-crawl-stars-layer-3" })] })] }));
+};
+export default CrawlContent;

package/dist/components/StackedCards/StackedCards.css

@@ -39,17 +39,6 @@
     }
   }
 
-  &:hover {
-    transform: translateX(0)
-      translateY(
-        calc(
-          -1 * ((var(--dynamic-height) - 3.5rem) + var(--gap-lg)) *
-            max(var(--i) - var(--e), 0)
-        )
-      )
-      translateY(-8px);
-  }
-
   @media (prefers-reduced-motion: reduce) {
     transition: none;
     transform: none !important;

package/dist/components/StackedCards/StackedCardsContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackedCardsContent.d.ts","sourceRoot":"","sources":["../../../src/components/StackedCards/StackedCardsContent.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAKL,KAAK,aAAa,EAClB,KAAK,aAAa,EACnB,MAAM,OAAO,CAAC;AAaf,OAAO,KAAK,EAAE,aAAa,EAAiB,MAAM,sBAAsB,CAAC;AACzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAkChE;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,aAAa,GAAG;IAC5C;;;;;;;;;;;;;;;;;;OAkBG;IACH,eAAe,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAE/C;;;;;;;;;;;;;;;OAeG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,iDAAiD;IACjD,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACzC,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC;AAUF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AACH,QAAA,MAAM,mBAAmB,EAAE,aAAa,CAAC,iBAAiB,CAoDzD,CAAC;AAgJF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"StackedCardsContent.d.ts","sourceRoot":"","sources":["../../../src/components/StackedCards/StackedCardsContent.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAKL,KAAK,aAAa,EAClB,KAAK,aAAa,EACnB,MAAM,OAAO,CAAC;AAaf,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAkChE;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,aAAa,GAAG;IAC5C;;;;;;;;;;;;;;;;;;OAkBG;IACH,eAAe,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAE/C;;;;;;;;;;;;;;;OAeG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,iDAAiD;IACjD,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACzC,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC;AAUF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AACH,QAAA,MAAM,mBAAmB,EAAE,aAAa,CAAC,iBAAiB,CAoDzD,CAAC;AAmJF,eAAe,mBAAmB,CAAC"}

package/dist/components/StackedCards/StackedCardsContent.js

@@ -162,7 +162,7 @@ const StackedCardsItem = ({ item, index, entered, onEnter, totalItems, cardProps
                     ['--dynamic-height']: `${maxCustomHeight}px`,
                 }),
                 ...cardProps.style,
-            }, children: _jsxs("div", { className: cn(surfaceVariants({ variant: cardProps.variant }), 'dndev-relative dndev-overflow-hidden dndev-h-full'), ...getVariantDataAttrs({ variant: cardProps.variant }), style: {
+            }, children: _jsxs("div", { className: cn(surfaceVariants({ variant: cardProps.variant }), 'dndev-relative dndev-overflow-hidden dndev-h-full'), ...getVariantDataAttrs({ variant: cardProps.variant }), "data-role": "card", "data-clickable": item.onClick ? 'true' : undefined, onClick: item.onClick, style: {
                     padding: 'var(--gap-sm)',
                     ...cardProps.style,
                 }, children: [_jsxs("div", { className: "stack-content", children: [_jsxs("div", { className: "dndev-stacked-cards-body", children: [_jsxs("div", { className: "dndev-stacked-cards-left", children: [_jsxs("div", { className: "dndev-stacked-cards-header", children: [item.icon && _jsx(IconRenderer, { icon: item.icon }), item.title && _jsx(Text, { as: "h3", children: item.title })] }), item.subtitle && (_jsx(Text, { as: "p", level: "h4", variant: "primary", children: item.subtitle })), item.description && (_jsx(Text, { as: "p", level: "h4", variant: "muted", children: item.description }))] }), _jsx(Separator, { orientation: "vertical", variant: SEPARATOR_VARIANT.ACCENT, className: "dndev-stacked-cards-separator" }), contentArray.length > 0 && (_jsx("div", { className: "dndev-stacked-cards-right", children: contentArray.map((point, idx) => (_jsx(Text, { as: "div", level: "body", variant: "muted", children: point }, idx))) }))] }), item.cta && (_jsx("div", { className: "dndev-stacked-cards-cta", children: _jsx(Button, { onClick: item.onClick, variant: item.cta.variant || 'primary', icon: item.cta.icon, children: item.cta.text }) })), _jsx("div", { className: "dndev-stacked-cards-spacer" })] }), _jsx("div", { className: "dndev-stacked-cards-number", children: item.number

package/dist/index.css

@@ -1 +1 @@
-:root{--crawl-perspective: 600px;--crawl-tilt: 40deg;--crawl-body-size: clamp(1.6rem, 1rem + 2.5vw, 3rem);--crawl-title-size: clamp(3rem, 1.5rem + 6vw, 8rem);--crawl-intro-font-size: clamp(2rem, 1rem + 3vw, 4rem);--crawl-content-line: 1.2;--crawl-body-margin: .9em;--crawl-title-margin: 3em;--crawl-text-color: #ffc909;--crawl-intro-color: #4a9eff;--crawl-text-shadow: 0 0 12px rgba(255, 201, 9, 1);--crawl-intro-shadow: 0 0 30px rgba(74, 158, 255, .9), 0 0 60px rgba(74, 158, 255, .6), 0 0 90px rgba(74, 158, 255, .4), 0 0 120px rgba(74, 158, 255, .2);--crawl-intro-duration: 2s}.dndev-crawl-container{position:relative;background:#000;contain:layout style paint;perspective:var(--crawl-perspective);backface-visibility:hidden;width:150vw;left:50%;transform:translate3d(-50%,0,0);margin:0;margin-top:0!important;padding:0;max-width:none;min-height:calc(100dvh - var(--header-height));overflow:hidden}.dndev-container>.dndev-crawl-container:first-child{margin-top:0!important}.dndev-container:has(>.dndev-crawl-container:first-child){margin-top:0!important}.dndev-crawl-stars{position:absolute;inset:0;z-index:1;contain:layout style paint;pointer-events:none}.dndev-crawl-stars-layer-1,.dndev-crawl-stars-layer-2,.dndev-crawl-stars-layer-3{position:absolute;inset:0;width:100%;height:100%;background-image:url("data:image/svg+xml,%3Csvg width='500' height='300' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='17' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='47' cy='89' r='1' fill='white' opacity='0.8'/%3E%3Ccircle cx='91' cy='43' r='0.5' fill='white' opacity='1'/%3E%3Ccircle cx='131' cy='67' r='1' fill='white' opacity='0.6'/%3E%3Ccircle cx='163' cy='19' r='0.5' fill='%23ddd' opacity='0.8'/%3E%3Ccircle cx='197' cy='73' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='211' cy='41' r='0.5' fill='white' opacity='0.7'/%3E%3Ccircle cx='233' cy='97' r='1' fill='%23eee' opacity='0.9'/%3E%3Ccircle cx='251' cy='13' r='0.5' fill='white' opacity='1'/%3E%3Ccircle cx='277' cy='59' r='1' fill='white' opacity='0.5'/%3E%3Ccircle cx='293' cy='83' r='0.5' fill='%23ddd' opacity='0.8'/%3E%3Ccircle cx='317' cy='31' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='337' cy='71' r='0.5' fill='white' opacity='0.8'/%3E%3Ccircle cx='359' cy='7' r='1' fill='%23eee' opacity='0.9'/%3E%3Ccircle cx='373' cy='53' r='0.5' fill='white' opacity='1'/%3E%3Ccircle cx='389' cy='79' r='1' fill='white' opacity='0.6'/%3E%3Ccircle cx='401' cy='23' r='0.5' fill='%23ddd' opacity='0.8'/%3E%3Ccircle cx='419' cy='61' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='433' cy='37' r='0.5' fill='white' opacity='0.7'/%3E%3Ccircle cx='449' cy='87' r='1' fill='%23eee' opacity='0.9'/%3E%3C/svg%3E");background-repeat:repeat;pointer-events:none}.dndev-crawl-stars-layer-1{--layer-base-opacity: 1;opacity:1;background-size:400px 250px;animation:dndev-stars-twinkle 4s ease-in-out infinite;animation-delay:0s}.dndev-crawl-stars-layer-2{--layer-base-opacity: .7;opacity:.7;background-size:300px 200px;animation:dndev-stars-twinkle 2.5s ease-in-out infinite;animation-delay:1s}.dndev-crawl-stars-layer-3{--layer-base-opacity: .5;opacity:.5;background-size:200px 150px;animation:dndev-stars-twinkle 1.8s ease-in-out infinite;animation-delay:2s}@keyframes dndev-stars-twinkle{0%,to{opacity:var(--layer-base-opacity)}50%{opacity:calc(var(--layer-base-opacity) * 1.43)}}.dndev-crawl-3d-container{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;perspective:var(--crawl-perspective);transform-style:preserve-3d;contain:layout style;backface-visibility:hidden;will-change:auto}.dndev-crawl-text{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;transform:rotateX(var(--crawl-tilt)) translateZ(0);transform-style:preserve-3d;backface-visibility:hidden;contain:layout style}.dndev-crawl-content{color:var(--crawl-text-color);font-size:var(--crawl-body-size);line-height:var(--crawl-content-line);font-weight:700;text-align:center;text-shadow:var(--crawl-text-shadow);position:relative;z-index:2;width:60%;max-width:60%;margin-left:auto;margin-right:auto;padding:0;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dndev-crawl-title,.dndev-crawl-content h1,.dndev-crawl-content h2,.dndev-crawl-content p{color:var(--crawl-text-color);font-weight:700;text-align:center;text-shadow:var(--crawl-text-shadow);@media(width<=1023px){text-shadow:none}}.dndev-crawl-title,.dndev-crawl-content h1,.dndev-crawl-content h2{font-size:var(--crawl-title-size);margin-bottom:var(--crawl-title-margin);padding:0;margin-left:0;margin-right:0}.dndev-crawl-content p{font-size:var(--crawl-body-size);margin-bottom:var(--crawl-body-margin)}@media(width>=1024px){.dndev-crawl-title{white-space:nowrap}}.dndev-crawl-intro{background:linear-gradient(180deg,#000c,#0006,#000c)}.dndev-crawl-intro-content{color:var(--crawl-intro-color);font-size:var(--crawl-intro-font-size);font-weight:900;text-align:center;text-shadow:var(--crawl-intro-shadow);letter-spacing:.1em;line-height:1.2;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:60%;max-width:60%;margin:0 auto;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;white-space:normal}.dndev-crawl-intro-mobile{animation:dndev-intro-fade-mobile var(--crawl-intro-duration) ease-in-out forwards}.dndev-crawl-intro-desktop{animation:dndev-intro-fade-desktop calc(var(--crawl-intro-duration) * 2) ease-in-out forwards}@keyframes dndev-crawl-animation{0%{transform:rotateX(var(--crawl-tilt)) translate3d(0,100dvh,0)}to{transform:rotateX(var(--crawl-tilt)) translate3d(0,calc(-1 * var(--crawl-content-height)),0)}}@media(prefers-reduced-motion:reduce){.dndev-crawl-text{animation:none!important}.dndev-crawl-3d-container{transform:rotateX(0) translateZ(0)!important}.dndev-crawl-content{position:static!important;transform:none!important;animation:none!important}.dndev-crawl-intro-mobile,.dndev-crawl-intro-desktop{animation:none!important}}@media(prefers-contrast:high){.dndev-crawl-stars{filter:contrast(1.5) brightness(1.2)}}.dndev-crawl-reduced-motion{animation:none!important;transform:none!important;.dndev-crawl-content{position:static!important;transform:none!important}.dndev-crawl-stars-layer-1,.dndev-crawl-stars-layer-2,.dndev-crawl-stars-layer-3{animation:none!important}}.stack{width:100%;height:var(--dynamic-height);contain:layout;transform-origin:center top;transform:translate(0) translateY(calc(-1 * ((var(--dynamic-height) - 3.5rem) + var(--gap-lg)) * max(var(--i) - var(--e),0)));transition:transform var(--dur-heavy) var(--ease-heavy);will-change:var(--will-change-transform);&[data-size=small]{--dynamic-height: 24rem;@media(width>=1024px){--dynamic-height: 16rem}}&[data-size=medium]{--dynamic-height: 28rem;@media(width>=1024px){--dynamic-height: 20rem}}&[data-size=large]{--dynamic-height: 36rem;@media(width>=1024px){--dynamic-height: 28rem}}&:hover{transform:translate(0) translateY(calc(-1 * ((var(--dynamic-height) - 3.5rem) + var(--gap-lg)) * max(var(--i) - var(--e),0))) translateY(-8px)}@media(prefers-reduced-motion:reduce){transition:none;transform:none!important}}.stack-content{height:calc(100% - 3.5rem);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;display:flex;flex-direction:column;gap:var(--gap-sm);&::-webkit-scrollbar{display:none}}.stack[data-stacked=true] .stack-content{opacity:0;pointer-events:none}.stack[data-stacked=true] .dndev-stacked-cards-number{opacity:1}.dndev-stacked-cards-spacer{height:3.5rem}.dndev-stacked-cards-number{position:absolute;left:var(--gap-lg);bottom:0;height:3.5rem;display:flex;align-items:center;font-size:var(--font-size-sm);font-weight:500;color:var(--muted-foreground);z-index:10;opacity:1;transition:opacity var(--dur-heavy) var(--ease-heavy)}.dndev-stacked-cards-container{display:flex;flex-direction:column;width:100%;max-width:min(100%,var(--content-width, 60rem));margin-inline:auto;gap:var(--gap-lg);position:relative;z-index:0}.dndev-stacked-cards-header{display:flex;align-items:center;gap:var(--gap-sm)}.dndev-stacked-cards-body{display:flex;flex-direction:column;gap:var(--gap-sm);width:100%;align-items:start;@media(width>=1024px){display:grid;grid-template-columns:1fr auto 1fr;width:100%;align-items:center}}.dndev-stacked-cards-left{display:flex;flex-direction:column;gap:var(--gap-sm);padding-inline:var(--gap-md);text-align:start}.dndev-stacked-cards-separator{display:block;@media(width<1024px){width:80%!important;height:2px!important;margin-inline:auto;margin-block:var(--gap-sm);align-self:center}@media(width>=1024px){width:1px!important;height:100%!important;align-self:stretch}}.dndev-stacked-cards-right{display:flex;flex-direction:column;justify-content:center;gap:var(--gap-sm);padding-inline:var(--gap-md);text-align:start}.dndev-stacked-cards-cta{padding-top:var(--gap-sm)}[data-marquee-track]{will-change:var(--will-change-transform);animation:universal-marquee var(--marquee-duration, 0ms) var(--marquee-easing, linear) infinite;animation-direction:var(--marquee-direction, normal);&[data-marquee-direction=vertical]{--transform-start: translateY(0);--transform-end: translateY(calc(-1 * var(--marquee-distance, 0px)))}&[data-marquee-behavior=bounce]{animation-name:universal-float;--transform-start: translateX(0);--transform-mid: translateX(calc(-1 * var(--marquee-distance, 0px)));--opacity-start: 1;--opacity-mid: 1}@media(prefers-reduced-motion:reduce){animation:none!important;transform:none!important}.group:hover &,.group:focus-within &{animation-play-state:paused}}.dndev-reveal-container{contain:layout style;will-change:contents;&.dndev-reveal-visible .dndev-reveal-item{opacity:1;transform:translateZ(0);animation:dndev-reveal-cleanup var(--reveal-duration) var(--reveal-easing) forwards;@media(prefers-reduced-motion:reduce){transition:none!important;opacity:1!important;transform:none!important;will-change:auto}}}.dndev-reveal-item{opacity:0;transform:translateZ(0);will-change:transform,opacity;backface-visibility:hidden;transition:opacity var(--reveal-duration) var(--reveal-easing),transform var(--reveal-duration) var(--reveal-easing);transition-delay:var(--reveal-delay, 0ms);&[data-direction=left]{transform:translate3d(calc(-1 * var(--reveal-distance)),0,0)}&[data-direction=right]{transform:translate3d(var(--reveal-distance),0,0)}&[data-direction=top]{transform:translate3d(0,calc(-1 * var(--reveal-distance)),0)}&[data-direction=bottom]{transform:translate3d(0,var(--reveal-distance),0)}&[data-direction=fade-in]{transform:translateZ(0)}&[data-visible=true]{opacity:1;transform:translateZ(0)}@media(prefers-reduced-motion:reduce){transition:none!important;opacity:1!important;transform:none!important;will-change:auto}}.breath-lung-442{animation:none;will-change:clip-path;&.active{animation:breath-cycle-442 var(--breath-cycle-duration, 16s) ease-in-out var(--breath-cycles, 3)}&.paused{animation-play-state:paused}}.breath-lung-sigh{animation:none;will-change:clip-path;&.active{animation:breath-cycle-sigh var(--breath-cycle-duration, 10s) ease-in-out var(--breath-cycles, 3)}&.paused{animation-play-state:paused}}.network-node{fill:var(--foreground);animation:universal-float 4s ease-in-out infinite;--opacity-start: .3;--opacity-mid: .8;--transform-start: scale(1);--transform-mid: scale(1.1)}.network-line{stroke:var(--foreground);stroke-width:1;animation:universal-float 6s ease-in-out infinite;--opacity-start: .1;--opacity-mid: .5;--transform-start: scale(1);--transform-mid: scale(1)}.wave-flow{background:linear-gradient(45deg,transparent 30%,color-mix(in oklab,var(--accent) 20%,transparent) 50%,transparent 70%);animation:universal-float 8s ease-in-out infinite;--transform-start: translateX(-20%) rotate(0deg);--transform-mid: translateX(20%) rotate(3deg)}.particle-float{animation:universal-slide 10s linear infinite;--opacity-start: .2;--opacity-end: 0;--transform-start: translateY(0px) rotate(0deg);--transform-end: translateY(-100px) rotate(360deg)}.geometric-rotate{animation:universal-float 20s linear infinite;--opacity-start: .1;--opacity-mid: .2;--transform-start: rotate(0deg) scale(1);--transform-mid: rotate(180deg) scale(1.1)}.perspective-1000{perspective:1000px}.transform-style-preserve-3d{transform-style:preserve-3d}.dndev-animate-fade-in-up{animation:universal-slide var(--dur-heavy) ease-out forwards}.animation-delay-100{animation-delay:.1s}.dndev-marketing-stack{display:grid;gap:var(--gap-md)}.dndev-marketing-cluster{display:flex;gap:var(--gap-sm);align-items:center;justify-content:center}
+:root{--crawl-perspective: 600px;--crawl-tilt: 40deg;--crawl-body-size: clamp(1.6rem, 1rem + 2.5vw, 3rem);--crawl-title-size: clamp(3rem, 1.5rem + 6vw, 8rem);--crawl-intro-font-size: clamp(2rem, 1rem + 3vw, 4rem);--crawl-content-line: 1.2;--crawl-body-margin: .9em;--crawl-title-margin: 3em;--crawl-text-color: #ffc909;--crawl-intro-color: #4a9eff;--crawl-text-shadow: 0 0 12px rgba(255, 201, 9, 1);--crawl-intro-shadow: 0 0 30px rgba(74, 158, 255, .9), 0 0 60px rgba(74, 158, 255, .6), 0 0 90px rgba(74, 158, 255, .4), 0 0 120px rgba(74, 158, 255, .2);--crawl-intro-duration: 2s}.dndev-crawl-container{position:relative;background:#000;contain:layout style paint;perspective:var(--crawl-perspective);backface-visibility:hidden;width:150vw;left:50%;transform:translate3d(-50%,0,0);margin:0;margin-top:0!important;padding:0;max-width:none;min-height:calc(100dvh - var(--header-height));overflow:hidden}.dndev-container>.dndev-crawl-container:first-child{margin-top:0!important}.dndev-container:has(>.dndev-crawl-container:first-child){margin-top:0!important}.dndev-crawl-stars{position:absolute;inset:0;z-index:1;contain:layout style paint;pointer-events:none}.dndev-crawl-stars-layer-1,.dndev-crawl-stars-layer-2,.dndev-crawl-stars-layer-3{position:absolute;inset:0;width:100%;height:100%;background-image:url("data:image/svg+xml,%3Csvg width='500' height='300' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='17' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='47' cy='89' r='1' fill='white' opacity='0.8'/%3E%3Ccircle cx='91' cy='43' r='0.5' fill='white' opacity='1'/%3E%3Ccircle cx='131' cy='67' r='1' fill='white' opacity='0.6'/%3E%3Ccircle cx='163' cy='19' r='0.5' fill='%23ddd' opacity='0.8'/%3E%3Ccircle cx='197' cy='73' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='211' cy='41' r='0.5' fill='white' opacity='0.7'/%3E%3Ccircle cx='233' cy='97' r='1' fill='%23eee' opacity='0.9'/%3E%3Ccircle cx='251' cy='13' r='0.5' fill='white' opacity='1'/%3E%3Ccircle cx='277' cy='59' r='1' fill='white' opacity='0.5'/%3E%3Ccircle cx='293' cy='83' r='0.5' fill='%23ddd' opacity='0.8'/%3E%3Ccircle cx='317' cy='31' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='337' cy='71' r='0.5' fill='white' opacity='0.8'/%3E%3Ccircle cx='359' cy='7' r='1' fill='%23eee' opacity='0.9'/%3E%3Ccircle cx='373' cy='53' r='0.5' fill='white' opacity='1'/%3E%3Ccircle cx='389' cy='79' r='1' fill='white' opacity='0.6'/%3E%3Ccircle cx='401' cy='23' r='0.5' fill='%23ddd' opacity='0.8'/%3E%3Ccircle cx='419' cy='61' r='1' fill='white' opacity='1'/%3E%3Ccircle cx='433' cy='37' r='0.5' fill='white' opacity='0.7'/%3E%3Ccircle cx='449' cy='87' r='1' fill='%23eee' opacity='0.9'/%3E%3C/svg%3E");background-repeat:repeat;pointer-events:none}.dndev-crawl-stars-layer-1{--layer-base-opacity: 1;opacity:1;background-size:400px 250px;animation:dndev-stars-twinkle 4s ease-in-out infinite;animation-delay:0s}.dndev-crawl-stars-layer-2{--layer-base-opacity: .7;opacity:.7;background-size:300px 200px;animation:dndev-stars-twinkle 2.5s ease-in-out infinite;animation-delay:1s}.dndev-crawl-stars-layer-3{--layer-base-opacity: .5;opacity:.5;background-size:200px 150px;animation:dndev-stars-twinkle 1.8s ease-in-out infinite;animation-delay:2s}@keyframes dndev-stars-twinkle{0%,to{opacity:var(--layer-base-opacity)}50%{opacity:calc(var(--layer-base-opacity) * 1.43)}}.dndev-crawl-3d-container{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;perspective:var(--crawl-perspective);transform-style:preserve-3d;contain:layout style;backface-visibility:hidden;will-change:auto}.dndev-crawl-text{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;transform:rotateX(var(--crawl-tilt)) translateZ(0);transform-style:preserve-3d;backface-visibility:hidden;contain:layout style}.dndev-crawl-content{color:var(--crawl-text-color);font-size:var(--crawl-body-size);line-height:var(--crawl-content-line);font-weight:700;text-align:center;text-shadow:var(--crawl-text-shadow);position:relative;z-index:2;width:60%;max-width:60%;margin-left:auto;margin-right:auto;padding:0;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dndev-crawl-title,.dndev-crawl-content h1,.dndev-crawl-content h2,.dndev-crawl-content p{color:var(--crawl-text-color);font-weight:700;text-align:center;text-shadow:var(--crawl-text-shadow);@media(width<=1023px){text-shadow:none}}.dndev-crawl-title,.dndev-crawl-content h1,.dndev-crawl-content h2{font-size:var(--crawl-title-size);margin-bottom:var(--crawl-title-margin);padding:0;margin-left:0;margin-right:0}.dndev-crawl-content p{font-size:var(--crawl-body-size);margin-bottom:var(--crawl-body-margin)}@media(width>=1024px){.dndev-crawl-title{white-space:nowrap}}.dndev-crawl-intro{background:linear-gradient(180deg,#000c,#0006,#000c)}.dndev-crawl-intro-content{color:var(--crawl-intro-color);font-size:var(--crawl-intro-font-size);font-weight:900;text-align:center;text-shadow:var(--crawl-intro-shadow);letter-spacing:.1em;line-height:1.2;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:60%;max-width:60%;margin:0 auto;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;white-space:normal}.dndev-crawl-intro-mobile{animation:dndev-intro-fade-mobile var(--crawl-intro-duration) ease-in-out forwards}.dndev-crawl-intro-desktop{animation:dndev-intro-fade-desktop calc(var(--crawl-intro-duration) * 2) ease-in-out forwards}@keyframes dndev-crawl-animation{0%{transform:rotateX(var(--crawl-tilt)) translate3d(0,100dvh,0)}to{transform:rotateX(var(--crawl-tilt)) translate3d(0,calc(-1 * var(--crawl-content-height)),0)}}@media(prefers-reduced-motion:reduce){.dndev-crawl-text{animation:none!important}.dndev-crawl-3d-container{transform:rotateX(0) translateZ(0)!important}.dndev-crawl-content{position:static!important;transform:none!important;animation:none!important}.dndev-crawl-intro-mobile,.dndev-crawl-intro-desktop{animation:none!important}}@media(prefers-contrast:high){.dndev-crawl-stars{filter:contrast(1.5) brightness(1.2)}}.dndev-crawl-reduced-motion{animation:none!important;transform:none!important;.dndev-crawl-content{position:static!important;transform:none!important}.dndev-crawl-stars-layer-1,.dndev-crawl-stars-layer-2,.dndev-crawl-stars-layer-3{animation:none!important}}.stack{width:100%;height:var(--dynamic-height);contain:layout;transform-origin:center top;transform:translate(0) translateY(calc(-1 * ((var(--dynamic-height) - 3.5rem) + var(--gap-lg)) * max(var(--i) - var(--e),0)));transition:transform var(--dur-heavy) var(--ease-heavy);will-change:var(--will-change-transform);&[data-size=small]{--dynamic-height: 24rem;@media(width>=1024px){--dynamic-height: 16rem}}&[data-size=medium]{--dynamic-height: 28rem;@media(width>=1024px){--dynamic-height: 20rem}}&[data-size=large]{--dynamic-height: 36rem;@media(width>=1024px){--dynamic-height: 28rem}}@media(prefers-reduced-motion:reduce){transition:none;transform:none!important}}.stack-content{height:calc(100% - 3.5rem);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;display:flex;flex-direction:column;gap:var(--gap-sm);&::-webkit-scrollbar{display:none}}.stack[data-stacked=true] .stack-content{opacity:0;pointer-events:none}.stack[data-stacked=true] .dndev-stacked-cards-number{opacity:1}.dndev-stacked-cards-spacer{height:3.5rem}.dndev-stacked-cards-number{position:absolute;left:var(--gap-lg);bottom:0;height:3.5rem;display:flex;align-items:center;font-size:var(--font-size-sm);font-weight:500;color:var(--muted-foreground);z-index:10;opacity:1;transition:opacity var(--dur-heavy) var(--ease-heavy)}.dndev-stacked-cards-container{display:flex;flex-direction:column;width:100%;max-width:min(100%,var(--content-width, 60rem));margin-inline:auto;gap:var(--gap-lg);position:relative;z-index:0}.dndev-stacked-cards-header{display:flex;align-items:center;gap:var(--gap-sm)}.dndev-stacked-cards-body{display:flex;flex-direction:column;gap:var(--gap-sm);width:100%;align-items:start;@media(width>=1024px){display:grid;grid-template-columns:1fr auto 1fr;width:100%;align-items:center}}.dndev-stacked-cards-left{display:flex;flex-direction:column;gap:var(--gap-sm);padding-inline:var(--gap-md);text-align:start}.dndev-stacked-cards-separator{display:block;@media(width<1024px){width:80%!important;height:2px!important;margin-inline:auto;margin-block:var(--gap-sm);align-self:center}@media(width>=1024px){width:1px!important;height:100%!important;align-self:stretch}}.dndev-stacked-cards-right{display:flex;flex-direction:column;justify-content:center;gap:var(--gap-sm);padding-inline:var(--gap-md);text-align:start}.dndev-stacked-cards-cta{padding-top:var(--gap-sm)}[data-marquee-track]{will-change:var(--will-change-transform);animation:universal-marquee var(--marquee-duration, 0ms) var(--marquee-easing, linear) infinite;animation-direction:var(--marquee-direction, normal);&[data-marquee-direction=vertical]{--transform-start: translateY(0);--transform-end: translateY(calc(-1 * var(--marquee-distance, 0px)))}&[data-marquee-behavior=bounce]{animation-name:universal-float;--transform-start: translateX(0);--transform-mid: translateX(calc(-1 * var(--marquee-distance, 0px)));--opacity-start: 1;--opacity-mid: 1}@media(prefers-reduced-motion:reduce){animation:none!important;transform:none!important}.group:hover &,.group:focus-within &{animation-play-state:paused}}.dndev-reveal-container{contain:layout style;will-change:contents;&.dndev-reveal-visible .dndev-reveal-item{opacity:1;transform:translateZ(0);animation:dndev-reveal-cleanup var(--reveal-duration) var(--reveal-easing) forwards;@media(prefers-reduced-motion:reduce){transition:none!important;opacity:1!important;transform:none!important;will-change:auto}}}.dndev-reveal-item{opacity:0;transform:translateZ(0);will-change:transform,opacity;backface-visibility:hidden;transition:opacity var(--reveal-duration) var(--reveal-easing),transform var(--reveal-duration) var(--reveal-easing);transition-delay:var(--reveal-delay, 0ms);&[data-direction=left]{transform:translate3d(calc(-1 * var(--reveal-distance)),0,0)}&[data-direction=right]{transform:translate3d(var(--reveal-distance),0,0)}&[data-direction=top]{transform:translate3d(0,calc(-1 * var(--reveal-distance)),0)}&[data-direction=bottom]{transform:translate3d(0,var(--reveal-distance),0)}&[data-direction=fade-in]{transform:translateZ(0)}&[data-visible=true]{opacity:1;transform:translateZ(0)}@media(prefers-reduced-motion:reduce){transition:none!important;opacity:1!important;transform:none!important;will-change:auto}}.breath-lung-442{animation:none;will-change:clip-path;&.active{animation:breath-cycle-442 var(--breath-cycle-duration, 16s) ease-in-out var(--breath-cycles, 3)}&.paused{animation-play-state:paused}}.breath-lung-sigh{animation:none;will-change:clip-path;&.active{animation:breath-cycle-sigh var(--breath-cycle-duration, 10s) ease-in-out var(--breath-cycles, 3)}&.paused{animation-play-state:paused}}.network-node{fill:var(--foreground);animation:universal-float 4s ease-in-out infinite;--opacity-start: .3;--opacity-mid: .8;--transform-start: scale(1);--transform-mid: scale(1.1)}.network-line{stroke:var(--foreground);stroke-width:1;animation:universal-float 6s ease-in-out infinite;--opacity-start: .1;--opacity-mid: .5;--transform-start: scale(1);--transform-mid: scale(1)}.wave-flow{background:linear-gradient(45deg,transparent 30%,color-mix(in oklab,var(--accent) 20%,transparent) 50%,transparent 70%);animation:universal-float 8s ease-in-out infinite;--transform-start: translateX(-20%) rotate(0deg);--transform-mid: translateX(20%) rotate(3deg)}.particle-float{animation:universal-slide 10s linear infinite;--opacity-start: .2;--opacity-end: 0;--transform-start: translateY(0px) rotate(0deg);--transform-end: translateY(-100px) rotate(360deg)}.geometric-rotate{animation:universal-float 20s linear infinite;--opacity-start: .1;--opacity-mid: .2;--transform-start: rotate(0deg) scale(1);--transform-mid: rotate(180deg) scale(1.1)}.perspective-1000{perspective:1000px}.transform-style-preserve-3d{transform-style:preserve-3d}.dndev-animate-fade-in-up{animation:universal-slide var(--dur-heavy) ease-out forwards}.animation-delay-100{animation-delay:.1s}.dndev-marketing-stack{display:grid;gap:var(--gap-md)}.dndev-marketing-cluster{display:flex;gap:var(--gap-sm);align-items:center;justify-content:center}

package/dist/index.js

@@ -1,4 +1,4 @@
-"use client";var Zt=Object.defineProperty;var ke=(e,t)=>()=>(e&&(t=e(e=0)),t);var Se=(e,t)=>{for(var r in t)Zt(e,r,{get:t[r],enumerable:!0})};var gt={};Se(gt,{default:()=>gr});import{useRef as sr,useState as Re,useEffect as ut}from"react";import{cn as Ve,GAP_VARIANT as lr,Stack as dr}from"@donotdev/components";import{observeElement as cr,addEventListener as mr}from"@donotdev/components";import{jsx as Me}from"react/jsx-runtime";function pr({items:e,renderItem:t,className:r,itemClassName:o,gap:i=lr.MEDIUM,speed:n=48,direction:c="auto",pauseOnHover:m=!0,ariaLabel:f,reducedMotion:u="respect",behavior:l="auto",pauseOnFocusWithin:s=!0,easing:p="ease-in-out"}){let y=typeof document<"u"&&document.dir==="rtl",S=typeof window<"u"?window.matchMedia("(prefers-reduced-motion: reduce)").matches:!1,w=c;c==="auto"&&(w=y?"right":"left");let h=w==="up"||w==="down",x=u==="ignore"||!S,R=l;l==="auto"&&(R=e.length<=20?"bounce":"infinite");let C=sr(null),[I,P]=Re(8e3),[J,K]=Re(0),[B,N]=Re(!0),[se,g]=Re(!1);ut(()=>C.current?cr(C.current,G=>N(G.isIntersecting),{threshold:0}):void 0,[]),ut(()=>{if(!C.current||typeof window>"u"||!x)return;let H=C.current,G=H.querySelector("[data-marquee-track]");if(!G)return;let ue=()=>{let j=h?H.clientHeight:H.clientWidth,re=h?G.scrollHeight:G.scrollWidth,Q=Math.max(0,re-j);if(g(Q>0),Q>0){let pe=Math.min(512,Math.max(12,n));if(R==="bounce"){let le=Q*2/pe*1e3;P(Math.max(2e3,Math.floor(le))),K(Q)}else{let le=(re+pt[i])/pe*1e3;P(Math.max(2e3,Math.floor(le))),K(re+pt[i])}}else P(0),K(0)};if(requestAnimationFrame(ue),typeof ResizeObserver<"u"){let j=new ResizeObserver(()=>{requestAnimationFrame(ue)});return j.observe(H),()=>j.disconnect()}else return mr(window,"resize",()=>requestAnimationFrame(ue))},[e,n,h,x,R,i]);let M=()=>h?w==="up"?"normal":"reverse":w==="left"?"normal":"reverse",O=()=>R==="infinite"&&se?[...e,...e].map((H,G)=>Me("div",{className:Ve("dndev-flex-shrink-0",o),children:t(H,G%e.length)},G)):e.map((H,G)=>Me("div",{className:Ve("dndev-flex-shrink-0",o),children:t(H,G)},G));return Me("div",{ref:C,className:Ve("dndev-relative dndev-overflow-hidden",m&&"group",s&&"focus-within:group",r),role:"region","aria-label":f||`${R==="infinite"?"Scrolling":"Bouncing"} content with ${e.length} items`,"aria-live":x&&B?"off":"polite",children:Me(dr,{className:"marquee-track",direction:h?"column":"row",align:h?void 0:"center",gap:i,"data-marquee-track":!0,"data-marquee-direction":h?"vertical":"horizontal","data-marquee-behavior":R,"data-marquee-reduced-motion":!x,style:{"--marquee-duration":x&&B&&se?`${I}ms`:"0ms","--marquee-direction":M(),"--marquee-distance":h?`${J}px`:`${J}px`,"--marquee-easing":ur[p],animationPlayState:!x||!B?"paused":"running"},children:O()})})}var pt,ur,gr,vt=ke(()=>{"use strict";pt={none:0,tight:8,medium:16,large:32},ur={linear:"linear","ease-in-out":"ease-in-out","ease-out":"ease-out"};gr=pr});var Mt={};Se(Mt,{default:()=>pa});import{ChevronLeft as aa,ChevronRight as na,Play as oa,Pause as ia}from"lucide-react";import{useRef as Ue,useState as ne,useEffect as Ke,useCallback as $,useMemo as Qe,memo as sa}from"react";import{cn as Ie,observeElement as la,addEventListener as da,isRTLLanguage as ca,Stack as ma}from"@donotdev/components";import{Fragment as ga,jsx as L,jsxs as Je}from"react/jsx-runtime";function ua({items:e,renderItem:t,className:r,slideClassName:o,showArrows:i=!0,showDots:n=!1,showProgress:c=!0,autoplay:m=!0,autoplayInterval:f=5e3,transition:u="slide",infinite:l=!0,slidesToShow:s=1,swipeable:p=!0,momentum:y=!0,onActiveChange:S,onSlideClick:w,keyExtractor:h,"aria-label":x="Premium carousel",pauseOnHover:R=!0,pauseOnInvisible:C=!0,showPlayPause:I=!0,lazy:P=!1,preloadDistance:J=1}){if(!e||e.length===0)return L(ma,{align:"center",justify:"center",className:Ie("dndev-relative",r),children:L("div",{style:{color:"var(--muted-foreground)"},children:"No items to display"})});let K=Ue(null),B=Ue(null),[N,se]=ne(0),[g,M]=ne(m),[O,H]=ne(!1),[G,ue]=ne(!0),[X,j]=ne({isDragging:!1,startX:0,currentX:0,startTime:0,velocity:0}),re=Ue(null),[Q,pe]=ne("idle"),[le,nt]=ne(!1);Ke(()=>{if(typeof window>"u")return;let a=window.matchMedia("(prefers-reduced-motion: reduce)");return nt(a.matches),da(a,"change",v=>{nt(v.matches)})},[]);let Ce=Qe(()=>({tension:.3,friction:.8,mass:1}),[]),Bt=Qe(()=>{if(!l||e.length<=s)return e;let a=Math.max(s,2),d=e.slice(-a),v=e.slice(0,a);return[...d,...e,...v]},[e,l,s]),V=Qe(()=>100/s,[s]),Ge=$(a=>{if(!l)return a;let d=Math.max(s,2);return((a-d)%e.length+e.length)%e.length},[l,e.length,s]),ot=$(a=>{if(!l)return!0;let d=Math.max(s,2),v=e.length+d-1;return a>=d&&a<=v},[l,e.length,s]),Xe=$((a,d,v=0)=>{if(!y)return;let k=parseFloat(a.style.transform.replace("translateX(","").replace("%)",""))||0,z=v,_=Date.now(),U=()=>{let ge=(Date.now()-_)/1e3,xe=k-d,Qt=-Ce.tension*xe,Jt=-Ce.friction*z,jt=(Qt+Jt)/Ce.mass;z+=jt*ge,k+=z*ge,a.style.transform=`translateX(${k}%)`,Math.abs(xe)>.1||Math.abs(z)>.1?requestAnimationFrame(U):(a.style.transform=`translateX(${d}%)`,a.style.transition="none")};requestAnimationFrame(U)},[y,Ce]),it=$((a,d,v)=>{switch(u){case"fade":a.style.transition=`opacity ${v} ease-in-out`,a.style.opacity="0",setTimeout(()=>{a.style.transform=`translateX(${d}%)`,a.style.opacity="1"},parseInt(v)/2);break;case"scale":a.style.transition=`transform ${v} cubic-bezier(0.25, 0.46, 0.45, 0.94)`,a.style.transform=`translateX(${d}%) scale(0.95)`,setTimeout(()=>{a.style.transform=`translateX(${d}%) scale(1)`},parseInt(v)/2);break;case"parallax":a.style.transition=`transform ${v} cubic-bezier(0.25, 0.46, 0.45, 0.94)`,a.style.transform=`translateX(${d}%)`,a.querySelectorAll('[role="group"]').forEach((z,_)=>{let U=z,q=(_-Math.abs(d)/V)*.1;U.style.transform=`translateX(${q}%)`});break;default:a.style.transition=`transform ${v} cubic-bezier(0.25, 0.46, 0.45, 0.94)`,a.style.transform=`translateX(${d}%)`;break}},[u,V]),Y=$((a,d=!1)=>{if(Q!=="idle"&&!d)return;let v=B.current;if(!v)return;let k=a;if(l){let q=Math.max(s,2);k=a+q,a>=e.length?k=q+a%e.length:a<0&&(k=q+e.length+a)}let z=-(k*V),_=d||le?"0ms":"300ms";d||pe("transitioning"),it(v,z,_);let U=Ge(k);if(se(U),S?.(U),l&&!d&&ot(k)){let q=Math.max(s,2);(k<=q-1||k>=e.length+q)&&(v.dataset.needsReset="true",v.dataset.resetIndex=k<=q-1?(e.length+q-1).toString():q.toString())}},[l,e.length,V,s,Ge,S,le,Q,ot,it]),te=$(()=>{Y(N+1)},[N,Y]),de=$(()=>{Y(N-1)},[N,Y]),qe=$(()=>{M(!0)},[]),Oe=$(()=>{M(!1)},[]);Ke(()=>{if(!(!g||O||!G||e.length<=1))return re.current=setTimeout(()=>{te()},f),()=>{re.current&&clearTimeout(re.current)}},[g,O,G,N,te,f,e.length]),Ke(()=>!C||!K.current?void 0:la(K.current,d=>ue(d.isIntersecting),{threshold:.1}),[C]);let Vt=$(a=>P?Math.abs(a-N)<=J:!0,[P,N,J]),Ft=$(a=>{if(!p||Q!=="idle")return;let d=a.touches[0];d&&j({isDragging:!0,startX:d.clientX,currentX:d.clientX,startTime:Date.now(),velocity:0})},[p,Q]),Yt=$(a=>{if(!X.isDragging)return;let d=a.touches[0];if(!d)return;let v=d.clientX-X.startX,k=Date.now()-X.startTime,z=k>0?v/k:0,_=B.current;if(_&&Math.abs(v)>10){a.preventDefault();let U=-(N*V),q=v/(K.current?.clientWidth||1)*100,ge=Math.min(Math.abs(v)/200,.8),xe=q*(1-ge);_.style.transition="none",_.style.transform=`translateX(${U+xe}%)`}j(U=>({...U,currentX:d.clientX,velocity:z}))},[X.isDragging,X.startX,X.startTime,N,V]),_t=$(()=>{if(!X.isDragging)return;let a=X.currentX-X.startX,d=X.velocity,v=50;if(y&&Math.abs(d)>.5){let k=B.current;if(k){let z=d>0?N-1:N+1,_=-(z*V);Xe(k,_,d*100),Y(z,!0)}}else if(Math.abs(a)>v)a>0?de():te();else{let k=B.current;if(k&&y){let z=-(N*V);Xe(k,z,d*100)}else Y(N,!0)}j({isDragging:!1,startX:0,currentX:0,startTime:0,velocity:0})},[X,y,te,de,Y,N,Xe,V]),Ut=$(()=>{pe("idle");let a=B.current;if(a?.dataset.needsReset==="true"){let d=parseInt(a.dataset.resetIndex||"0");a.style.transition="none",a.style.transform=`translateX(-${d*V}%)`,delete a.dataset.needsReset,delete a.dataset.resetIndex}},[V]),Kt=$(a=>{let d=ca();switch(a.key){case"ArrowLeft":a.preventDefault(),d?te():de();break;case"ArrowRight":a.preventDefault(),d?de():te();break;case"Home":a.preventDefault(),Y(0);break;case"End":a.preventDefault(),Y(e.length-1);break;case" ":a.preventDefault(),g?Oe():qe();break}},[te,de,Y,e.length,g,qe,Oe]);return Je("div",{ref:K,className:Ie("dndev-relative dndev-overflow-hidden",r),onMouseEnter:()=>R&&H(!0),onMouseLeave:()=>R&&H(!1),onKeyDown:Kt,tabIndex:0,role:"region","aria-label":x,"aria-live":"polite",children:[L("div",{className:"dndev-overflow-hidden",children:L("div",{ref:B,className:Ie("dndev-flex",X.isDragging&&"dndev-pointer-events-none",Q==="transitioning"&&"dndev-pointer-events-none"),style:{cursor:X.isDragging?"grabbing":void 0},onTransitionEnd:Ut,onTouchStart:Ft,onTouchMove:Yt,onTouchEnd:_t,children:Bt.map((a,d)=>{let v=Ge(d),k=v===N,z=Vt(v);return L("div",{className:Ie("dndev-flex-shrink-0",o),style:{width:`${V}%`,opacity:z?1:0},role:"group","aria-roledescription":"slide","aria-label":`Slide ${v+1} of ${e.length}`,onClick:()=>w?.(a,v),children:z&&t(a,v,k)},h?h(a,v):`${v}-${d}`)})})}),i&&e.length>1&&Je(ga,{children:[L("button",{className:"dndev-absolute dndev-z-breadcrumbs dndev-flex dndev-items-center dndev-justify-center",style:{left:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",opacity:0,transition:"opacity var(--dur-normal)",borderRadius:"9999px",backgroundColor:"rgb(from var(--background) r g b / 0.8)",border:"1px solid var(--border)"},onMouseEnter:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.9)",a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.8)"},onClick:de,"aria-label":"Previous slide",children:L(aa,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}})}),L("button",{className:"dndev-absolute dndev-z-breadcrumbs dndev-flex dndev-items-center dndev-justify-center",style:{right:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",opacity:0,transition:"opacity var(--dur-normal)",borderRadius:"9999px",backgroundColor:"rgb(from var(--background) r g b / 0.8)",border:"1px solid var(--border)"},onMouseEnter:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.9)",a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.8)"},onClick:te,"aria-label":"Next slide",children:L(na,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}})})]}),m&&I&&L("button",{className:"dndev-absolute dndev-z-breadcrumbs dndev-flex dndev-items-center dndev-justify-center",style:{insetBlockStart:"var(--gap-md)",insetInlineEnd:"var(--gap-md)",width:"2rem",height:"2rem",opacity:0,transition:"opacity var(--dur-normal)",borderRadius:"9999px",backgroundColor:"rgb(from var(--background) r g b / 0.8)",border:"1px solid var(--border)"},onMouseEnter:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.9)",a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.8)"},onClick:()=>g?Oe():qe(),"aria-label":g?"Pause carousel":"Play carousel",children:g?L(ia,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}}):L(oa,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}})}),n&&e.length>1&&L("div",{className:"dndev-absolute dndev-flex dndev-gap-sm dndev-z-breadcrumbs",style:{bottom:"1rem",left:"50%",transform:"translateX(-50%)"},children:e.map((a,d)=>L("button",{style:{width:d===N?"1.5rem":"0.5rem",height:"0.5rem",borderRadius:"9999px",transition:"all 0.3s",backgroundColor:d===N?"var(--foreground)":"rgb(from var(--foreground) r g b / 0.3)"},onMouseEnter:v=>{d!==N&&(v.currentTarget.style.backgroundColor="rgb(from var(--foreground) r g b / 0.5)")},onMouseLeave:v=>{d!==N&&(v.currentTarget.style.backgroundColor="rgb(from var(--foreground) r g b / 0.3)")},onClick:()=>Y(d),"aria-label":`Go to slide ${d+1}`},d))}),c&&m&&L("div",{className:"dndev-absolute dndev-left-0",style:{bottom:0,right:0,height:"0.25rem",backgroundColor:"rgb(from var(--foreground) r g b / 0.2)"},children:L("div",{style:{height:"100%",width:`${(N+1)/e.length*100}%`,backgroundColor:"var(--foreground)",transition:"width 0.1s linear"}})}),Je("div",{className:"dndev-sr-only","aria-live":"polite","aria-atomic":"true",children:["Slide ",N+1," of ",e.length]})]})}var Rt,pa,Et=ke(()=>{"use strict";Rt=sa(ua);Rt.displayName="Carousel";pa=Rt});var zt={};Se(zt,{default:()=>Sa});import{memo as wa}from"react";import{Card as Ca,Text as Ze}from"@donotdev/components";import{cn as xa}from"@donotdev/components";import{Fragment as Na,jsx as we,jsxs as Pt}from"react/jsx-runtime";var ka,Sa,At=ke(()=>{"use strict";ka=wa(function({title:t,items:r,gridCols:o=2,className:i,ariaLabel:n}){let c={1:"grid-cols-1",2:"grid-cols-1 md:grid-cols-2",3:"grid-cols-1 md:grid-cols-2 lg:grid-cols-3",4:"grid-cols-1 md:grid-cols-2 lg:grid-cols-4"},m=Array.isArray(r)?r:[];return Array.isArray(r),Pt("div",{className:xa("dndev-marketing-stack",i),"aria-label":n,children:[t&&we(Ze,{as:"h3",level:"h2",children:t}),we("div",{className:"dndev-marketing-dndev-grid","data-cols":o,children:m.map((f,u)=>we(Ca,{title:f.useCase,subtitle:f.bestFit,content:Pt(Na,{children:[we(Ze,{variant:"muted",level:"body",children:f.dndev}),we(Ze,{variant:"muted",level:"small",className:"italic",children:f.reason})]})},u))})]})}),Sa=ka});var Ot={};Se(Ot,{default:()=>pn});import{memo as He}from"react";import{cn as rt,Card as rn,Icon as an,Stack as nn}from"@donotdev/components";import{jsx as A,jsxs as me}from"react/jsx-runtime";var ie,Xt,on,qt,sn,ln,dn,cn,mn,un,pn,Wt=ke(()=>{"use strict";ie={desktop:{cardWidth:300,cardHeight:200,cardGap:32,drop:80,startX:0,containerWidth:1024,containerHeight:380},mobile:{cardWidth:320,cardHeight:200,verticalGap:24,containerWidth:400,curveOffset:40}},Xt=He(({className:e,density:t,onClick:r,icon:o,title:i,subtitle:n,description:c})=>me(rn,{className:rt("dndev-min-w-0",r?"cursor-pointer":"",e),style:{height:"200px",padding:"var(--gap-md)",transform:"scale(1)",transition:"transform var(--duration-normal)"},onMouseEnter:m=>{m.currentTarget.style.transform="scale(0.80)"},onMouseLeave:m=>{m.currentTarget.style.transform="scale(1)"},onClick:r,children:[me(nn,{direction:"row",align:"center",gap:"medium",style:{marginBottom:"var(--gap-md)"},children:[A(on,{icon:o}),A("h3",{style:{fontSize:"var(--font-size-lg)",fontWeight:600,lineHeight:1.25,color:"var(--foreground)"},children:i})]}),n&&A("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)",lineHeight:1.625,marginBottom:"var(--gap-md)"},children:n}),c&&A("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--accent)",transition:"color var(--duration-normal)",cursor:"pointer"},onMouseEnter:m=>{m.currentTarget.style.color="rgb(from var(--accent) r g b / 0.8)"},onMouseLeave:m=>{m.currentTarget.style.color="var(--accent)"},children:c})]})),on=He(({icon:e})=>e?A("div",{className:"dndev-inline-flex dndev-flex-shrink-0 dndev-items-center dndev-justify-center",style:{width:"var(--touch-target)",height:"var(--touch-target)",borderRadius:"var(--radius-lg)",background:"linear-gradient(to bottom right, rgb(from var(--primary) r g b / 0.1), rgb(from var(--primary) r g b / 0.2))",color:"var(--primary)",transition:"background var(--duration-normal)"},onMouseEnter:t=>{t.currentTarget.style.background="linear-gradient(to bottom right, rgb(from var(--primary) r g b / 0.2), rgb(from var(--primary) r g b / 0.3))"},onMouseLeave:t=>{t.currentTarget.style.background="linear-gradient(to bottom right, rgb(from var(--primary) r g b / 0.1), rgb(from var(--primary) r g b / 0.2))"},children:A(an,{icon:e,ariaHidden:!0})}):null),qt=He(function({className:t,startX:r,startY:o,endX:i,endY:n,index:c,isMobile:m=!1}){let f,u,l,s,p;if(m){let{curveOffset:y}=ie.mobile,S=(o+n)/2,w=r+y;u=Math.abs(w-r)+40,l=Math.abs(n-o)+40,s=Math.min(r,w)-20,p=Math.min(o,n)-20;let h=r-s,x=o-p,R=i-s,C=n-p,I=w-s,P=S-p;f=`M ${h} ${x} Q ${I} ${P} ${R} ${C}`}else{let y=(r+i)/2,S=o+(n-o)*.3;u=Math.abs(i-r)+40,l=Math.abs(n-o)+40,s=Math.min(r,i)-20,p=Math.min(o,n)-20;let w=r-s,h=o-p,x=i-s,R=n-p,C=y-s,I=S-p;f=`M ${w} ${h} Q ${C} ${I-20} ${x} ${R}`}return me("svg",{className:rt(t),style:{left:s,top:p,width:u,height:l,zIndex:1},viewBox:`0 0 ${u} ${l}`,role:"img",focusable:"false",children:[A("path",{d:f,fill:"none",stroke:"currentColor",strokeWidth:"3",strokeDasharray:"8,8",className:"text-accent waterfall-connector",style:{animationDelay:`${c*.2}s`}}),A("circle",{cx:r-s,cy:o-p,r:"6",fill:"currentColor",className:"text-accent"}),A("circle",{cx:i-s,cy:n-p,r:"6",fill:"currentColor",className:"text-accent"})]})}),sn=e=>{let{cardWidth:t,cardGap:r,drop:o,startX:i}=ie.desktop;return{x:i+e*(t+r),y:e*o}},ln=e=>{let{cardHeight:t,verticalGap:r}=ie.mobile;return{x:0,y:e*(t+r)}},dn=e=>{let{cardWidth:t,cardGap:r,drop:o}=ie.desktop;return e===0?{startX:t,startY:o/2,endX:t+r+t/2,endY:o}:e===1?{startX:2*t+r,startY:1.5*o,endX:2.5*t+2*r,endY:2*o}:null},cn=e=>{let{cardWidth:t,cardHeight:r,verticalGap:o}=ie.mobile;return e===0?{startX:t,startY:.66*r,endX:t,endY:1.33*r+o}:e===1?{startX:t,startY:1.66*r+o,endX:t,endY:2.33*r+2*o}:null},mn=e=>{let{cardHeight:t,verticalGap:r}=ie.mobile;return(e-1)*(t+r)+t+40},un=He(({items:e,className:t,connectorClassName:r,density:o="comfortable",ariaLabel:i,direction:n="horizontal"})=>{if(!e?.length)return null;if(n==="descending"){let{desktop:m,mobile:f}=ie;return me("section",{className:rt("dndev-w-full dndev-overflow-hidden",t),children:[me("div",{className:"dndev-hidden  dndev-relative ",style:{width:`${m.containerWidth}px`,height:`${m.containerHeight}px`},children:[A("ol",{className:"dndev-relative","aria-label":i??"Process steps",children:e.map((u,l)=>{let{x:s,y:p}=sn(l);return A("li",{className:"list-none dndev-absolute waterfall-card",style:{left:`${s}px`,top:`${p}px`,width:`${m.cardWidth}px`},children:A(Xt,{density:o,onClick:u.onClick,icon:u.icon,title:u.title,subtitle:u.subtitle,description:u.description})},`cascade-${l}-${u.title}`)})}),e.map((u,l)=>{if(l>=e.length-1)return null;let s=dn(l);return s?A(qt,{startX:s.startX,startY:s.startY,endX:s.endX,endY:s.endY,className:r,index:l,isMobile:!1},`desktop-connector-${l}`):null})]}),A("div",{className:" dndev-w-full px-[var(--content-padding)]",children:me("div",{className:"dndev-relative dndev-mx-auto",style:{width:`${f.containerWidth}px`,height:`${mn(e.length)}px`},children:[A("ol",{className:"dndev-relative","aria-label":i??"Process steps",children:e.map((u,l)=>{let{x:s,y:p}=ln(l);return A("li",{className:"list-none dndev-absolute",style:{left:`${s}px`,top:`${p}px`,width:`${f.cardWidth}px`},children:A(Xt,{density:o,onClick:u.onClick,icon:u.icon,title:u.title,subtitle:u.subtitle,description:u.description})},`mobile-${l}-${u.title}`)})}),e.map((u,l)=>{if(l>=e.length-1)return null;let s=cn(l);return s?A(qt,{startX:s.startX,startY:s.startY,endX:s.endX,endY:s.endY,className:r,index:l,isMobile:!0},`mobile-connector-${l}`):null})]})})]})}return null}),pn=un});import{useEffect as We,useRef as lt,useState as Ne,useMemo as Te,isValidElement as er}from"react";import{cn as tr}from"@donotdev/components";import{isClient as dt}from"@donotdev/core";import{createElement as ve}from"react";function fe(e,t={}){let{allowedTags:r=["p","br","u","i","em","strong","b"],preserveLineBreaks:o=!0,className:i}=t;if(!e||typeof e!="string")return[];let n=e;o&&(n=n.replace(/\n/g,"<br/>"));let c=n.split(/(<[^>]+>)/),m=[],f=0;for(let u=0;u<c.length;u++){let l=c[u];if(!l)continue;let s=l.match(/^<(\w+)(?:\s[^>]*)?\s*\/>$/);if(s&&s[1]){let y=s[1].toLowerCase();if(r.includes(y)){let S=st(y,"",i,f++);S&&m.push(S);continue}}let p=l.match(/^<(\w+)(?:\s[^>]*)?>$/);if(p&&p[1]){let y=p[1].toLowerCase();if(r.includes(y)){let S=`</${y}>`,w="",h=u+1;for(;h<c.length&&c[h]&&!c[h].includes(S);)w+=c[h],h++;h<c.length&&c[h]&&(w+=c[h].replace(S,""));let x=st(y,w,i,f++);x&&m.push(x),u=h;continue}}l&&!l.startsWith("<")&&m.push(l)}return m}function st(e,t,r,o){let i={key:o};switch(r&&(i.className=r),e){case"p":return ve("p",i,t);case"br":return ve("br",i);case"u":return ve("u",i,t);case"i":case"em":return ve("em",i,t);case"strong":case"b":return ve("strong",i,t);default:return t}}import{jsx as T,jsxs as he}from"react/jsx-runtime";var rr=({content:e,intro:t,title:r,duration:o=26,contentHeight:i="150vh",tiltAngle:n,className:c,style:m,"aria-label":f})=>{let u=g=>!g||typeof g!="string"?null:g.split(/\n\s*\n/).map(O=>O.trim()).filter(O=>O.length>0).map((O,H)=>T("p",{children:fe(O,{allowedTags:["u","br","i","em","strong","b"]})},`p-${H}`)),l=Te(()=>t==null?null:typeof t=="string"?T("div",{className:"dndev-crawl-intro-text",children:fe(t,{allowedTags:["u","br","i","em","strong","b"]})}):t,[t]),s=Te(()=>r?typeof r=="string"?T("h2",{className:"dndev-crawl-title",children:fe(r,{allowedTags:["u","br","i","em","strong","b"]})}):r:null,[r]),p=Te(()=>er(e)?e:Array.isArray(e)?e.map(M=>typeof M=="string"?M.trim():"").filter(M=>M&&M.length>0).map((M,O)=>T("p",{children:fe(M,{allowedTags:["u","br","i","em","strong","b"]})},`c-${O}`)):typeof e=="string"?u(e):e,[e]),y=lt(null),S=lt(null),[w,h]=Ne(!1),[x,R]=Ne(!1),[C,I]=Ne(!1),[P,J]=Ne(!1);We(()=>{J(!0),h(!0)},[]);let K=()=>{h(!1),R(!0),I(!1)},B=g=>{x&&!C&&!w&&I(!0)},N=g=>{g.stopPropagation(),I(!1)},se=Te(()=>{let g={"--crawl-content-height":i,animationName:x?"dndev-crawl-animation":"none",animationDuration:`${o}s`,animationTimingFunction:"linear",animationIterationCount:"infinite",animationFillMode:"forwards",animationPlayState:C?"paused":"running"};return n!==void 0&&(g["--crawl-tilt"]=`${n}deg`),g},[x,C,o,i,n]);return We(()=>{if(!P||!dt()||!y.current)return;let g=window.matchMedia("(prefers-reduced-motion: reduce)"),M=()=>{g.matches&&y.current&&y.current.classList.add("dndev-crawl-reduced-motion")};return M(),g.addEventListener("change",M),()=>g.removeEventListener("change",M)},[P]),We(()=>{if(!P||!dt()||!x||!S.current)return;let g=new IntersectionObserver(M=>{(M[0]?.isIntersecting??!0)||I(!0)},{threshold:.1});return g.observe(S.current),()=>g.disconnect()},[P,x]),he("div",{ref:S,className:tr("dndev-crawl-container","dndev-relative dndev-overflow-hidden",c),style:{...m,height:"calc(100dvh - var(--header-height))"},onClick:B,"aria-label":f||"Animated text crawl",role:"region","aria-live":"polite",children:[!w&&T("div",{className:"dndev-crawl-3d-container",children:T("div",{ref:y,className:"dndev-crawl-text",style:{...se,willChange:x&&!C?"transform":"auto"},children:he("div",{className:"dndev-crawl-content",children:[s,p]})})}),w&&P&&he("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-flex-col dndev-items-center dndev-justify-center",style:{zIndex:30,backgroundColor:"rgba(0, 0, 0, 0.6)",backdropFilter:"blur(4px)"},children:[l&&T("div",{className:"dndev-w-full",style:{paddingInline:"var(--content-padding)",marginBottom:"3rem"},children:T("div",{className:"dndev-crawl-intro-content",children:l})}),T("button",{onClick:K,style:{width:"96px",height:"96px",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(255, 255, 255, 0.2)",border:"4px solid rgba(255, 255, 255, 0.4)",backdropFilter:"blur(4px)",cursor:"pointer",transition:"all var(--dur-normal) var(--ease-in-out)",transformOrigin:"center"},onMouseEnter:g=>{g.currentTarget.style.backgroundColor="rgba(255, 255, 255, 0.3)",g.currentTarget.style.borderColor="rgba(255, 255, 255, 0.6)",g.currentTarget.style.transform="scale(1.1)"},onMouseLeave:g=>{g.currentTarget.style.backgroundColor="rgba(255, 255, 255, 0.2)",g.currentTarget.style.borderColor="rgba(255, 255, 255, 0.4)",g.currentTarget.style.transform="scale(1)"},"aria-label":"Start animated introduction",children:T("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"white",style:{marginInlineStart:"4px"},children:T("path",{d:"M8 5v14l11-7z"})})})]}),C&&x&&P&&T("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-items-center dndev-justify-center",style:{zIndex:30,backgroundColor:"rgba(0, 0, 0, 0.3)",backdropFilter:"blur(2px)"},onClick:N,children:T("button",{style:{width:"96px",height:"96px",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(255, 255, 255, 0.2)",border:"4px solid rgba(255, 255, 255, 0.4)",backdropFilter:"blur(4px)",cursor:"pointer",transition:"all var(--dur-normal) var(--ease-in-out)",transformOrigin:"center"},onMouseEnter:g=>{g.currentTarget.style.backgroundColor="rgba(255, 255, 255, 0.3)",g.currentTarget.style.borderColor="rgba(255, 255, 255, 0.6)",g.currentTarget.style.transform="scale(1.1)"},onMouseLeave:g=>{g.currentTarget.style.backgroundColor="rgba(255, 255, 255, 0.2)",g.currentTarget.style.borderColor="rgba(255, 255, 255, 0.4)",g.currentTarget.style.transform="scale(1)"},"aria-label":"Resume animation",children:T("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"white",children:T("path",{d:"M6 4h4v16H6V4zm8 0h4v16h-4V4z"})})})}),x&&he("div",{className:"dndev-crawl-stars",children:[T("div",{className:"dndev-crawl-stars-layer-1"}),T("div",{className:"dndev-crawl-stars-layer-2"}),T("div",{className:"dndev-crawl-stars-layer-3"})]}),!P&&he("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-flex-col dndev-items-center dndev-justify-center",style:{zIndex:20,backgroundColor:"rgba(0, 0, 0, 0.5)"},children:[l&&T("div",{className:"dndev-w-full",style:{paddingInline:"var(--content-padding)",marginBottom:"3rem"},children:T("div",{className:"dndev-crawl-intro-content",children:l})}),T("div",{style:{width:"96px",height:"96px",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(255, 255, 255, 0.2)",border:"4px solid rgba(255, 255, 255, 0.4)"},children:T("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"white",style:{marginInlineStart:"4px"},children:T("path",{d:"M8 5v14l11-7z"})})})]})]})},ct=rr;import{Suspense as vr,lazy as fr}from"react";import{cn as ar,GAP_VARIANT as nr,Stack as or}from"@donotdev/components";import{jsx as Be}from"react/jsx-runtime";function ir({className:e,itemCount:t=8,itemWidth:r,gap:o=nr.MEDIUM,direction:i="horizontal"}){let n=i==="vertical";return Be("div",{className:ar("dndev-relative dndev-overflow-hidden",e),role:"status","aria-label":"Loading content",children:Be(or,{direction:n?"column":"row",align:n?void 0:"center",gap:o,children:Array.from({length:t*2}).map((c,m)=>Be("div",{className:"dndev-flex-shrink-0 dndev-animate-pulse",style:n?{height:"4rem",width:"100%",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}:{height:"4rem",width:r||"4rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}},m))})})}var mt=ir;import{GAP_VARIANT as yr}from"@donotdev/components";import{jsx as Fe}from"react/jsx-runtime";var hr=fr(()=>Promise.resolve().then(()=>(vt(),gt))),br=e=>{let{gap:t=yr.MEDIUM,direction:r="auto",...o}=e;return Fe(vr,{fallback:Fe(mt,{itemCount:8,gap:t,direction:r==="up"||r==="down"?"vertical":"horizontal"}),children:Fe(hr,{...o})})},ft=br;import{Eye as wr}from"lucide-react";import{useState as Cr}from"react";import{PortalButton as xr,cn as ht,Sheet as kr,Code as Sr,Stack as Nr}from"@donotdev/components";import{Fragment as Rr,jsx as Ee,jsxs as Mr}from"react/jsx-runtime";function Tr({data:e,sourceCode:t,language:r="tsx",title:o="Page Source",className:i}){let[n,c]=Cr(!1),m=t||e||"",f=u=>{};return Mr(Rr,{children:[Ee(xr,{icon:wr,onClick:()=>c(!0),className:ht("dndev-z-overlay",i),style:{position:"fixed",zIndex:"var(--z-overlay)",right:"var(--gap-sm)",bottom:"calc(var(--footer-height, 0px) + var(--gap-sm))"},tooltip:"Code Inspector","aria-label":"Code Inspector"}),Ee(kr,{open:n,onOpenChange:c,side:"bottom",className:ht("dndev-w-full",i),style:{width:"100%",height:"90%",maxHeight:"90dvh",borderRadius:"var(--radius-xl) var(--radius-xl) 0 0",display:"flex",flexDirection:"column",overflow:"hidden"},children:Ee(Nr,{gap:"none",style:{flex:"1 1 auto",minHeight:0,overflow:"hidden"},children:Ee(Sr,{language:r,showCopyButton:!0,onCopy:f,children:m})})})]})}var yt=Tr;import{memo as Er,useEffect as Pr,useRef as zr,useState as Ar}from"react";import{cn as Ye,Button as Ir,IconBox as Dr,Separator as Lr,SEPARATOR_VARIANT as $r,Text as Pe,useIntersectionObserver as Hr,getVariantDataAttrs as Gr,surfaceVariants as Xr}from"@donotdev/components";import{jsx as D,jsxs as ye}from"react/jsx-runtime";var bt={intersectionThreshold:.3,intersectionRootMargin:"0px 0px -20% 0px"},qr=Er(({icon:e})=>e?D(Dr,{icon:e,ariaHidden:!0}):null),Or=({items:e,className:t,ariaLabel:r,variant:o,style:i})=>{let[n,c]=Ar(0),m=zr(null),u=e.some(p=>p.customHeight)?Math.max(...e.map(p=>p.customHeight||0).filter(p=>p>0)):null,l={small:1,medium:2,large:3},s=e.reduce((p,y)=>{let S=y.estimatedHeight||"medium",w=l[S]||2,h=l[p]||2;return w>h?S:p},"medium");return D("div",{className:Ye("dndev-relative dndev-stacked-cards-container",t),ref:m,"aria-label":r,style:{"--e":n.toString()},children:e.map((p,y)=>D(Wr,{item:p,index:y,entered:n,onEnter:()=>c(y),totalItems:e.length,cardProps:{variant:o,style:i},maxEstimatedHeight:s,maxCustomHeight:u},y))})},Wr=({item:e,index:t,entered:r,onEnter:o,totalItems:i,cardProps:n,maxEstimatedHeight:c,maxCustomHeight:m})=>{let{ref:f,isIntersecting:u}=Hr({threshold:bt.intersectionThreshold,rootMargin:bt.intersectionRootMargin});Pr(()=>{typeof window<"u"&&u&&o()},[u,o]);let l=Array.isArray(e.content)?e.content:e.content?[e.content]:[];return D("section",{ref:f,className:"dndev-relative",style:{zIndex:i-t-1},children:D("div",{className:Ye("dndev-relative dndev-overflow-hidden stack","dndev-min-w-0"),"data-size":m?void 0:c,"data-stacked":t>r?"true":"false",style:{"--i":t.toString(),...m&&{"--dynamic-height":`${m}px`},...n.style},children:ye("div",{className:Ye(Xr({variant:n.variant}),"dndev-relative dndev-overflow-hidden dndev-h-full"),...Gr({variant:n.variant}),style:{padding:"var(--gap-sm)",...n.style},children:[ye("div",{className:"stack-content",children:[ye("div",{className:"dndev-stacked-cards-body",children:[ye("div",{className:"dndev-stacked-cards-left",children:[ye("div",{className:"dndev-stacked-cards-header",children:[e.icon&&D(qr,{icon:e.icon}),e.title&&D(Pe,{as:"h3",children:e.title})]}),e.subtitle&&D(Pe,{as:"p",level:"h4",variant:"primary",children:e.subtitle}),e.description&&D(Pe,{as:"p",level:"h4",variant:"muted",children:e.description})]}),D(Lr,{orientation:"vertical",variant:$r.ACCENT,className:"dndev-stacked-cards-separator"}),l.length>0&&D("div",{className:"dndev-stacked-cards-right",children:l.map((s,p)=>D(Pe,{as:"div",level:"body",variant:"muted",children:s},p))})]}),e.cta&&D("div",{className:"dndev-stacked-cards-cta",children:D(Ir,{onClick:e.onClick,variant:e.cta.variant||"primary",icon:e.cta.icon,children:e.cta.text})}),D("div",{className:"dndev-stacked-cards-spacer"})]}),D("div",{className:"dndev-stacked-cards-number",children:e.number?String(e.number):String(t+1).padStart(2,"0")})]})})})},wt=Or;import{jsx as Vr}from"react/jsx-runtime";var Br=function(t){return Vr(wt,{...t})},Ct=Br;import{useCallback as Fr}from"react";import{cn as Yr,useViewportVisibility as _r}from"@donotdev/components";import{jsx as xt}from"react/jsx-runtime";var Ur=({items:e=[],direction:t="fade-in",stagger:r=100,threshold:o,distance:i,duration:n,once:c=!1,viewport:m=!0,overrides:f=[],className:u,children:l})=>{let{ref:s,isVisible:p,hasTriggered:y,visibleItems:S,isItemVisible:w}=_r({threshold:o,once:c,trackItems:m,enableScrollListener:m}),h=Fr(R=>{let C=f.find(I=>I.index===R);if(C)return C.direction;switch(t){case"alternate-h":return R%2===0?"left":"right";case"alternate-v":return R%2===0?"top":"bottom";default:return t}},[t,f]),x=()=>e.map((R,C)=>{let I=h(C),P=C*r,J=m?w(C):p;return xt("div",{className:"dndev-reveal-item","data-direction":I,"data-visible":J,style:{"--reveal-delay":`${P}ms`,"--reveal-index":C,...i!==void 0&&{"--reveal-distance":`${i}vw`},...n!==void 0&&{"--reveal-duration":`${n}ms`}},children:R},C)});return xt("div",{ref:s,className:Yr("dndev-reveal-container",p&&"dndev-reveal-visible",u),"data-direction":t,"data-stagger":r,children:e.length>0?x():l})},be=Ur;import{jsx as _e,jsxs as Qr}from"react/jsx-runtime";function Kr({status:e,animationClass:t}){return _e("svg",{width:"100%",height:"100%",viewBox:"0 0 512 512",className:"drop--lg",preserveAspectRatio:"xMidYMid meet",children:Qr("g",{transform:"translate(0,512) scale(0.1,-0.1)",children:[_e("path",{d:`M2465 4956 c-60 -28 -97 -66 -124 -126 -20 -44 -21 -63 -21 -630 0
+"use client";var er=Object.defineProperty;var le=(e,t)=>()=>(e&&(t=e(e=0)),t);var ve=(e,t)=>{for(var r in t)er(e,r,{get:t[r],enumerable:!0})};import{createElement as fe}from"react";function de(e,t={}){let{allowedTags:r=["p","br","u","i","em","strong","b"],preserveLineBreaks:i=!0,className:n}=t;if(!e||typeof e!="string")return[];let o=e;i&&(o=o.replace(/\n/g,"<br/>"));let l=o.split(/(<[^>]+>)/),d=[],v=0;for(let u=0;u<l.length;u++){let c=l[u];if(!c)continue;let s=c.match(/^<(\w+)(?:\s[^>]*)?\s*\/>$/);if(s&&s[1]){let h=s[1].toLowerCase();if(r.includes(h)){let x=st(h,"",n,v++);x&&d.push(x);continue}}let p=c.match(/^<(\w+)(?:\s[^>]*)?>$/);if(p&&p[1]){let h=p[1].toLowerCase();if(r.includes(h)){let x=`</${h}>`,y="",g=u+1;for(;g<l.length&&l[g]&&!l[g].includes(x);)y+=l[g],g++;g<l.length&&l[g]&&(y+=l[g].replace(x,""));let C=st(h,y,n,v++);C&&d.push(C),u=g;continue}}c&&!c.startsWith("<")&&d.push(c)}return d}function st(e,t,r,i){let n={key:i};switch(r&&(n.className=r),e){case"p":return fe("p",n,t);case"br":return fe("br",n);case"u":return fe("u",n,t);case"i":case"em":return fe("em",n,t);case"strong":case"b":return fe("strong",n,t);default:return t}}var qe=le(()=>{"use strict"});var lt={};ve(lt,{default:()=>sr});import{useEffect as tr,useRef as rr,useState as ar,useMemo as We,isValidElement as nr}from"react";import{isClient as or}from"@donotdev/core";import{Fragment as lr,jsx as G,jsxs as Oe}from"react/jsx-runtime";var ir,sr,dt=le(()=>{"use strict";qe();ir=({content:e,title:t,duration:r=26,contentHeight:i="150vh",tiltAngle:n,onPause:o,onResume:l})=>{let d=rr(null),[v,u]=ar(!1),c=y=>!y||typeof y!="string"?null:y.split(/\n\s*\n/).map(C=>C.trim()).filter(C=>C.length>0).map((C,S)=>G("p",{children:de(C,{allowedTags:["u","br","i","em","strong","b"]})},`p-${S}`)),s=We(()=>t?typeof t=="string"?G("h2",{className:"dndev-crawl-title",children:de(t,{allowedTags:["u","br","i","em","strong","b"]})}):t:null,[t]),p=We(()=>nr(e)?e:Array.isArray(e)?e.map(g=>typeof g=="string"?g.trim():"").filter(g=>g&&g.length>0).map((g,C)=>G("p",{children:de(g,{allowedTags:["u","br","i","em","strong","b"]})},`c-${C}`)):typeof e=="string"?c(e):e,[e]),h=We(()=>{let y={"--crawl-content-height":i,animationName:"dndev-crawl-animation",animationDuration:`${r}s`,animationTimingFunction:"linear",animationIterationCount:"infinite",animationFillMode:"forwards",animationPlayState:v?"paused":"running"};return n!==void 0&&(y["--crawl-tilt"]=`${n}deg`),y},[v,r,i,n]);tr(()=>{if(!or()||!d.current)return;let y=window.matchMedia("(prefers-reduced-motion: reduce)"),g=()=>{y.matches&&d.current&&d.current.classList.add("dndev-crawl-reduced-motion")};return g(),y.addEventListener("change",g),()=>y.removeEventListener("change",g)},[]);let x=()=>{v?(u(!1),l?.()):(u(!0),o?.())};return Oe(lr,{children:[G("div",{className:"dndev-crawl-3d-container",onClick:x,children:G("div",{ref:d,className:"dndev-crawl-text",style:{...h,willChange:v?"auto":"transform"},children:Oe("div",{className:"dndev-crawl-content",children:[s,p]})})}),v&&G("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-items-center dndev-justify-center",style:{zIndex:30,backgroundColor:"rgba(0, 0, 0, 0.3)",backdropFilter:"blur(2px)"},onClick:x,children:G("button",{style:{width:"96px",height:"96px",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(255, 255, 255, 0.2)",border:"4px solid rgba(255, 255, 255, 0.4)",backdropFilter:"blur(4px)",cursor:"pointer",transition:"all var(--dur-normal) var(--ease-in-out)"},"aria-label":"Resume animation",children:G("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"white",children:G("path",{d:"M6 4h4v16H6V4zm8 0h4v16h-4V4z"})})})}),Oe("div",{className:"dndev-crawl-stars",children:[G("div",{className:"dndev-crawl-stars-layer-1"}),G("div",{className:"dndev-crawl-stars-layer-2"}),G("div",{className:"dndev-crawl-stars-layer-3"})]})]})},sr=ir});var vt={};ve(vt,{default:()=>Rr});import{useRef as wr,useState as Ne,useEffect as pt}from"react";import{cn as Ve,GAP_VARIANT as Cr,Stack as xr}from"@donotdev/components";import{observeElement as kr,addEventListener as Sr}from"@donotdev/components";import{jsx as Te}from"react/jsx-runtime";function Tr({items:e,renderItem:t,className:r,itemClassName:i,gap:n=Cr.MEDIUM,speed:o=48,direction:l="auto",pauseOnHover:d=!0,ariaLabel:v,reducedMotion:u="respect",behavior:c="auto",pauseOnFocusWithin:s=!0,easing:p="ease-in-out"}){let h=typeof document<"u"&&document.dir==="rtl",x=typeof window<"u"?window.matchMedia("(prefers-reduced-motion: reduce)").matches:!1,y=l;l==="auto"&&(y=h?"right":"left");let g=y==="up"||y==="down",C=u==="ignore"||!x,S=c;c==="auto"&&(S=e.length<=20?"bounce":"infinite");let N=wr(null),[q,V]=Ne(8e3),[ee,J]=Ne(0),[F,k]=Ne(!0),[we,_]=Ne(!1);pt(()=>N.current?kr(N.current,A=>k(A.isIntersecting),{threshold:0}):void 0,[]),pt(()=>{if(!N.current||typeof window>"u"||!C)return;let $=N.current,A=$.querySelector("[data-marquee-track]");if(!A)return;let ue=()=>{let U=g?$.clientHeight:$.clientWidth,te=g?A.scrollHeight:A.scrollWidth,Y=Math.max(0,te-U);if(_(Y>0),Y>0){let pe=Math.min(512,Math.max(12,o));if(S==="bounce"){let ie=Y*2/pe*1e3;V(Math.max(2e3,Math.floor(ie))),J(Y)}else{let ie=(te+gt[n])/pe*1e3;V(Math.max(2e3,Math.floor(ie))),J(te+gt[n])}}else V(0),J(0)};if(requestAnimationFrame(ue),typeof ResizeObserver<"u"){let U=new ResizeObserver(()=>{requestAnimationFrame(ue)});return U.observe($),()=>U.disconnect()}else return Sr(window,"resize",()=>requestAnimationFrame(ue))},[e,o,g,C,S,n]);let Ce=()=>g?y==="up"?"normal":"reverse":y==="left"?"normal":"reverse",xe=()=>S==="infinite"&&we?[...e,...e].map(($,A)=>Te("div",{className:Ve("dndev-flex-shrink-0",i),children:t($,A%e.length)},A)):e.map(($,A)=>Te("div",{className:Ve("dndev-flex-shrink-0",i),children:t($,A)},A));return Te("div",{ref:N,className:Ve("dndev-relative dndev-overflow-hidden",d&&"group",s&&"focus-within:group",r),role:"region","aria-label":v||`${S==="infinite"?"Scrolling":"Bouncing"} content with ${e.length} items`,"aria-live":C&&F?"off":"polite",children:Te(xr,{className:"marquee-track",direction:g?"column":"row",align:g?void 0:"center",gap:n,"data-marquee-track":!0,"data-marquee-direction":g?"vertical":"horizontal","data-marquee-behavior":S,"data-marquee-reduced-motion":!C,style:{"--marquee-duration":C&&F&&we?`${q}ms`:"0ms","--marquee-direction":Ce(),"--marquee-distance":g?`${ee}px`:`${ee}px`,"--marquee-easing":Nr[p],animationPlayState:!C||!F?"paused":"running"},children:xe()})})}var gt,Nr,Rr,ft=le(()=>{"use strict";gt={none:0,tight:8,medium:16,large:32},Nr={linear:"linear","ease-in-out":"ease-in-out","ease-out":"ease-out"};Rr=Tr});var Et={};ve(Et,{default:()=>Ta});import{ChevronLeft as fa,ChevronRight as ha,Play as ya,Pause as ba}from"lucide-react";import{useRef as Ue,useState as ae,useEffect as Ke,useCallback as z,useMemo as Qe,memo as wa}from"react";import{cn as ze,observeElement as Ca,addEventListener as xa,isRTLLanguage as ka,Stack as Sa}from"@donotdev/components";import{Fragment as Ra,jsx as P,jsxs as Je}from"react/jsx-runtime";function Na({items:e,renderItem:t,className:r,slideClassName:i,showArrows:n=!0,showDots:o=!1,showProgress:l=!0,autoplay:d=!0,autoplayInterval:v=5e3,transition:u="slide",infinite:c=!0,slidesToShow:s=1,swipeable:p=!0,momentum:h=!0,onActiveChange:x,onSlideClick:y,keyExtractor:g,"aria-label":C="Premium carousel",pauseOnHover:S=!0,pauseOnInvisible:N=!0,showPlayPause:q=!0,lazy:V=!1,preloadDistance:ee=1}){if(!e||e.length===0)return P(Sa,{align:"center",justify:"center",className:ze("dndev-relative",r),children:P("div",{style:{color:"var(--muted-foreground)"},children:"No items to display"})});let J=Ue(null),F=Ue(null),[k,we]=ae(0),[_,Ce]=ae(d),[xe,$]=ae(!1),[A,ue]=ae(!0),[I,U]=ae({isDragging:!1,startX:0,currentX:0,startTime:0,velocity:0}),te=Ue(null),[Y,pe]=ae("idle"),[ie,nt]=ae(!1);Ke(()=>{if(typeof window>"u")return;let a=window.matchMedia("(prefers-reduced-motion: reduce)");return nt(a.matches),xa(a,"change",f=>{nt(f.matches)})},[]);let ke=Qe(()=>({tension:.3,friction:.8,mass:1}),[]),Vt=Qe(()=>{if(!c||e.length<=s)return e;let a=Math.max(s,2),m=e.slice(-a),f=e.slice(0,a);return[...m,...e,...f]},[e,c,s]),H=Qe(()=>100/s,[s]),$e=z(a=>{if(!c)return a;let m=Math.max(s,2);return((a-m)%e.length+e.length)%e.length},[c,e.length,s]),ot=z(a=>{if(!c)return!0;let m=Math.max(s,2),f=e.length+m-1;return a>=m&&a<=f},[c,e.length,s]),He=z((a,m,f=0)=>{if(!h)return;let w=parseFloat(a.style.transform.replace("translateX(","").replace("%)",""))||0,R=f,O=Date.now(),B=()=>{let ge=(Date.now()-O)/1e3,Se=w-m,Jt=-ke.tension*Se,Zt=-ke.friction*R,jt=(Jt+Zt)/ke.mass;R+=jt*ge,w+=R*ge,a.style.transform=`translateX(${w}%)`,Math.abs(Se)>.1||Math.abs(R)>.1?requestAnimationFrame(B):(a.style.transform=`translateX(${m}%)`,a.style.transition="none")};requestAnimationFrame(B)},[h,ke]),it=z((a,m,f)=>{switch(u){case"fade":a.style.transition=`opacity ${f} ease-in-out`,a.style.opacity="0",setTimeout(()=>{a.style.transform=`translateX(${m}%)`,a.style.opacity="1"},parseInt(f)/2);break;case"scale":a.style.transition=`transform ${f} cubic-bezier(0.25, 0.46, 0.45, 0.94)`,a.style.transform=`translateX(${m}%) scale(0.95)`,setTimeout(()=>{a.style.transform=`translateX(${m}%) scale(1)`},parseInt(f)/2);break;case"parallax":a.style.transition=`transform ${f} cubic-bezier(0.25, 0.46, 0.45, 0.94)`,a.style.transform=`translateX(${m}%)`,a.querySelectorAll('[role="group"]').forEach((R,O)=>{let B=R,D=(O-Math.abs(m)/H)*.1;B.style.transform=`translateX(${D}%)`});break;default:a.style.transition=`transform ${f} cubic-bezier(0.25, 0.46, 0.45, 0.94)`,a.style.transform=`translateX(${m}%)`;break}},[u,H]),W=z((a,m=!1)=>{if(Y!=="idle"&&!m)return;let f=F.current;if(!f)return;let w=a;if(c){let D=Math.max(s,2);w=a+D,a>=e.length?w=D+a%e.length:a<0&&(w=D+e.length+a)}let R=-(w*H),O=m||ie?"0ms":"300ms";m||pe("transitioning"),it(f,R,O);let B=$e(w);if(we(B),x?.(B),c&&!m&&ot(w)){let D=Math.max(s,2);(w<=D-1||w>=e.length+D)&&(f.dataset.needsReset="true",f.dataset.resetIndex=w<=D-1?(e.length+D-1).toString():D.toString())}},[c,e.length,H,s,$e,x,ie,Y,ot,it]),Z=z(()=>{W(k+1)},[k,W]),se=z(()=>{W(k-1)},[k,W]),Ge=z(()=>{Ce(!0)},[]),Xe=z(()=>{Ce(!1)},[]);Ke(()=>{if(!(!_||xe||!A||e.length<=1))return te.current=setTimeout(()=>{Z()},v),()=>{te.current&&clearTimeout(te.current)}},[_,xe,A,k,Z,v,e.length]),Ke(()=>!N||!J.current?void 0:Ca(J.current,m=>ue(m.isIntersecting),{threshold:.1}),[N]);let Ft=z(a=>V?Math.abs(a-k)<=ee:!0,[V,k,ee]),Yt=z(a=>{if(!p||Y!=="idle")return;let m=a.touches[0];m&&U({isDragging:!0,startX:m.clientX,currentX:m.clientX,startTime:Date.now(),velocity:0})},[p,Y]),_t=z(a=>{if(!I.isDragging)return;let m=a.touches[0];if(!m)return;let f=m.clientX-I.startX,w=Date.now()-I.startTime,R=w>0?f/w:0,O=F.current;if(O&&Math.abs(f)>10){a.preventDefault();let B=-(k*H),D=f/(J.current?.clientWidth||1)*100,ge=Math.min(Math.abs(f)/200,.8),Se=D*(1-ge);O.style.transition="none",O.style.transform=`translateX(${B+Se}%)`}U(B=>({...B,currentX:m.clientX,velocity:R}))},[I.isDragging,I.startX,I.startTime,k,H]),Ut=z(()=>{if(!I.isDragging)return;let a=I.currentX-I.startX,m=I.velocity,f=50;if(h&&Math.abs(m)>.5){let w=F.current;if(w){let R=m>0?k-1:k+1,O=-(R*H);He(w,O,m*100),W(R,!0)}}else if(Math.abs(a)>f)a>0?se():Z();else{let w=F.current;if(w&&h){let R=-(k*H);He(w,R,m*100)}else W(k,!0)}U({isDragging:!1,startX:0,currentX:0,startTime:0,velocity:0})},[I,h,Z,se,W,k,He,H]),Kt=z(()=>{pe("idle");let a=F.current;if(a?.dataset.needsReset==="true"){let m=parseInt(a.dataset.resetIndex||"0");a.style.transition="none",a.style.transform=`translateX(-${m*H}%)`,delete a.dataset.needsReset,delete a.dataset.resetIndex}},[H]),Qt=z(a=>{let m=ka();switch(a.key){case"ArrowLeft":a.preventDefault(),m?Z():se();break;case"ArrowRight":a.preventDefault(),m?se():Z();break;case"Home":a.preventDefault(),W(0);break;case"End":a.preventDefault(),W(e.length-1);break;case" ":a.preventDefault(),_?Xe():Ge();break}},[Z,se,W,e.length,_,Ge,Xe]);return Je("div",{ref:J,className:ze("dndev-relative dndev-overflow-hidden",r),onMouseEnter:()=>S&&$(!0),onMouseLeave:()=>S&&$(!1),onKeyDown:Qt,tabIndex:0,role:"region","aria-label":C,"aria-live":"polite",children:[P("div",{className:"dndev-overflow-hidden",children:P("div",{ref:F,className:ze("dndev-flex",I.isDragging&&"dndev-pointer-events-none",Y==="transitioning"&&"dndev-pointer-events-none"),style:{cursor:I.isDragging?"grabbing":void 0},onTransitionEnd:Kt,onTouchStart:Yt,onTouchMove:_t,onTouchEnd:Ut,children:Vt.map((a,m)=>{let f=$e(m),w=f===k,R=Ft(f);return P("div",{className:ze("dndev-flex-shrink-0",i),style:{width:`${H}%`,opacity:R?1:0},role:"group","aria-roledescription":"slide","aria-label":`Slide ${f+1} of ${e.length}`,onClick:()=>y?.(a,f),children:R&&t(a,f,w)},g?g(a,f):`${f}-${m}`)})})}),n&&e.length>1&&Je(Ra,{children:[P("button",{className:"dndev-absolute dndev-z-breadcrumbs dndev-flex dndev-items-center dndev-justify-center",style:{left:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",opacity:0,transition:"opacity var(--dur-normal)",borderRadius:"9999px",backgroundColor:"rgb(from var(--background) r g b / 0.8)",border:"1px solid var(--border)"},onMouseEnter:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.9)",a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.8)"},onClick:se,"aria-label":"Previous slide",children:P(fa,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}})}),P("button",{className:"dndev-absolute dndev-z-breadcrumbs dndev-flex dndev-items-center dndev-justify-center",style:{right:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",opacity:0,transition:"opacity var(--dur-normal)",borderRadius:"9999px",backgroundColor:"rgb(from var(--background) r g b / 0.8)",border:"1px solid var(--border)"},onMouseEnter:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.9)",a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.8)"},onClick:Z,"aria-label":"Next slide",children:P(ha,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}})})]}),d&&q&&P("button",{className:"dndev-absolute dndev-z-breadcrumbs dndev-flex dndev-items-center dndev-justify-center",style:{insetBlockStart:"var(--gap-md)",insetInlineEnd:"var(--gap-md)",width:"2rem",height:"2rem",opacity:0,transition:"opacity var(--dur-normal)",borderRadius:"9999px",backgroundColor:"rgb(from var(--background) r g b / 0.8)",border:"1px solid var(--border)"},onMouseEnter:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.9)",a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.backgroundColor="rgb(from var(--background) r g b / 0.8)"},onClick:()=>_?Xe():Ge(),"aria-label":_?"Pause carousel":"Play carousel",children:_?P(ba,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}}):P(ya,{style:{width:"var(--icon-md)",height:"var(--icon-md)",color:"var(--foreground)"}})}),o&&e.length>1&&P("div",{className:"dndev-absolute dndev-flex dndev-gap-sm dndev-z-breadcrumbs",style:{bottom:"1rem",left:"50%",transform:"translateX(-50%)"},children:e.map((a,m)=>P("button",{style:{width:m===k?"1.5rem":"0.5rem",height:"0.5rem",borderRadius:"9999px",transition:"all 0.3s",backgroundColor:m===k?"var(--foreground)":"rgb(from var(--foreground) r g b / 0.3)"},onMouseEnter:f=>{m!==k&&(f.currentTarget.style.backgroundColor="rgb(from var(--foreground) r g b / 0.5)")},onMouseLeave:f=>{m!==k&&(f.currentTarget.style.backgroundColor="rgb(from var(--foreground) r g b / 0.3)")},onClick:()=>W(m),"aria-label":`Go to slide ${m+1}`},m))}),l&&d&&P("div",{className:"dndev-absolute dndev-left-0",style:{bottom:0,right:0,height:"0.25rem",backgroundColor:"rgb(from var(--foreground) r g b / 0.2)"},children:P("div",{style:{height:"100%",width:`${(k+1)/e.length*100}%`,backgroundColor:"var(--foreground)",transition:"width 0.1s linear"}})}),Je("div",{className:"dndev-sr-only","aria-live":"polite","aria-atomic":"true",children:["Slide ",k+1," of ",e.length]})]})}var Mt,Ta,Pt=le(()=>{"use strict";Mt=wa(Na);Mt.displayName="Carousel";Ta=Mt});var At={};ve(At,{default:()=>Ha});import{memo as Ia}from"react";import{Card as Da,Text as je}from"@donotdev/components";import{cn as La}from"@donotdev/components";import{Fragment as Ga,jsx as be,jsxs as zt}from"react/jsx-runtime";var $a,Ha,It=le(()=>{"use strict";$a=Ia(function({title:t,items:r,gridCols:i=2,className:n,ariaLabel:o}){let l={1:"grid-cols-1",2:"grid-cols-1 md:grid-cols-2",3:"grid-cols-1 md:grid-cols-2 lg:grid-cols-3",4:"grid-cols-1 md:grid-cols-2 lg:grid-cols-4"},d=Array.isArray(r)?r:[];return Array.isArray(r),zt("div",{className:La("dndev-marketing-stack",n),"aria-label":o,children:[t&&be(je,{as:"h3",level:"h2",children:t}),be("div",{className:"dndev-marketing-dndev-grid","data-cols":i,children:d.map((v,u)=>be(Da,{title:v.useCase,subtitle:v.bestFit,content:zt(Ga,{children:[be(je,{variant:"muted",level:"body",children:v.dndev}),be(je,{variant:"muted",level:"small",className:"italic",children:v.reason})]})},u))})]})}),Ha=$a});var Ot={};ve(Ot,{default:()=>Tn});import{memo as Le}from"react";import{cn as rt,Card as fn,Icon as hn,Stack as yn}from"@donotdev/components";import{jsx as M,jsxs as me}from"react/jsx-runtime";var oe,qt,bn,Wt,wn,Cn,xn,kn,Sn,Nn,Tn,Bt=le(()=>{"use strict";oe={desktop:{cardWidth:300,cardHeight:200,cardGap:32,drop:80,startX:0,containerWidth:1024,containerHeight:380},mobile:{cardWidth:320,cardHeight:200,verticalGap:24,containerWidth:400,curveOffset:40}},qt=Le(({className:e,density:t,onClick:r,icon:i,title:n,subtitle:o,description:l})=>me(fn,{className:rt("dndev-min-w-0",r?"cursor-pointer":"",e),style:{height:"200px",padding:"var(--gap-md)",transform:"scale(1)",transition:"transform var(--duration-normal)"},onMouseEnter:d=>{d.currentTarget.style.transform="scale(0.80)"},onMouseLeave:d=>{d.currentTarget.style.transform="scale(1)"},onClick:r,children:[me(yn,{direction:"row",align:"center",gap:"medium",style:{marginBottom:"var(--gap-md)"},children:[M(bn,{icon:i}),M("h3",{style:{fontSize:"var(--font-size-lg)",fontWeight:600,lineHeight:1.25,color:"var(--foreground)"},children:n})]}),o&&M("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)",lineHeight:1.625,marginBottom:"var(--gap-md)"},children:o}),l&&M("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--accent)",transition:"color var(--duration-normal)",cursor:"pointer"},onMouseEnter:d=>{d.currentTarget.style.color="rgb(from var(--accent) r g b / 0.8)"},onMouseLeave:d=>{d.currentTarget.style.color="var(--accent)"},children:l})]})),bn=Le(({icon:e})=>e?M("div",{className:"dndev-inline-flex dndev-flex-shrink-0 dndev-items-center dndev-justify-center",style:{width:"var(--touch-target)",height:"var(--touch-target)",borderRadius:"var(--radius-lg)",background:"linear-gradient(to bottom right, rgb(from var(--primary) r g b / 0.1), rgb(from var(--primary) r g b / 0.2))",color:"var(--primary)",transition:"background var(--duration-normal)"},onMouseEnter:t=>{t.currentTarget.style.background="linear-gradient(to bottom right, rgb(from var(--primary) r g b / 0.2), rgb(from var(--primary) r g b / 0.3))"},onMouseLeave:t=>{t.currentTarget.style.background="linear-gradient(to bottom right, rgb(from var(--primary) r g b / 0.1), rgb(from var(--primary) r g b / 0.2))"},children:M(hn,{icon:e,ariaHidden:!0})}):null),Wt=Le(function({className:t,startX:r,startY:i,endX:n,endY:o,index:l,isMobile:d=!1}){let v,u,c,s,p;if(d){let{curveOffset:h}=oe.mobile,x=(i+o)/2,y=r+h;u=Math.abs(y-r)+40,c=Math.abs(o-i)+40,s=Math.min(r,y)-20,p=Math.min(i,o)-20;let g=r-s,C=i-p,S=n-s,N=o-p,q=y-s,V=x-p;v=`M ${g} ${C} Q ${q} ${V} ${S} ${N}`}else{let h=(r+n)/2,x=i+(o-i)*.3;u=Math.abs(n-r)+40,c=Math.abs(o-i)+40,s=Math.min(r,n)-20,p=Math.min(i,o)-20;let y=r-s,g=i-p,C=n-s,S=o-p,N=h-s,q=x-p;v=`M ${y} ${g} Q ${N} ${q-20} ${C} ${S}`}return me("svg",{className:rt(t),style:{left:s,top:p,width:u,height:c,zIndex:1},viewBox:`0 0 ${u} ${c}`,role:"img",focusable:"false",children:[M("path",{d:v,fill:"none",stroke:"currentColor",strokeWidth:"3",strokeDasharray:"8,8",className:"text-accent waterfall-connector",style:{animationDelay:`${l*.2}s`}}),M("circle",{cx:r-s,cy:i-p,r:"6",fill:"currentColor",className:"text-accent"}),M("circle",{cx:n-s,cy:o-p,r:"6",fill:"currentColor",className:"text-accent"})]})}),wn=e=>{let{cardWidth:t,cardGap:r,drop:i,startX:n}=oe.desktop;return{x:n+e*(t+r),y:e*i}},Cn=e=>{let{cardHeight:t,verticalGap:r}=oe.mobile;return{x:0,y:e*(t+r)}},xn=e=>{let{cardWidth:t,cardGap:r,drop:i}=oe.desktop;return e===0?{startX:t,startY:i/2,endX:t+r+t/2,endY:i}:e===1?{startX:2*t+r,startY:1.5*i,endX:2.5*t+2*r,endY:2*i}:null},kn=e=>{let{cardWidth:t,cardHeight:r,verticalGap:i}=oe.mobile;return e===0?{startX:t,startY:.66*r,endX:t,endY:1.33*r+i}:e===1?{startX:t,startY:1.66*r+i,endX:t,endY:2.33*r+2*i}:null},Sn=e=>{let{cardHeight:t,verticalGap:r}=oe.mobile;return(e-1)*(t+r)+t+40},Nn=Le(({items:e,className:t,connectorClassName:r,density:i="comfortable",ariaLabel:n,direction:o="horizontal"})=>{if(!e?.length)return null;if(o==="descending"){let{desktop:d,mobile:v}=oe;return me("section",{className:rt("dndev-w-full dndev-overflow-hidden",t),children:[me("div",{className:"dndev-hidden  dndev-relative ",style:{width:`${d.containerWidth}px`,height:`${d.containerHeight}px`},children:[M("ol",{className:"dndev-relative","aria-label":n??"Process steps",children:e.map((u,c)=>{let{x:s,y:p}=wn(c);return M("li",{className:"list-none dndev-absolute waterfall-card",style:{left:`${s}px`,top:`${p}px`,width:`${d.cardWidth}px`},children:M(qt,{density:i,onClick:u.onClick,icon:u.icon,title:u.title,subtitle:u.subtitle,description:u.description})},`cascade-${c}-${u.title}`)})}),e.map((u,c)=>{if(c>=e.length-1)return null;let s=xn(c);return s?M(Wt,{startX:s.startX,startY:s.startY,endX:s.endX,endY:s.endY,className:r,index:c,isMobile:!1},`desktop-connector-${c}`):null})]}),M("div",{className:" dndev-w-full px-[var(--content-padding)]",children:me("div",{className:"dndev-relative dndev-mx-auto",style:{width:`${v.containerWidth}px`,height:`${Sn(e.length)}px`},children:[M("ol",{className:"dndev-relative","aria-label":n??"Process steps",children:e.map((u,c)=>{let{x:s,y:p}=Cn(c);return M("li",{className:"list-none dndev-absolute",style:{left:`${s}px`,top:`${p}px`,width:`${v.cardWidth}px`},children:M(qt,{density:i,onClick:u.onClick,icon:u.icon,title:u.title,subtitle:u.subtitle,description:u.description})},`mobile-${c}-${u.title}`)})}),e.map((u,c)=>{if(c>=e.length-1)return null;let s=kn(c);return s?M(Wt,{startX:s.startX,startY:s.startY,endX:s.endX,endY:s.endY,className:r,index:c,isMobile:!0},`mobile-connector-${c}`):null})]})})]})}return null}),Tn=Nn});qe();import{useState as dr,useMemo as cr,lazy as mr,Suspense as ur}from"react";import{cn as pr}from"@donotdev/components";import{jsx as j,jsxs as ct}from"react/jsx-runtime";var gr=mr(()=>Promise.resolve().then(()=>(dt(),lt))),vr=({content:e,intro:t,title:r,duration:i=26,contentHeight:n="150vh",tiltAngle:o,className:l,style:d,"aria-label":v})=>{let[u,c]=dr(!0),s=cr(()=>t==null?null:typeof t=="string"?j("div",{className:"dndev-crawl-intro-text",children:de(t,{allowedTags:["u","br","i","em","strong","b"]})}):t,[t]),p=()=>{c(!1)};return ct("div",{className:pr("dndev-crawl-container","dndev-relative dndev-overflow-hidden",l),style:{...d,height:"calc(100dvh - var(--header-height))"},"aria-label":v||"Animated text crawl",role:"region","aria-live":"polite",children:[u&&ct("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-flex-col dndev-items-center dndev-justify-center",style:{zIndex:30,backgroundColor:"rgba(0, 0, 0, 0.6)",backdropFilter:"blur(4px)"},children:[s&&j("div",{className:"dndev-w-full",style:{paddingInline:"var(--content-padding)",marginBottom:"3rem"},children:j("div",{className:"dndev-crawl-intro-content",children:s})}),j("button",{onClick:p,style:{width:"96px",height:"96px",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(255, 255, 255, 0.2)",border:"4px solid rgba(255, 255, 255, 0.4)",backdropFilter:"blur(4px)",cursor:"pointer",transition:"all var(--dur-normal) var(--ease-in-out)"},onMouseEnter:h=>{h.currentTarget.style.backgroundColor="rgba(255, 255, 255, 0.3)",h.currentTarget.style.borderColor="rgba(255, 255, 255, 0.6)",h.currentTarget.style.transform="scale(1.1)"},onMouseLeave:h=>{h.currentTarget.style.backgroundColor="rgba(255, 255, 255, 0.2)",h.currentTarget.style.borderColor="rgba(255, 255, 255, 0.4)",h.currentTarget.style.transform="scale(1)"},"aria-label":"Start animated introduction",children:j("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"white",style:{marginInlineStart:"4px"},children:j("path",{d:"M8 5v14l11-7z"})})})]}),!u&&j(ur,{fallback:null,children:j(gr,{title:r,content:e,duration:i,contentHeight:n,tiltAngle:o})})]})},mt=vr;import{Suspense as Mr,lazy as Er}from"react";import{cn as fr,GAP_VARIANT as hr,Stack as yr}from"@donotdev/components";import{jsx as Be}from"react/jsx-runtime";function br({className:e,itemCount:t=8,itemWidth:r,gap:i=hr.MEDIUM,direction:n="horizontal"}){let o=n==="vertical";return Be("div",{className:fr("dndev-relative dndev-overflow-hidden",e),role:"status","aria-label":"Loading content",children:Be(yr,{direction:o?"column":"row",align:o?void 0:"center",gap:i,children:Array.from({length:t*2}).map((l,d)=>Be("div",{className:"dndev-flex-shrink-0 dndev-animate-pulse",style:o?{height:"4rem",width:"100%",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}:{height:"4rem",width:r||"4rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}},d))})})}var ut=br;import{GAP_VARIANT as zr}from"@donotdev/components";import{jsx as Fe}from"react/jsx-runtime";var Pr=Er(()=>Promise.resolve().then(()=>(ft(),vt))),Ar=e=>{let{gap:t=zr.MEDIUM,direction:r="auto",...i}=e;return Fe(Mr,{fallback:Fe(ut,{itemCount:8,gap:t,direction:r==="up"||r==="down"?"vertical":"horizontal"}),children:Fe(Pr,{...i})})},ht=Ar;import{Eye as Ir}from"lucide-react";import{useState as Dr}from"react";import{PortalButton as Lr,cn as yt,Sheet as $r,Code as Hr,Stack as Gr}from"@donotdev/components";import{Fragment as qr,jsx as Re,jsxs as Wr}from"react/jsx-runtime";function Xr({data:e,sourceCode:t,language:r="tsx",title:i="Page Source",className:n}){let[o,l]=Dr(!1),d=t||e||"",v=u=>{};return Wr(qr,{children:[Re(Lr,{icon:Ir,onClick:()=>l(!0),className:yt("dndev-z-overlay",n),style:{position:"fixed",zIndex:"var(--z-overlay)",right:"var(--gap-sm)",bottom:"calc(var(--footer-height, 0px) + var(--gap-sm))"},tooltip:"Code Inspector","aria-label":"Code Inspector"}),Re($r,{open:o,onOpenChange:l,side:"bottom",className:yt("dndev-w-full",n),style:{width:"100%",height:"90%",maxHeight:"90dvh",borderRadius:"var(--radius-xl) var(--radius-xl) 0 0",display:"flex",flexDirection:"column",overflow:"hidden"},children:Re(Gr,{gap:"none",style:{flex:"1 1 auto",minHeight:0,overflow:"hidden"},children:Re(Hr,{language:r,showCopyButton:!0,onCopy:v,children:d})})})]})}var bt=Xr;import{memo as Or,useEffect as Br,useRef as Vr,useState as Fr}from"react";import{cn as Ye,Button as Yr,IconBox as _r,Separator as Ur,SEPARATOR_VARIANT as Kr,Text as Me,useIntersectionObserver as Qr,getVariantDataAttrs as Jr,surfaceVariants as Zr}from"@donotdev/components";import{jsx as E,jsxs as he}from"react/jsx-runtime";var wt={intersectionThreshold:.3,intersectionRootMargin:"0px 0px -20% 0px"},jr=Or(({icon:e})=>e?E(_r,{icon:e,ariaHidden:!0}):null),ea=({items:e,className:t,ariaLabel:r,variant:i,style:n})=>{let[o,l]=Fr(0),d=Vr(null),u=e.some(p=>p.customHeight)?Math.max(...e.map(p=>p.customHeight||0).filter(p=>p>0)):null,c={small:1,medium:2,large:3},s=e.reduce((p,h)=>{let x=h.estimatedHeight||"medium",y=c[x]||2,g=c[p]||2;return y>g?x:p},"medium");return E("div",{className:Ye("dndev-relative dndev-stacked-cards-container",t),ref:d,"aria-label":r,style:{"--e":o.toString()},children:e.map((p,h)=>E(ta,{item:p,index:h,entered:o,onEnter:()=>l(h),totalItems:e.length,cardProps:{variant:i,style:n},maxEstimatedHeight:s,maxCustomHeight:u},h))})},ta=({item:e,index:t,entered:r,onEnter:i,totalItems:n,cardProps:o,maxEstimatedHeight:l,maxCustomHeight:d})=>{let{ref:v,isIntersecting:u}=Qr({threshold:wt.intersectionThreshold,rootMargin:wt.intersectionRootMargin});Br(()=>{typeof window<"u"&&u&&i()},[u,i]);let c=Array.isArray(e.content)?e.content:e.content?[e.content]:[];return E("section",{ref:v,className:"dndev-relative",style:{zIndex:n-t-1},children:E("div",{className:Ye("dndev-relative dndev-overflow-hidden stack","dndev-min-w-0"),"data-size":d?void 0:l,"data-stacked":t>r?"true":"false",style:{"--i":t.toString(),...d&&{"--dynamic-height":`${d}px`},...o.style},children:he("div",{className:Ye(Zr({variant:o.variant}),"dndev-relative dndev-overflow-hidden dndev-h-full"),...Jr({variant:o.variant}),"data-role":"card","data-clickable":e.onClick?"true":void 0,onClick:e.onClick,style:{padding:"var(--gap-sm)",...o.style},children:[he("div",{className:"stack-content",children:[he("div",{className:"dndev-stacked-cards-body",children:[he("div",{className:"dndev-stacked-cards-left",children:[he("div",{className:"dndev-stacked-cards-header",children:[e.icon&&E(jr,{icon:e.icon}),e.title&&E(Me,{as:"h3",children:e.title})]}),e.subtitle&&E(Me,{as:"p",level:"h4",variant:"primary",children:e.subtitle}),e.description&&E(Me,{as:"p",level:"h4",variant:"muted",children:e.description})]}),E(Ur,{orientation:"vertical",variant:Kr.ACCENT,className:"dndev-stacked-cards-separator"}),c.length>0&&E("div",{className:"dndev-stacked-cards-right",children:c.map((s,p)=>E(Me,{as:"div",level:"body",variant:"muted",children:s},p))})]}),e.cta&&E("div",{className:"dndev-stacked-cards-cta",children:E(Yr,{onClick:e.onClick,variant:e.cta.variant||"primary",icon:e.cta.icon,children:e.cta.text})}),E("div",{className:"dndev-stacked-cards-spacer"})]}),E("div",{className:"dndev-stacked-cards-number",children:e.number?String(e.number):String(t+1).padStart(2,"0")})]})})})},Ct=ea;import{jsx as aa}from"react/jsx-runtime";var ra=function(t){return aa(Ct,{...t})},xt=ra;import{useCallback as na}from"react";import{cn as oa,useViewportVisibility as ia}from"@donotdev/components";import{jsx as kt}from"react/jsx-runtime";var sa=({items:e=[],direction:t="fade-in",stagger:r=100,threshold:i,distance:n,duration:o,once:l=!1,viewport:d=!0,overrides:v=[],className:u,children:c})=>{let{ref:s,isVisible:p,hasTriggered:h,visibleItems:x,isItemVisible:y}=ia({threshold:i,once:l,trackItems:d,enableScrollListener:d}),g=na(S=>{let N=v.find(q=>q.index===S);if(N)return N.direction;switch(t){case"alternate-h":return S%2===0?"left":"right";case"alternate-v":return S%2===0?"top":"bottom";default:return t}},[t,v]),C=()=>e.map((S,N)=>{let q=g(N),V=N*r,ee=d?y(N):p;return kt("div",{className:"dndev-reveal-item","data-direction":q,"data-visible":ee,style:{"--reveal-delay":`${V}ms`,"--reveal-index":N,...n!==void 0&&{"--reveal-distance":`${n}vw`},...o!==void 0&&{"--reveal-duration":`${o}ms`}},children:S},N)});return kt("div",{ref:s,className:oa("dndev-reveal-container",p&&"dndev-reveal-visible",u),"data-direction":t,"data-stagger":r,children:e.length>0?C():c})},ye=sa;import{jsx as _e,jsxs as da}from"react/jsx-runtime";function la({status:e,animationClass:t}){return _e("svg",{width:"100%",height:"100%",viewBox:"0 0 512 512",className:"drop--lg",preserveAspectRatio:"xMidYMid meet",children:da("g",{transform:"translate(0,512) scale(0.1,-0.1)",children:[_e("path",{d:`M2465 4956 c-60 -28 -97 -66 -124 -126 -20 -44 -21 -63 -21 -630 0
 -358 -4 -602 -11 -629 -21 -91 -84 -136 -207 -147 l-69 -7 -6 117 c-43 737
 -303 1125 -722 1075 -168 -21 -359 -165 -522 -394 -459 -646 -810 -1966 -779
 -2930 20 -639 129 -1031 311 -1121 50 -24 63 -26 126 -21 94 8 164 42 314 151
@@ -22,4 +22,4 @@ l-6 -117 -69 7 c-123 11 -186 56 -207 147 -7 27 -11 270 -11 629 l0 585 -24
 76 -3 126 21 182 90 291 482 311 1121 26 809 -217 1888 -584 2599 -104 200
 -174 311 -271 428 -230 277 -488 368 -725 255 -258 -123 -411 -480 -443 -1033
 l-6 -117 -69 7 c-123 11 -186 56 -207 147 -7 27 -11 270 -11 629 l0 585 -24
-50 c-59 125 -193 177 -311 121z`,fill:"currentColor",className:`${t||"breath-lung-442"} ${e==="complete"?"text-success":e==="active"?"text-primary active":e==="paused"?"text-primary active paused":"text-primary/40"}`})]})})}import{RotateCw as Jr}from"lucide-react";import{Button as kt,BUTTON_VARIANT as jr,Stack as ze}from"@donotdev/components";import{jsx as ae,jsxs as Ae}from"react/jsx-runtime";function Zr({status:e,animation:t,instructions:r,debug:o=!1,onSkip:i,statusValue:n,onRestart:c,isPaused:m=!1,isComplete:f=!1}){return Ae(ze,{direction:"column",align:"center",justify:"center",gap:"large",style:{width:"100%",height:"100%"},className:"dndev-relative",children:[o&&Ae(ze,{gap:"tight",className:"dndev-absolute",style:{top:"var(--gap-md)",insetInlineEnd:"var(--gap-md)",zIndex:20},children:[ae("div",{style:{fontSize:"var(--font-size-sm)",backgroundColor:"rgb(234 179 8)",color:"rgb(113 63 18)",borderRadius:"var(--radius)",padding:"var(--gap-sm) var(--gap-md)"},children:"\u{1F41B} Debug Mode"}),n&&Ae("div",{style:{fontSize:"var(--font-size-sm)",backgroundColor:"rgb(59 130 246)",color:"rgb(30 58 138)",borderRadius:"var(--radius)",padding:"var(--gap-sm) var(--gap-md)"},children:["Status: ",n]}),i&&ae(kt,{variant:jr.DESTRUCTIVE,onClick:i,children:"Skip \u2192"})]}),e&&ae(ze,{direction:"column",gap:"tight",align:"center",children:e}),Ae("div",{className:"dndev-relative dndev-flex dndev-items-center dndev-justify-center dndev-flex-shrink-0",style:{width:"min(400px, 35vh)",height:"min(400px, 35vh)",aspectRatio:"1 / 1"},children:[t,m&&ae("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-items-center dndev-justify-center dndev-z-breadcrumbs",style:{backgroundColor:"rgb(from var(--background) r g b / 0.5)",backdropFilter:"blur(8px)",borderRadius:"var(--radius-lg)"},children:ae("span",{style:{fontSize:"3.75rem"},children:"\u23F8\uFE0F"})}),f&&c&&ae(kt,{floating:!0,icon:Jr,onClick:c,"aria-label":"Do another cycle"})]}),ae(ze,{gap:"tight",align:"center",style:{textAlign:"center",maxWidth:"28rem"},children:r})]})}import{Suspense as va,lazy as fa}from"react";import{cn as ea,Stack as St}from"@donotdev/components";import{Fragment as ra,jsx as Z,jsxs as Nt}from"react/jsx-runtime";function ta({className:e,itemCount:t=1,showArrows:r=!0,showDots:o=!1,showProgress:i=!1}){return Nt("div",{className:ea("dndev-relative dndev-overflow-hidden",e),role:"status","aria-label":"Loading carousel",children:[Z("div",{className:"dndev-overflow-hidden",children:Z(St,{direction:"row",children:Array.from({length:t}).map((n,c)=>Z("div",{className:"dndev-w-full dndev-flex-shrink-0",children:Z("div",{className:"dndev-animate-pulse",style:{height:"16rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}})},c))})}),r&&Nt(ra,{children:[Z("div",{className:"dndev-absolute dndev-z-breadcrumbs dndev-animate-pulse",style:{left:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)"}}),Z("div",{className:"dndev-absolute dndev-z-breadcrumbs dndev-animate-pulse",style:{right:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)"}})]}),o&&Z(St,{direction:"row",gap:"tight",className:"dndev-absolute dndev-z-breadcrumbs",style:{bottom:"1rem",left:"50%",transform:"translateX(-50%)"},children:Array.from({length:t}).map((n,c)=>Z("div",{className:"dndev-animate-pulse",style:{width:"0.5rem",height:"0.5rem",backgroundColor:"var(--muted)",borderRadius:"9999px"}},c))}),i&&Z("div",{className:"dndev-absolute dndev-left-0 dndev-animate-pulse",style:{bottom:0,right:0,height:"0.25rem",backgroundColor:"var(--muted)"}})]})}var Tt=ta;import{jsx as je}from"react/jsx-runtime";var ha=fa(()=>Promise.resolve().then(()=>(Et(),Mt))),ya=e=>{let{showArrows:t=!0,showDots:r=!0,showProgress:o=!1}=e;return je(va,{fallback:je(Tt,{showArrows:t,showDots:r,showProgress:o}),children:je(ha,{...e})})},ba=ya;import{lazy as Ta,Suspense as Ra}from"react";import{Card as Ma,Grid as Ea}from"@donotdev/components";import{jsx as De}from"react/jsx-runtime";var Pa=Ta(()=>Promise.resolve().then(()=>(At(),zt)));function za({title:e,items:t,gridCols:r=2,className:o,ariaLabel:i}){return De(Ra,{fallback:De(Ea,{gap:"medium",cols:2,children:t.map((n,c)=>De(Ma,{title:"Loading..."},c))}),children:De(Pa,{title:e,items:t,gridCols:r,className:o,ariaLabel:i})})}var Aa=za;import{Card as Ia,Text as Da,Stack as La}from"@donotdev/components";import{jsx as et,jsxs as Ga}from"react/jsx-runtime";var $a=({text:e,icon:t="\u{1F389}",className:r})=>et(Ia,{className:r,style:{textAlign:"center"},children:Ga(La,{gap:"tight",style:{padding:"var(--gap-md)"},children:[t&&et("div",{style:{fontSize:"var(--font-size-2xl)"},children:t}),et(Da,{variant:"muted",children:e})]})}),Ha=$a;import{CheckCircle as Le}from"lucide-react";import{Dialog as Xa,Card as $e,Badge as qa,BADGE_VARIANT as Oa,Stack as F,Grid as Wa}from"@donotdev/components";import{jsx as b,jsxs as W}from"react/jsx-runtime";function Ba({open:e,onOpenChange:t,guide:r,icon:o}){let i=o;return b(Xa,{open:e,onOpenChange:t,title:W(F,{direction:"row",align:"center",gap:"medium",children:[i&&b(i,{className:"dndev-size-touch",style:{color:"var(--primary)"}}),b("div",{style:{fontSize:"var(--font-size-3xl)",fontWeight:700},children:r.title})]}),description:b("div",{style:{fontSize:"var(--font-size-lg)"},children:r.subtitle}),style:{maxWidth:"56rem",maxHeight:"90dvh",overflowY:"auto"},children:W(F,{gap:"large",children:[r.quickStart&&W($e,{title:W(F,{direction:"row",align:"center",gap:"medium",children:[b(Le,{className:"dndev-size-md",style:{color:"var(--secondary)"}}),r.quickStart.title]}),children:[b("div",{className:"dndev-surface",style:{backgroundColor:"var(--muted)",padding:"var(--gap-md)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)"},children:b("code",{style:{color:"var(--muted-foreground)",fontSize:"var(--font-size-sm)",fontFamily:"monospace"},children:r.quickStart.code})}),b("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)",marginTop:"var(--gap-sm)"},children:r.quickStart.description})]}),r.steps&&W(F,{gap:"medium",children:[b("h3",{style:{fontSize:"var(--font-size-xl)",fontWeight:600},children:"Step by Step Process"}),b(F,{gap:"medium",children:r.steps.map((n,c)=>{let m=n.icon;return b("div",{className:"dndev-relative",children:W($e,{style:{overflow:"visible"},children:[b("div",{className:"dndev-absolute",style:{top:"-0.75rem",left:"-0.75rem",zIndex:20},children:b("div",{className:"dndev-flex dndev-items-center dndev-justify-center",style:{backgroundColor:"var(--primary)",color:"var(--primary-foreground)",borderRadius:"9999px",fontSize:"var(--font-size-sm)",fontWeight:700,boxShadow:"var(--shadow-xl)",border:"2px solid var(--background)",width:"2rem",height:"2rem"},children:c+1})}),W("div",{children:[W(F,{direction:"row",align:"center",gap:"medium",style:{paddingTop:"var(--gap-lg)",marginBottom:"var(--gap-md)"},children:[b(m,{className:"dndev-size-md",style:{color:"var(--primary)"}}),b("div",{style:{fontSize:"var(--font-size-lg)",fontWeight:600},children:n.title})]}),W(F,{gap:"large",children:[b("p",{style:{color:"var(--muted-foreground)"},children:n.description}),n.code&&b("div",{className:"dndev-surface",style:{backgroundColor:"var(--muted)",padding:"var(--gap-md)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)"},children:b("code",{style:{color:"var(--muted-foreground)",fontSize:"var(--font-size-sm)",fontFamily:"monospace"},children:n.code})}),n.details&&b("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)"},children:n.details})]})]})]})},c)})})]}),r.features&&b($e,{title:W(F,{direction:"row",align:"center",gap:"medium",children:[b(Le,{className:"dndev-size-md",style:{color:"var(--secondary)"}}),"What You Get Out of the Box"]}),children:b(F,{gap:"medium",children:r.features.map((n,c)=>W(F,{direction:"row",align:"center",gap:"medium",style:{fontSize:"var(--font-size-sm)"},children:[b(Le,{className:"dndev-size-sm",style:{color:"var(--secondary)",flexShrink:0}}),b("span",{style:{color:"var(--muted-foreground)"},children:n})]},c))})}),r.templates&&b($e,{title:W(F,{direction:"row",align:"center",gap:"medium",children:[b(Le,{className:"dndev-size-md",style:{color:"var(--accent)"}}),"Available Templates"]}),children:b(Wa,{cols:3,gap:"medium",children:r.templates.map((n,c)=>W(F,{gap:"tight",children:[b(qa,{variant:Oa.OUTLINE,className:"dndev-justify-center",style:{width:"100%"},children:n.name}),b("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)"},children:n.description})]},c))})})]})})}import{Card as Va,Text as It,GAP_VARIANT as Fa,Grid as Dt}from"@donotdev/components";import{jsx as ce,jsxs as Lt}from"react/jsx-runtime";var Ya=({left:e,right:t,leftDirection:r="left",rightDirection:o="right",threshold:i,stagger:n=200,distance:c,duration:m,gap:f=Fa.LARGE,className:u,align:l="start",useStatCards:s=!1})=>{let p=()=>s&&Array.isArray(t)?ce(Dt,{cols:2,gap:"medium",children:t.map((S,w)=>ce(Va,{children:Lt("div",{style:{padding:"var(--gap-lg)"},children:[ce(It,{level:"h3",children:S.title}),ce(It,{as:"p",variant:"muted",children:S.description})]})},w))}):t,y={none:"dndev-gap-none",tight:"dndev-gap-sm",medium:"dndev-gap-md",large:"dndev-gap-lg"}[f];return Lt(Dt,{cols:2,gap:f,align:l,className:u,children:[ce(be,{direction:r,threshold:i,stagger:n,distance:c,duration:m,items:[e]}),ce(be,{direction:o,threshold:i,stagger:n,distance:c,duration:m,items:[p()]})]})},_a=Ya;import{Button as Ua,Input as Ka,cn as tt,Stack as Qa}from"@donotdev/components";import{jsx as $t,jsxs as Za}from"react/jsx-runtime";function Ja({input:e,button:t,className:r}){return Za(Qa,{align:"center",justify:"center",gap:"medium",className:tt("dndev-w-full",r),children:[$t(Ka,{value:e.value,onChange:o=>e.onChange(o.target.value),placeholder:e.placeholder,maxLength:e.maxLength,className:tt("dndev-w-full",e.className),style:{textAlign:"center"},"aria-label":e.label||"Input",autoComplete:"off",spellCheck:!1}),$t(Ua,{variant:t.variant||"primary",onClick:t.onClick,icon:t.icon,className:tt("dndev-w-full",t.className),style:{paddingInline:"2rem"},children:t.label})]})}var ja=Ja;import{Suspense as gn,lazy as vn}from"react";import{Fragment as en}from"react";import{cn as Ht,Stack as oe}from"@donotdev/components";import{jsx as E,jsxs as ee}from"react/jsx-runtime";function tn({stepCount:e=3,className:t,direction:r="horizontal"}){let o=Array.from({length:e},(i,n)=>n);return r==="vertical"?E("section",{className:Ht("dndev-w-full dndev-overflow-hidden",t),children:E("div",{className:"dndev-relative dndev-mx-auto",style:{maxWidth:"72rem",padding:"0 var(--content-padding)"},children:E("div",{className:"dndev-grid dndev-md:grid-cols-2 dndev-lg:grid-cols-3",style:{gap:"var(--gap-lg)"},children:o.map(i=>E("div",{style:{transform:i%3===1?"translateY(3rem)":i%3===2?"translateY(6rem)":void 0},children:ee("div",{style:{backgroundColor:"var(--background)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)",boxShadow:"var(--shadow-sm)",padding:"var(--gap-md)"},children:[ee(oe,{direction:"row",align:"start",gap:"medium",style:{marginBottom:"var(--gap-md)"},children:[E("div",{className:"dndev-animate-pulse",style:{width:"3rem",height:"3rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}}),ee(oe,{gap:"tight",flex:"1",className:"dndev-min-w-0",children:[E("div",{className:"dndev-animate-pulse",style:{height:"1.5rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"75%"}}),E("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}})]})]}),ee(oe,{gap:"tight",children:[E("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}}),E("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"66%"}})]})]})},i))})})}):E("section",{className:Ht("dndev-w-full",t),children:E("div",{className:"dndev-mx-auto dndev-flex dndev-flex-col dndev-md:flex-row dndev-md:items-center dndev-gap-md",style:{maxWidth:"80rem"},children:o.map(i=>{let n=i===e-1;return ee(en,{children:[E("div",{className:"dndev-flex-1",children:ee("div",{className:"dndev-h-full",style:{backgroundColor:"var(--background)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)",boxShadow:"var(--shadow-sm)",padding:"var(--gap-md)"},children:[ee(oe,{direction:"row",align:"start",gap:"medium",style:{marginBottom:"var(--gap-md)"},children:[E("div",{className:"dndev-animate-pulse",style:{width:"3rem",height:"3rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}}),ee(oe,{gap:"tight",flex:"1",className:"dndev-min-w-0",children:[E("div",{className:"dndev-animate-pulse",style:{height:"1.25rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"75%"}}),E("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}})]})]}),ee(oe,{gap:"tight",children:[E("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}}),E("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"66%"}})]})]})}),!n&&E(oe,{justify:"center",style:{paddingTop:"var(--gap-md)",paddingBottom:"var(--gap-md)"},children:E("div",{className:"dndev-animate-pulse",style:{width:"2rem",height:"1px",backgroundColor:"var(--muted)"}})})]},i)})})})}var Gt=tn;import{jsx as at}from"react/jsx-runtime";var fn=vn(()=>Promise.resolve().then(()=>(Wt(),Ot)));function hn(e){return at(gn,{fallback:at(Gt,{stepCount:e.items?.length||3,direction:e.direction==="descending"?"vertical":"horizontal"}),children:at(fn,{...e})})}var yn=hn;export{Zr as BreathingExerciseLayout,ba as Carousel,Aa as ComparisonGrid,Ha as CongratulationsCard,ct as Crawl,Ba as GuideModal,yt as InspectorGadget,Kr as LungsAnimation,ft as Marquee,be as Reveal,_a as SplitReveal,Ct as StackedCards,ja as StartChallengeForm,yn as Waterfall};
+50 c-59 125 -193 177 -311 121z`,fill:"currentColor",className:`${t||"breath-lung-442"} ${e==="complete"?"text-success":e==="active"?"text-primary active":e==="paused"?"text-primary active paused":"text-primary/40"}`})]})})}import{RotateCw as ca}from"lucide-react";import{Button as St,BUTTON_VARIANT as ma,Stack as Ee}from"@donotdev/components";import{jsx as re,jsxs as Pe}from"react/jsx-runtime";function ua({status:e,animation:t,instructions:r,debug:i=!1,onSkip:n,statusValue:o,onRestart:l,isPaused:d=!1,isComplete:v=!1}){return Pe(Ee,{direction:"column",align:"center",justify:"center",gap:"large",style:{width:"100%",height:"100%"},className:"dndev-relative",children:[i&&Pe(Ee,{gap:"tight",className:"dndev-absolute",style:{top:"var(--gap-md)",insetInlineEnd:"var(--gap-md)",zIndex:20},children:[re("div",{style:{fontSize:"var(--font-size-sm)",backgroundColor:"rgb(234 179 8)",color:"rgb(113 63 18)",borderRadius:"var(--radius)",padding:"var(--gap-sm) var(--gap-md)"},children:"\u{1F41B} Debug Mode"}),o&&Pe("div",{style:{fontSize:"var(--font-size-sm)",backgroundColor:"rgb(59 130 246)",color:"rgb(30 58 138)",borderRadius:"var(--radius)",padding:"var(--gap-sm) var(--gap-md)"},children:["Status: ",o]}),n&&re(St,{variant:ma.DESTRUCTIVE,onClick:n,children:"Skip \u2192"})]}),e&&re(Ee,{direction:"column",gap:"tight",align:"center",children:e}),Pe("div",{className:"dndev-relative dndev-flex dndev-items-center dndev-justify-center dndev-flex-shrink-0",style:{width:"min(400px, 35vh)",height:"min(400px, 35vh)",aspectRatio:"1 / 1"},children:[t,d&&re("div",{className:"dndev-absolute dndev-inset-0 dndev-flex dndev-items-center dndev-justify-center dndev-z-breadcrumbs",style:{backgroundColor:"rgb(from var(--background) r g b / 0.5)",backdropFilter:"blur(8px)",borderRadius:"var(--radius-lg)"},children:re("span",{style:{fontSize:"3.75rem"},children:"\u23F8\uFE0F"})}),v&&l&&re(St,{floating:!0,icon:ca,onClick:l,"aria-label":"Do another cycle"})]}),re(Ee,{gap:"tight",align:"center",style:{textAlign:"center",maxWidth:"28rem"},children:r})]})}import{Suspense as Ma,lazy as Ea}from"react";import{cn as pa,Stack as Nt}from"@donotdev/components";import{Fragment as va,jsx as K,jsxs as Tt}from"react/jsx-runtime";function ga({className:e,itemCount:t=1,showArrows:r=!0,showDots:i=!1,showProgress:n=!1}){return Tt("div",{className:pa("dndev-relative dndev-overflow-hidden",e),role:"status","aria-label":"Loading carousel",children:[K("div",{className:"dndev-overflow-hidden",children:K(Nt,{direction:"row",children:Array.from({length:t}).map((o,l)=>K("div",{className:"dndev-w-full dndev-flex-shrink-0",children:K("div",{className:"dndev-animate-pulse",style:{height:"16rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}})},l))})}),r&&Tt(va,{children:[K("div",{className:"dndev-absolute dndev-z-breadcrumbs dndev-animate-pulse",style:{left:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)"}}),K("div",{className:"dndev-absolute dndev-z-breadcrumbs dndev-animate-pulse",style:{right:"1rem",top:"50%",transform:"translateY(-50%)",width:"2.5rem",height:"2.5rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)"}})]}),i&&K(Nt,{direction:"row",gap:"tight",className:"dndev-absolute dndev-z-breadcrumbs",style:{bottom:"1rem",left:"50%",transform:"translateX(-50%)"},children:Array.from({length:t}).map((o,l)=>K("div",{className:"dndev-animate-pulse",style:{width:"0.5rem",height:"0.5rem",backgroundColor:"var(--muted)",borderRadius:"9999px"}},l))}),n&&K("div",{className:"dndev-absolute dndev-left-0 dndev-animate-pulse",style:{bottom:0,right:0,height:"0.25rem",backgroundColor:"var(--muted)"}})]})}var Rt=ga;import{jsx as Ze}from"react/jsx-runtime";var Pa=Ea(()=>Promise.resolve().then(()=>(Pt(),Et))),za=e=>{let{showArrows:t=!0,showDots:r=!0,showProgress:i=!1}=e;return Ze(Ma,{fallback:Ze(Rt,{showArrows:t,showDots:r,showProgress:i}),children:Ze(Pa,{...e})})},Aa=za;import{lazy as Xa,Suspense as qa}from"react";import{Card as Wa,Grid as Oa}from"@donotdev/components";import{jsx as Ae}from"react/jsx-runtime";var Ba=Xa(()=>Promise.resolve().then(()=>(It(),At)));function Va({title:e,items:t,gridCols:r=2,className:i,ariaLabel:n}){return Ae(qa,{fallback:Ae(Oa,{gap:"medium",cols:2,children:t.map((o,l)=>Ae(Wa,{title:"Loading..."},l))}),children:Ae(Ba,{title:e,items:t,gridCols:r,className:i,ariaLabel:n})})}var Fa=Va;import{Card as Ya,Text as _a,Stack as Ua}from"@donotdev/components";import{jsx as et,jsxs as Ja}from"react/jsx-runtime";var Ka=({text:e,icon:t="\u{1F389}",className:r})=>et(Ya,{className:r,style:{textAlign:"center"},children:Ja(Ua,{gap:"tight",style:{padding:"var(--gap-md)"},children:[t&&et("div",{style:{fontSize:"var(--font-size-2xl)"},children:t}),et(_a,{variant:"muted",children:e})]})}),Qa=Ka;import{CheckCircle as Ie}from"lucide-react";import{Dialog as Za,Card as De,Badge as ja,BADGE_VARIANT as en,Stack as X,Grid as tn}from"@donotdev/components";import{jsx as b,jsxs as L}from"react/jsx-runtime";function rn({open:e,onOpenChange:t,guide:r,icon:i}){let n=i;return b(Za,{open:e,onOpenChange:t,title:L(X,{direction:"row",align:"center",gap:"medium",children:[n&&b(n,{className:"dndev-size-touch",style:{color:"var(--primary)"}}),b("div",{style:{fontSize:"var(--font-size-3xl)",fontWeight:700},children:r.title})]}),description:b("div",{style:{fontSize:"var(--font-size-lg)"},children:r.subtitle}),style:{maxWidth:"56rem",maxHeight:"90dvh",overflowY:"auto"},children:L(X,{gap:"large",children:[r.quickStart&&L(De,{title:L(X,{direction:"row",align:"center",gap:"medium",children:[b(Ie,{className:"dndev-size-md",style:{color:"var(--secondary)"}}),r.quickStart.title]}),children:[b("div",{className:"dndev-surface",style:{backgroundColor:"var(--muted)",padding:"var(--gap-md)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)"},children:b("code",{style:{color:"var(--muted-foreground)",fontSize:"var(--font-size-sm)",fontFamily:"monospace"},children:r.quickStart.code})}),b("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)",marginTop:"var(--gap-sm)"},children:r.quickStart.description})]}),r.steps&&L(X,{gap:"medium",children:[b("h3",{style:{fontSize:"var(--font-size-xl)",fontWeight:600},children:"Step by Step Process"}),b(X,{gap:"medium",children:r.steps.map((o,l)=>{let d=o.icon;return b("div",{className:"dndev-relative",children:L(De,{style:{overflow:"visible"},children:[b("div",{className:"dndev-absolute",style:{top:"-0.75rem",left:"-0.75rem",zIndex:20},children:b("div",{className:"dndev-flex dndev-items-center dndev-justify-center",style:{backgroundColor:"var(--primary)",color:"var(--primary-foreground)",borderRadius:"9999px",fontSize:"var(--font-size-sm)",fontWeight:700,boxShadow:"var(--shadow-xl)",border:"2px solid var(--background)",width:"2rem",height:"2rem"},children:l+1})}),L("div",{children:[L(X,{direction:"row",align:"center",gap:"medium",style:{paddingTop:"var(--gap-lg)",marginBottom:"var(--gap-md)"},children:[b(d,{className:"dndev-size-md",style:{color:"var(--primary)"}}),b("div",{style:{fontSize:"var(--font-size-lg)",fontWeight:600},children:o.title})]}),L(X,{gap:"large",children:[b("p",{style:{color:"var(--muted-foreground)"},children:o.description}),o.code&&b("div",{className:"dndev-surface",style:{backgroundColor:"var(--muted)",padding:"var(--gap-md)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)"},children:b("code",{style:{color:"var(--muted-foreground)",fontSize:"var(--font-size-sm)",fontFamily:"monospace"},children:o.code})}),o.details&&b("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)"},children:o.details})]})]})]})},l)})})]}),r.features&&b(De,{title:L(X,{direction:"row",align:"center",gap:"medium",children:[b(Ie,{className:"dndev-size-md",style:{color:"var(--secondary)"}}),"What You Get Out of the Box"]}),children:b(X,{gap:"medium",children:r.features.map((o,l)=>L(X,{direction:"row",align:"center",gap:"medium",style:{fontSize:"var(--font-size-sm)"},children:[b(Ie,{className:"dndev-size-sm",style:{color:"var(--secondary)",flexShrink:0}}),b("span",{style:{color:"var(--muted-foreground)"},children:o})]},l))})}),r.templates&&b(De,{title:L(X,{direction:"row",align:"center",gap:"medium",children:[b(Ie,{className:"dndev-size-md",style:{color:"var(--accent)"}}),"Available Templates"]}),children:b(tn,{cols:3,gap:"medium",children:r.templates.map((o,l)=>L(X,{gap:"tight",children:[b(ja,{variant:en.OUTLINE,className:"dndev-justify-center",style:{width:"100%"},children:o.name}),b("p",{style:{fontSize:"var(--font-size-sm)",color:"var(--muted-foreground)"},children:o.description})]},l))})})]})})}import{Card as an,Text as Dt,GAP_VARIANT as nn,Grid as Lt}from"@donotdev/components";import{jsx as ce,jsxs as $t}from"react/jsx-runtime";var on=({left:e,right:t,leftDirection:r="left",rightDirection:i="right",threshold:n,stagger:o=200,distance:l,duration:d,gap:v=nn.LARGE,className:u,align:c="start",useStatCards:s=!1})=>{let p=()=>s&&Array.isArray(t)?ce(Lt,{cols:2,gap:"medium",children:t.map((x,y)=>ce(an,{children:$t("div",{style:{padding:"var(--gap-lg)"},children:[ce(Dt,{level:"h3",children:x.title}),ce(Dt,{as:"p",variant:"muted",children:x.description})]})},y))}):t,h={none:"dndev-gap-none",tight:"dndev-gap-sm",medium:"dndev-gap-md",large:"dndev-gap-lg"}[v];return $t(Lt,{cols:2,gap:v,align:c,className:u,children:[ce(ye,{direction:r,threshold:n,stagger:o,distance:l,duration:d,items:[e]}),ce(ye,{direction:i,threshold:n,stagger:o,distance:l,duration:d,items:[p()]})]})},sn=on;import{Button as ln,Input as dn,cn as tt,Stack as cn}from"@donotdev/components";import{jsx as Ht,jsxs as pn}from"react/jsx-runtime";function mn({input:e,button:t,className:r}){return pn(cn,{align:"center",justify:"center",gap:"medium",className:tt("dndev-w-full",r),children:[Ht(dn,{value:e.value,onChange:i=>e.onChange(i.target.value),placeholder:e.placeholder,maxLength:e.maxLength,className:tt("dndev-w-full",e.className),style:{textAlign:"center"},"aria-label":e.label||"Input",autoComplete:"off",spellCheck:!1}),Ht(ln,{variant:t.variant||"primary",onClick:t.onClick,icon:t.icon,className:tt("dndev-w-full",t.className),style:{paddingInline:"2rem"},children:t.label})]})}var un=mn;import{Suspense as Rn,lazy as Mn}from"react";import{Fragment as gn}from"react";import{cn as Gt,Stack as ne}from"@donotdev/components";import{jsx as T,jsxs as Q}from"react/jsx-runtime";function vn({stepCount:e=3,className:t,direction:r="horizontal"}){let i=Array.from({length:e},(n,o)=>o);return r==="vertical"?T("section",{className:Gt("dndev-w-full dndev-overflow-hidden",t),children:T("div",{className:"dndev-relative dndev-mx-auto",style:{maxWidth:"72rem",padding:"0 var(--content-padding)"},children:T("div",{className:"dndev-grid dndev-md:grid-cols-2 dndev-lg:grid-cols-3",style:{gap:"var(--gap-lg)"},children:i.map(n=>T("div",{style:{transform:n%3===1?"translateY(3rem)":n%3===2?"translateY(6rem)":void 0},children:Q("div",{style:{backgroundColor:"var(--background)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)",boxShadow:"var(--shadow-sm)",padding:"var(--gap-md)"},children:[Q(ne,{direction:"row",align:"start",gap:"medium",style:{marginBottom:"var(--gap-md)"},children:[T("div",{className:"dndev-animate-pulse",style:{width:"3rem",height:"3rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}}),Q(ne,{gap:"tight",flex:"1",className:"dndev-min-w-0",children:[T("div",{className:"dndev-animate-pulse",style:{height:"1.5rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"75%"}}),T("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}})]})]}),Q(ne,{gap:"tight",children:[T("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}}),T("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"66%"}})]})]})},n))})})}):T("section",{className:Gt("dndev-w-full",t),children:T("div",{className:"dndev-mx-auto dndev-flex dndev-flex-col dndev-md:flex-row dndev-md:items-center dndev-gap-md",style:{maxWidth:"80rem"},children:i.map(n=>{let o=n===e-1;return Q(gn,{children:[T("div",{className:"dndev-flex-1",children:Q("div",{className:"dndev-h-full",style:{backgroundColor:"var(--background)",borderRadius:"var(--radius-lg)",border:"1px solid var(--border)",boxShadow:"var(--shadow-sm)",padding:"var(--gap-md)"},children:[Q(ne,{direction:"row",align:"start",gap:"medium",style:{marginBottom:"var(--gap-md)"},children:[T("div",{className:"dndev-animate-pulse",style:{width:"3rem",height:"3rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius-lg)"}}),Q(ne,{gap:"tight",flex:"1",className:"dndev-min-w-0",children:[T("div",{className:"dndev-animate-pulse",style:{height:"1.25rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"75%"}}),T("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}})]})]}),Q(ne,{gap:"tight",children:[T("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"100%"}}),T("div",{className:"dndev-animate-pulse",style:{height:"1rem",backgroundColor:"var(--muted)",borderRadius:"var(--radius)",width:"66%"}})]})]})}),!o&&T(ne,{justify:"center",style:{paddingTop:"var(--gap-md)",paddingBottom:"var(--gap-md)"},children:T("div",{className:"dndev-animate-pulse",style:{width:"2rem",height:"1px",backgroundColor:"var(--muted)"}})})]},n)})})})}var Xt=vn;import{jsx as at}from"react/jsx-runtime";var En=Mn(()=>Promise.resolve().then(()=>(Bt(),Ot)));function Pn(e){return at(Rn,{fallback:at(Xt,{stepCount:e.items?.length||3,direction:e.direction==="descending"?"vertical":"horizontal"}),children:at(En,{...e})})}var zn=Pn;export{ua as BreathingExerciseLayout,Aa as Carousel,Fa as ComparisonGrid,Qa as CongratulationsCard,mt as Crawl,rn as GuideModal,bt as InspectorGadget,la as LungsAnimation,ht as Marquee,ye as Reveal,sn as SplitReveal,xt as StackedCards,un as StartChallengeForm,zn as Waterfall};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@donotdev/adv-comps",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "type": "module",
   "private": false,
   "license": "SEE LICENSE IN LICENSE.md",
@@ -51,7 +51,7 @@
   },
   "dependencies": {},
   "peerDependencies": {
-    "@donotdev/components": "0.0.2",
+    "@donotdev/components": "0.0.3",
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "shiki": "^3.20.0"