Print

` ); w.document.close(); }; const handleDelete = async () => { if (!onDeleteImage || !current?.id) return; try { await onDeleteImage(current.id); } catch { } }; const clamp2 = (v, min, max) => Math.min(max, Math.max(min, v)); const onWheel = (e) => { if (isSmall) return; e.preventDefault(); const delta = e.deltaY < 0 ? 0.1 : -0.1; const newScale = clamp2(scale2 + delta, 1, 4); setScale(newScale); }; const onPointerDown = (e) => { if (isSmall) return; if (!containerRef.current) return; containerRef.current.setPointerCapture?.(e.pointerId); pointers.current.set(e.pointerId, { x: e.clientX, y: e.clientY }); if (pointers.current.size === 2) { const [a, b] = Array.from(pointers.current.values()); const dx = b.x - a.x; const dy = b.y - a.y; pinch.current = { active: true, startDist: Math.hypot(dx, dy), startScale: scale2, cx: (a.x + b.x) / 2, cy: (a.y + b.y) / 2 }; } else if (pointers.current.size === 1) { setIsDragging(true); dragRef.current = { x: e.clientX - tx, y: e.clientY - ty }; } }; const onPointerMove = (e) => { if (isSmall) return; if (!pointers.current.has(e.pointerId)) return; pointers.current.set(e.pointerId, { x: e.clientX, y: e.clientY }); if (pinch.current.active && pointers.current.size === 2) { const [a, b] = Array.from(pointers.current.values()); const dx = b.x - a.x; const dy = b.y - a.y; const dist = Math.hypot(dx, dy); const factor = dist / (pinch.current.startDist || 1); const nextScale = clamp2(pinch.current.startScale * factor, 1, 4); setScale(nextScale); return; } if (isDragging2 && scale2 > 1) { const nx = e.clientX - dragRef.current.x; const ny = e.clientY - dragRef.current.y; setTx(nx); setTy(ny); } }; const onPointerUp = (e) => { if (isSmall) return; pointers.current.delete(e.pointerId); if (pointers.current.size < 2) { pinch.current.active = false; } if (pointers.current.size === 0) { setIsDragging(false); } }; const onDoubleClick = () => { if (isSmall) return; if (scale2 === 1) { setScale(2); } else { setScale(1); setTx(0); setTy(0); } }; const handleMobileScroll = () => { const el = scrollRef.current; if (!el) return; const h = el.clientHeight || window.innerHeight; const newIndex = Math.round(el.scrollTop / (h || 1)); const clamped = Math.max(0, Math.min(total - 1, newIndex)); if (clamped !== index) setIndex(clamped); if (el.scrollTop > 10 && showScrollHint) setShowScrollHint(false); }; const overlayRef = (0, import_react33.useRef)(null); useModalA11y(overlayRef, { onClose, dismissible: true }); if (!isOpen) return null; const content = /* @__PURE__ */ import_react33.default.createElement( "div", { ref: overlayRef, className: "fixed inset-0 z-[20000] flex items-center justify-center p-0 sm:p-4", role: "dialog", "aria-modal": "true", style: { backgroundColor: "var(--theme-backdrop-color)", backdropFilter: "blur(var(--theme-backdrop-blur))" } }, /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: onClose, "aria-label": "Close", className: "absolute top-3 right-3 sm:top-6 sm:right-6 p-2 rounded-full bg-white/80 hover:bg-white z-30 pointer-events-auto", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.X, { size: 22 }) ), total > 1 && /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: prev, "aria-label": "Previous", className: "hidden sm:block absolute left-2 sm:left-6 p-2 rounded-full bg-white/70 hover:bg-white z-20", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.ChevronLeft, { size: 24 }) ), /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: next, "aria-label": "Next", className: "hidden sm:block absolute right-2 sm:right-6 p-2 rounded-full bg-white/70 hover:bg-white z-20", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.ChevronRight, { size: 24 }) )), total > 1 && /* @__PURE__ */ import_react33.default.createElement( "div", { className: "absolute top-3 left-1/2 -translate-x-1/2 sm:top-6 px-3 py-1 rounded-full bg-white/70 text-xs font-semibold z-20", style: { color: "var(--theme-text-primary)" } }, index + 1, " / ", total ), (styleName || details?.color_hex || details?.notes || details?.length || details?.texture) && /* @__PURE__ */ import_react33.default.createElement( "div", { className: classNames( "absolute top-12 sm:top-16 left-1/2 -translate-x-1/2 z-20 px-3 py-2", silqueTile ), style: { maxWidth: "92vw" } }, /* @__PURE__ */ import_react33.default.createElement( "div", { className: "flex flex-wrap items-center gap-3 text-xs sm:text-sm", style: { color: "var(--theme-text-primary)" } }, styleName && /* @__PURE__ */ import_react33.default.createElement("div", null, /* @__PURE__ */ import_react33.default.createElement("span", { style: { color: "var(--theme-text-secondary)" } }, "Style:"), " ", /* @__PURE__ */ import_react33.default.createElement("span", { className: "font-medium" }, styleName)), details?.color_hex && /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react33.default.createElement("span", { style: { color: "var(--theme-text-secondary)" } }, "Color:"), /* @__PURE__ */ import_react33.default.createElement( "span", { className: "inline-block w-3 h-3 sm:w-4 sm:h-4 rounded-full border border-white/50", style: { backgroundColor: details.color_hex }, "aria-label": "Hair color swatch", title: details.color_hex } ), /* @__PURE__ */ import_react33.default.createElement("span", { className: "font-mono text-[10px] sm:text-xs opacity-80" }, details.color_hex)), details?.length && /* @__PURE__ */ import_react33.default.createElement("div", null, /* @__PURE__ */ import_react33.default.createElement("span", { style: { color: "var(--theme-text-secondary)" } }, "Length:"), " ", /* @__PURE__ */ import_react33.default.createElement("span", { className: "font-medium capitalize" }, details.length)), details?.texture && /* @__PURE__ */ import_react33.default.createElement("div", null, /* @__PURE__ */ import_react33.default.createElement("span", { style: { color: "var(--theme-text-secondary)" } }, "Texture:"), " ", /* @__PURE__ */ import_react33.default.createElement("span", { className: "font-medium capitalize" }, details.texture)) ), details?.notes && /* @__PURE__ */ import_react33.default.createElement( "div", { className: "mt-1 text-xs sm:text-sm whitespace-pre-wrap", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement( "div", { className: "mb-0.5", style: { color: "var(--theme-text-secondary)" } }, "Notes" ), details.notes ) ), !isSmall && /* @__PURE__ */ import_react33.default.createElement( "div", { ref: containerRef, className: classNames( "relative max-w-[96vw] max-h-[86vh] sm:max-h-[80vh] overflow-hidden touch-none select-none", silqueTile ), onWheel, onPointerDown, onPointerMove, onPointerUp, onPointerCancel: onPointerUp, onDoubleClick }, !loaded && /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute inset-0 grid place-items-center" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "animate-spin h-10 w-10 rounded-full border-2 border-white/70 border-t-transparent" })), current ? /* @__PURE__ */ import_react33.default.createElement( "img", { src: url, alt: clientName ? `Photo for ${clientName}` : "Client photo", onLoad: () => setLoaded(true), style: { transform: `translate(${tx}px, ${ty}px) scale(${scale2})`, transformOrigin: "center center" }, className: "block max-w-[96vw] max-h-[86vh] sm:max-h-[80vh] object-contain", draggable: false } ) : null ), isSmall && /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, /* @__PURE__ */ import_react33.default.createElement( "div", { ref: scrollRef, onScroll: handleMobileScroll, className: classNames( "absolute inset-0 overflow-y-auto snap-y snap-mandatory z-10", "scroll-smooth" ) }, images.map((img, i) => /* @__PURE__ */ import_react33.default.createElement( "div", { key: img.id || i, className: "min-h-[100vh] w-full flex items-center justify-center snap-start px-4" }, /* @__PURE__ */ import_react33.default.createElement( "img", { src: normalizeDisplayUrl(img.url), alt: clientName ? `Photo for ${clientName}` : "Client photo", className: "max-w-[96vw] max-h-[80vh] object-contain", draggable: false } ) )) ), total > 1 && index < total - 1 && showScrollHint && /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute bottom-20 left-1/2 -translate-x-1/2 z-20 pointer-events-none" }, /* @__PURE__ */ import_react33.default.createElement( "div", { className: "px-3 py-1.5 rounded-full bg-white/80 text-xs font-medium inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.ChevronUp, { size: 14 }), " Swipe up for more" ))), /* @__PURE__ */ import_react33.default.createElement( "div", { className: classNames( "absolute bottom-3 left-1/2 -translate-x-1/2 flex items-center gap-2 px-3 py-2 z-20", silqueTile ) }, /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: () => copyToClipboard(current?.url || url), className: "px-2 py-1.5 rounded-full bg-white/70 hover:bg-white text-sm inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.Copy, { size: 16 }), " Copy link" ), /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: handleDownload, className: "px-2 py-1.5 rounded-full bg-white/70 hover:bg-white text-sm inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.Download, { size: 16 }), " Download" ), /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: handleShare, className: "px-2 py-1.5 rounded-full bg-white/70 hover:bg-white text-sm inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.Share2, { size: 16 }), " Share" ), /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: handleEmail, className: "px-2 py-1.5 rounded-full bg-white/70 hover:bg-white text-sm inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.Mail, { size: 16 }), " Email" ), /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: handleSms, className: "px-2 py-1.5 rounded-full bg-white/70 hover:bg-white text-sm inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.MessageSquare, { size: 16 }), " Text" ), onDeleteImage && /* @__PURE__ */ import_react33.default.createElement( "button", { onClick: handleDelete, className: "px-2 py-1.5 rounded-full bg-red-50 hover:bg-red-100 text-sm inline-flex items-center gap-1", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react33.default.createElement(import_lucide_react15.Trash2, { size: 16 }), " Delete" ) ) ); return (0, import_react_dom4.createPortal)(content, document.body); } // virtual:/apps/web/src/components/ProactiveNila.jsx init_injected_globals(); var import_react35 = __toESM(require_react()); // virtual:/apps/web/src/hooks/useProactiveNila.js init_injected_globals(); var import_react34 = __toESM(require_react()); function generateSessionId() { return `session_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`; } function useProactiveNila(isNilaChatOpen = false) { const { data: user } = useUser_default(); const [proactiveState, setProactiveState] = (0, import_react34.useState)({ shouldShowProactive: false, proactiveMessage: null, proactiveType: null, triggerReason: null, lastCheckTime: null, sessionInsights: {}, confidence: 0, source: "unknown", timing: null }); const performanceModeRef = (0, import_react34.useRef)(false); (0, import_react34.useEffect)(() => { if (typeof window === "undefined") return; try { const nav = window.navigator; const connection = nav && nav.connection; const saveData = !!(connection && connection.saveData); const lowCores = !!(nav && nav.hardwareConcurrency && nav.hardwareConcurrency <= 4); if (saveData || lowCores) { performanceModeRef.current = true; console.log( "\u2699\uFE0F Nila performance mode enabled (save-data or low-core device)" ); } } catch (e) { console.error("Failed to detect performance mode for Nila", e); } }, []); const activityTimerRef = (0, import_react34.useRef)(null); const pageStartTimeRef = (0, import_react34.useRef)(Date.now()); const modalInteractionsRef = (0, import_react34.useRef)(0); const lastLocationRef = (0, import_react34.useRef)(""); const sessionIdRef = (0, import_react34.useRef)(generateSessionId()); const activityScoreRef = (0, import_react34.useRef)(0.5); const interactionTimeoutRef = (0, import_react34.useRef)(null); const lastInteractionRef = (0, import_react34.useRef)(Date.now()); const isActivelyWorkingRef = (0, import_react34.useRef)(false); const activeWorkTimeoutRef = (0, import_react34.useRef)(null); const behaviorPatternsRef = (0, import_react34.useRef)({ totalSessions: 0, aiStudioUsage: 0, clientsWithPhotos: 0, lastAIStudioUse: null, avgSessionLength: 0, preferredFeatures: [], stuckIndicators: 0, engagementScore: 0.5, dismissalRate: 0.3, optimalTiming: null, messagePreferences: {} }); const pageVisitCountRef = (0, import_react34.useRef)(0); const recentActionsRef = (0, import_react34.useRef)([]); const triggerCooldownsRef = (0, import_react34.useRef)({}); const canFireTrigger = (key, cooldownMs) => { const now2 = Date.now(); const last = triggerCooldownsRef.current[key] || 0; if (now2 - last < cooldownMs) return false; triggerCooldownsRef.current[key] = now2; return true; }; const [behaviorPatterns, setBehaviorPatterns] = (0, import_react34.useState)({ totalSessions: 0, aiStudioUsage: 0, clientsWithPhotos: 0, lastAIStudioUse: null, avgSessionLength: 0, preferredFeatures: [], stuckIndicators: 0, engagementScore: 0.5, dismissalRate: 0.3, optimalTiming: null, messagePreferences: {} }); (0, import_react34.useEffect)(() => { behaviorPatternsRef.current = behaviorPatterns; }, [behaviorPatterns]); const trackUserInteraction = async (action, messageType = null, additionalContext = {}) => { if (!user?.email || !messageType) return; try { const context = { currentPage: window.location.pathname, timeOnPage: Date.now() - pageStartTimeRef.current, modalInteractions: modalInteractionsRef.current, activityScore: activityScoreRef.current, sessionId: sessionIdRef.current, timestamp: Date.now(), ...additionalContext }; await fetch("/api/nila/track-interaction", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messageType, action, context }) }); if (action === "engaged") { activityScoreRef.current = Math.min( 1, activityScoreRef.current + 0.1 ); } else if (action === "dismissed") { activityScoreRef.current = Math.max( 0, activityScoreRef.current - 0.05 ); } } catch (error) { console.error("Failed to track user interaction:", error); } }; const hasUserBeenIdle = (minIdleTimeMs = 3e4) => { const timeSinceLastInteraction = Date.now() - lastInteractionRef.current; const isIdle = timeSinceLastInteraction >= minIdleTimeMs; const notActivelyWorking = !isActivelyWorkingRef.current; return isIdle && notActivelyWorking; }; const checkProactiveNeeds = async (context = {}) => { if (!user?.email) return; if (performanceModeRef.current && !context.allowInPerformanceMode) { console.log("\u{1F6AB} Nila performance mode - skipping proactive check"); return; } const timeSinceLastCheck = Date.now() - (proactiveState.lastCheckTime || 0); const cooldownMs = 6e4; if (timeSinceLastCheck < cooldownMs && !context.userInitiated) { console.log( `\u{1F6AB} Cooldown active - ${Math.round(timeSinceLastCheck / 1e3)}s since last check (need ${cooldownMs / 1e3}s)` ); return; } if (isActivelyWorkingRef.current) { console.log("\u{1F6AB} User is actively working - skipping proactive message"); return; } const minIdleTime = context.userInitiated ? 0 : 3e4; if (!hasUserBeenIdle(minIdleTime)) { console.log( `\u{1F6AB} User not idle long enough (need ${minIdleTime}ms) - skipping proactive message` ); return; } try { const enhancedContext = { currentPage: window.location.pathname, timeOnPage: Date.now() - pageStartTimeRef.current, modalInteractions: modalInteractionsRef.current, sessionId: sessionIdRef.current, sessionStartTime: pageStartTimeRef.current, activityScore: activityScoreRef.current, lastInteraction: lastInteractionRef.current, timeSinceLastInteraction: Date.now() - lastInteractionRef.current, // ✅ NEW isActivelyWorking: isActivelyWorkingRef.current, // ✅ NEW pageVisits: getPageVisitCount(), recentActions: getRecentActions(), ...context }; const response = await fetch("/api/nila/proactive-check", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ context: enhancedContext }) }); if (response.ok) { const data = await response.json(); if (data.shouldShow && data.message) { const delay2 = data.timing?.delaySeconds ? data.timing.delaySeconds * 1e3 : 6e4; setTimeout(() => { if (isActivelyWorkingRef.current) { console.log( "\u{1F6AB} User started working - canceling proactive message" ); return; } setProactiveState({ shouldShowProactive: true, proactiveMessage: data.message, proactiveType: data.type, triggerReason: data.reason, lastCheckTime: Date.now(), sessionInsights: data.insights || {}, confidence: data.confidence || 0.5, source: data.source || "ai-generated", timing: data.timing }); trackUserInteraction("shown", data.type, { confidence: data.confidence, source: data.source, delay: delay2, reason: data.reason }); }, delay2); } setBehaviorPatterns((prev) => ({ ...prev, ...data.patterns, engagementScore: data.insights?.engagement_score || prev.engagementScore })); } } catch (error) { console.error("Proactive check failed:", error); } }; const triggerEmptyStateHelp = (pageType, hasData) => { if (hasData) return; if (!canFireTrigger(`empty-state:${pageType}`, 10 * 60 * 1e3)) return; checkProactiveNeeds({ triggerType: "empty-state", pageType, userInitiated: true, hasData: false }); }; const triggerStuckUserHelp = (reason = "inactivity") => { if (!canFireTrigger(`stuck:${reason}`, 2 * 60 * 1e3)) return; modalInteractionsRef.current += 1; checkProactiveNeeds({ triggerType: "stuck-user", reason, userInitiated: false, modalInteractions: modalInteractionsRef.current }); }; const triggerSmartSuggestion = (insight) => { if (!canFireTrigger(`insight:${insight?.key || "generic"}`, 5 * 60 * 1e3)) return; checkProactiveNeeds({ triggerType: "smart-suggestion", insight, userInitiated: false, opportunity: insight }); }; const triggerFeatureDiscovery = (feature, context = {}) => { if (!canFireTrigger(`feature:${feature}`, 15 * 60 * 1e3)) return; checkProactiveNeeds({ triggerType: "feature-discovery", feature, userInitiated: false, discoveryContext: context }); }; const triggerErrorRecovery = (error, context = {}) => { if (!canFireTrigger(`error:${error?.code || "generic"}`, 2 * 60 * 1e3)) return; checkProactiveNeeds({ triggerType: "error-recovery", error, userInitiated: false, errorContext: context }); }; const triggerDailyInsight = (insights) => { if (!canFireTrigger("daily-insight", 60 * 60 * 1e3)) return; checkProactiveNeeds({ triggerType: "daily-insight", insights, userInitiated: false, dailyContext: insights }); }; const triggerSeasonalSuggestion = (season, context = {}) => { if (!canFireTrigger(`seasonal:${season}`, 30 * 60 * 1e3)) return; checkProactiveNeeds({ triggerType: "seasonal-suggestion", season, userInitiated: false, seasonalContext: context }); }; const trackActivity = () => { pageStartTimeRef.current = Date.now(); modalInteractionsRef.current = 0; lastInteractionRef.current = Date.now(); activityScoreRef.current = 0.5; isActivelyWorkingRef.current = false; if (activityTimerRef.current) { clearTimeout(activityTimerRef.current); } if (interactionTimeoutRef.current) { clearTimeout(interactionTimeoutRef.current); } if (activeWorkTimeoutRef.current) { clearTimeout(activeWorkTimeoutRef.current); } const stuckDetectionDelay = calculateStuckDetectionDelay(); activityTimerRef.current = setTimeout(() => { triggerStuckUserHelp("inactivity"); }, stuckDetectionDelay); }; const calculateStuckDetectionDelay = () => { const baseDelay = 45e3; const engagementScore = behaviorPatternsRef.current.engagementScore || 0.5; const dismissalRate = behaviorPatternsRef.current.dismissalRate || 0.3; let multiplier = 1; if (engagementScore > 0.7) multiplier *= 1.5; if (dismissalRate > 0.6) multiplier *= 3; if (dismissalRate > 0.8) multiplier *= 5; return Math.min(3e5, baseDelay * multiplier); }; const trackModalInteraction = () => { modalInteractionsRef.current += 1; lastInteractionRef.current = Date.now(); activityScoreRef.current = Math.min(1, activityScoreRef.current + 0.05); if (modalInteractionsRef.current >= 3) { triggerStuckUserHelp("modal_confusion"); } }; const handleProactiveAction = async (action) => { const { proactiveType } = proactiveState; await trackUserInteraction("engaged", proactiveType, { action: action.action, actionText: action.text, actionUrl: action.url || action.target }); switch (action.action) { case "navigate": if (typeof window !== "undefined") { window.location.href = action.url; } break; case "modal": window.dispatchEvent( new CustomEvent("open-modal", { detail: action.target }) ); break; case "trigger": window.dispatchEvent( new CustomEvent("trigger-action", { detail: action.target }) ); break; case "help": window.dispatchEvent( new CustomEvent("show-help", { detail: action.target }) ); break; case "external": if (action.url !== "#" && typeof window !== "undefined") { window.open(action.url, "_blank"); } break; case "retry": window.dispatchEvent(new CustomEvent("retry-action")); break; case "continue": break; default: break; } if (action.priority) { setTimeout(() => { trackUserInteraction("converted", proactiveType, { action: action.action, timeToConversion: 2e3 // 2 seconds for immediate action }); }, 2e3); } dismissProactive(); }; const dismissProactive = async () => { const { proactiveType } = proactiveState; if (proactiveType) { await trackUserInteraction("dismissed", proactiveType, { dismissalTime: Date.now() - (proactiveState.lastCheckTime || Date.now()), confidence: proactiveState.confidence }); } setProactiveState((prev) => ({ ...prev, shouldShowProactive: false, proactiveMessage: null, proactiveActions: null })); }; const getPageVisitCount = () => { pageVisitCountRef.current += 1; return pageVisitCountRef.current; }; const getRecentActions = () => { return recentActionsRef.current.slice(-10); }; const addRecentAction = (action) => { recentActionsRef.current.push({ action, timestamp: Date.now() }); if (recentActionsRef.current.length > 20) { recentActionsRef.current.splice(0, recentActionsRef.current.length - 20); } }; (0, import_react34.useEffect)(() => { const currentLocation = window.location.pathname; if (currentLocation !== lastLocationRef.current) { lastLocationRef.current = currentLocation; addRecentAction(`navigate_${currentLocation}`); trackActivity(); if (performanceModeRef.current) { return; } setTimeout(() => { if (hasUserBeenIdle(2e4)) { checkProactiveNeeds({ pageChange: true, newPage: currentLocation }); } }, 2e4); } }, []); (0, import_react34.useEffect)(() => { if (!isNilaChatOpen) { console.log("\u{1F6AB} Nila chat closed - no activity tracking"); return; } trackActivity(); let lastTypingUpdateAt = 0; const typingThrottleMs = 250; const updateActivity = (eventType, target = null) => { const now2 = Date.now(); const isHighFrequency = eventType === "keypress" || eventType === "input" || eventType === "change"; if (isHighFrequency) { if (now2 - lastTypingUpdateAt < typingThrottleMs) { return; } lastTypingUpdateAt = now2; } lastInteractionRef.current = now2; const activeEl = typeof document !== "undefined" ? document.activeElement : null; const el = target || activeEl; const tag = el?.tagName; const isFormInteraction = !!el && (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT" || el.isContentEditable); if (isFormInteraction || eventType === "input" || eventType === "change") { isActivelyWorkingRef.current = true; if (activeWorkTimeoutRef.current) { clearTimeout(activeWorkTimeoutRef.current); } activeWorkTimeoutRef.current = setTimeout(() => { isActivelyWorkingRef.current = false; }, 5e3); } if (eventType === "click") { activityScoreRef.current = Math.min( 1, activityScoreRef.current + 0.02 ); addRecentAction("click"); } else if (eventType === "keypress" || eventType === "input") { activityScoreRef.current = Math.min( 1, activityScoreRef.current + 0.01 ); addRecentAction("type"); } if (activityTimerRef.current) { clearTimeout(activityTimerRef.current); const delay2 = calculateStuckDetectionDelay(); activityTimerRef.current = setTimeout(() => { triggerStuckUserHelp("inactivity"); }, delay2); } }; const handleClick = (e) => updateActivity("click", e.target); const handleKeypress = (e) => updateActivity("keypress", e.target); const handleInput = (e) => updateActivity("input", e.target); const handleChange = (e) => updateActivity("change", e.target); const events = [ ["click", handleClick], ["keypress", handleKeypress], ["input", handleInput], ["change", handleChange] ]; console.log("\u2705 Nila chat open - activity tracking enabled (optimized)"); events.forEach(([event, handler]) => { document.addEventListener(event, handler, { passive: true }); }); return () => { console.log("\u{1F534} Nila chat closed - cleaning up activity tracking"); if (activityTimerRef.current) { clearTimeout(activityTimerRef.current); } if (interactionTimeoutRef.current) { clearTimeout(interactionTimeoutRef.current); } if (activeWorkTimeoutRef.current) { clearTimeout(activeWorkTimeoutRef.current); } events.forEach(([event, handler]) => { document.removeEventListener(event, handler); }); }; }, [isNilaChatOpen]); return { ...proactiveState, behaviorPatterns, // Enhanced trigger functions triggerEmptyStateHelp, triggerStuckUserHelp, triggerSmartSuggestion, triggerFeatureDiscovery, triggerErrorRecovery, triggerDailyInsight, triggerSeasonalSuggestion, // Activity tracking trackModalInteraction, // Action handlers handleProactiveAction, dismissProactive, // Manual triggers checkProactiveNeeds, // Utilities trackUserInteraction, sessionId: sessionIdRef.current, activityScore: activityScoreRef.current, // AI insights isAIEnhanced: true, lastInteraction: lastInteractionRef.current, isActivelyWorking: isActivelyWorkingRef.current, hasUserBeenIdle }; } // virtual:/apps/web/src/components/ProactiveNila.jsx var NILA_PROACTIVE_EVENT = "nila:proactive"; function ProactiveNila({ isNilaChatOpen = false }) { const { shouldShowProactive, proactiveMessage, proactiveActions, proactiveType, triggerReason, sessionInsights, confidence, source, handleProactiveAction, dismissProactive, trackUserInteraction, // ✅ expose trigger methods for the event bridge triggerEmptyStateHelp, triggerFeatureDiscovery, triggerErrorRecovery, trackModalInteraction, triggerSmartSuggestion, triggerSeasonalSuggestion } = useProactiveNila(isNilaChatOpen); const [isVisible, setIsVisible] = (0, import_react35.useState)(false); const [isAnimatingIn, setIsAnimatingIn] = (0, import_react35.useState)(false); const [isMinimized, setIsMinimized] = (0, import_react35.useState)(false); const [hasBeenSeen, setHasBeenSeen] = (0, import_react35.useState)(false); const [showTime, setShowTime] = (0, import_react35.useState)(Date.now()); const [position, setPosition] = (0, import_react35.useState)("bottom-right"); const [isMobile, setIsMobile] = (0, import_react35.useState)(false); const cardRef = (0, import_react35.useRef)(null); const intersectionRef = (0, import_react35.useRef)(null); const viewTimeRef = (0, import_react35.useRef)(0); (0, import_react35.useEffect)(() => { if (typeof window !== "undefined") { setIsMobile(window.innerWidth < 768); const handleResize = () => { setIsMobile(window.innerWidth < 768); }; window.addEventListener("resize", handleResize); return () => window.removeEventListener("resize", handleResize); } }, []); (0, import_react35.useEffect)(() => { if (typeof window === "undefined") return; const handler = (event) => { try { const detail = event?.detail || {}; const type = detail.type; if (type === "empty-state") { triggerEmptyStateHelp(detail.pageType, detail.hasData ?? false); return; } if (type === "feature") { triggerFeatureDiscovery(detail.feature, detail.context || {}); return; } if (type === "error") { triggerErrorRecovery(detail.error, detail.context || {}); return; } if (type === "modal") { trackModalInteraction(); return; } if (type === "insight") { triggerSmartSuggestion(detail.insight); return; } if (type === "seasonal") { triggerSeasonalSuggestion(detail.season, detail.context || {}); } } catch (e) { console.error("Failed to handle Nila proactive event", e); } }; window.addEventListener(NILA_PROACTIVE_EVENT, handler); return () => window.removeEventListener(NILA_PROACTIVE_EVENT, handler); }, [ triggerEmptyStateHelp, triggerFeatureDiscovery, triggerErrorRecovery, trackModalInteraction, triggerSmartSuggestion, triggerSeasonalSuggestion ]); (0, import_react35.useEffect)(() => { if (shouldShowProactive && proactiveMessage) { setShowTime(Date.now()); if (typeof window === "undefined") return; const optimalPosition = determineOptimalPosition( proactiveMessage, window.innerWidth ); setPosition(optimalPosition); const timer = setTimeout(() => { setIsVisible(true); setIsAnimatingIn(true); setTimeout(() => { trackUserInteraction("shown", proactiveType, { confidence, source, position: optimalPosition }); }, 500); }, 300); return () => clearTimeout(timer); } else { setIsVisible(false); setIsAnimatingIn(false); setIsMinimized(false); } }, [ shouldShowProactive, proactiveMessage, proactiveType, confidence, source, trackUserInteraction ]); (0, import_react35.useEffect)(() => { if (!cardRef.current || !isVisible) return; if (typeof IntersectionObserver === "undefined") return; const observer = new IntersectionObserver( ([entry]) => { if (entry.isIntersecting && !hasBeenSeen) { setHasBeenSeen(true); viewTimeRef.current = Date.now(); trackUserInteraction("viewed", proactiveType, { timeToView: Date.now() - showTime, confidence }); } }, { threshold: 0.5 } ); observer.observe(cardRef.current); intersectionRef.current = observer; return () => observer.disconnect(); }, [ isVisible, hasBeenSeen, proactiveType, confidence, showTime, trackUserInteraction ]); const handleDismiss = async () => { const viewDuration = hasBeenSeen ? Date.now() - viewTimeRef.current : 0; await trackUserInteraction("dismissed", proactiveType, { viewDuration, wasMinimized: isMinimized, confidence, dismissReason: "manual" }); setIsVisible(false); setTimeout(() => { dismissProactive(); }, 300); }; const handleAction = async (action) => { const viewDuration = hasBeenSeen ? Date.now() - viewTimeRef.current : 0; await trackUserInteraction("engaged", proactiveType, { action: action.action, actionText: action.text, viewDuration, confidence, actionPriority: action.priority }); handleProactiveAction(action); }; const toggleMinimize = () => { setIsMinimized(!isMinimized); trackUserInteraction(isMinimized ? "expanded" : "minimized", proactiveType); }; if (!shouldShowProactive || !proactiveMessage || !isVisible) { return null; } const messageData = typeof proactiveMessage === "object" ? proactiveMessage : { content: proactiveMessage, actions: proactiveActions || [] }; const isAIStudioFocused = proactiveType?.includes("ai-studio") || proactiveType?.includes("revenue") || triggerReason?.includes("ai"); const isHighConfidence = confidence && confidence > 0.8; const positionClasses = getPositionClasses(position, isMobile); return /* @__PURE__ */ import_react35.default.createElement( "div", { className: ` fixed z-50 transition-all duration-500 ease-out ${positionClasses} ${isAnimatingIn ? "opacity-100 translate-y-0 scale-100" : "opacity-0 translate-y-4 scale-95"} `, role: "dialog", "aria-modal": "false", "aria-label": "Nila proactive assistance", "aria-live": "polite" }, /* @__PURE__ */ import_react35.default.createElement( "div", { ref: cardRef, className: ` relative backdrop-blur-xl border shadow-2xl space-y-4 transition-all duration-300 ease-out ${isMinimized ? "rounded-full p-4 max-w-none w-auto" : "rounded-3xl p-6 max-w-md"} ${isMobile && !isMinimized ? "mx-4 max-w-[calc(100vw-2rem)]" : ""} ${isAIStudioFocused && isHighConfidence ? "bg-gradient-to-br from-blue-50/95 via-purple-50/95 to-pink-50/95 border-blue-200/50 dark:from-blue-900/95 dark:via-purple-900/95 dark:to-pink-900/95 dark:border-blue-400/50 shadow-blue-500/25" : isAIStudioFocused ? "bg-gradient-to-br from-blue-50/90 via-blue-50/90 to-indigo-50/90 border-blue-200/40 dark:from-blue-900/90 dark:to-indigo-900/90 dark:border-blue-400/40" : "bg-white/95 dark:bg-gray-800/95 border-gray-200/50 dark:border-gray-600/50"} ${isMinimized ? "cursor-pointer hover:scale-105" : ""} transform hover:shadow-2xl `, onClick: isMinimized ? toggleMinimize : void 0 }, isMinimized ? /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center space-x-2" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-8 h-8 rounded-full flex items-center justify-center overflow-hidden" }, /* @__PURE__ */ import_react35.default.createElement( "img", { src: "https://ucarecdn.com/17bf8baa-488f-4f81-941c-bb611391c8bd/", alt: "Nila", className: "w-8 h-8 object-contain" } )), isAIStudioFocused && /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-2 h-2 bg-blue-500 rounded-full animate-pulse" })) : /* @__PURE__ */ import_react35.default.createElement(import_react35.default.Fragment, null, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-start justify-between" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center space-x-3" }, /* @__PURE__ */ import_react35.default.createElement( "div", { className: ` w-10 h-10 rounded-full flex items-center justify-center overflow-hidden transition-all duration-300 ${isAIStudioFocused ? "shadow-lg shadow-blue-500/30" : ""} ${isHighConfidence ? "ring-2 ring-blue-400/50 ring-offset-2 ring-offset-white dark:ring-offset-gray-800" : ""} ` }, /* @__PURE__ */ import_react35.default.createElement( "img", { src: "https://ucarecdn.com/17bf8baa-488f-4f81-941c-bb611391c8bd/", alt: "Nila AI Assistant", className: "w-10 h-10 object-contain" } ) ), /* @__PURE__ */ import_react35.default.createElement("div", null, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center space-x-2" }, /* @__PURE__ */ import_react35.default.createElement( "div", { className: `font-semibold text-sm ${isAIStudioFocused ? "text-blue-700 dark:text-blue-300" : "text-gray-900 dark:text-gray-100"}` }, "Nila" ), confidence && confidence > 0.7 && /* @__PURE__ */ import_react35.default.createElement( "div", { className: `flex items-center space-x-1 px-2 py-0.5 text-xs rounded-full ${isHighConfidence ? "bg-green-100 text-green-700 dark:bg-green-800 dark:text-green-300" : "bg-blue-100 text-blue-700 dark:bg-blue-800 dark:text-blue-300"}` }, /* @__PURE__ */ import_react35.default.createElement( "div", { className: `w-1.5 h-1.5 rounded-full ${isHighConfidence ? "bg-green-500" : "bg-blue-500"} animate-pulse` } ), /* @__PURE__ */ import_react35.default.createElement("span", null, isHighConfidence ? "High Priority" : "AI Recommended") ), isAIStudioFocused && sessionInsights?.potential_monthly_revenue > 100 && /* @__PURE__ */ import_react35.default.createElement("span", { className: "px-2 py-0.5 text-xs rounded-full bg-gradient-to-r from-green-100 to-blue-100 text-green-700 dark:from-green-800 dark:to-blue-800 dark:text-green-300" }, "\u{1F4B0} $", sessionInsights.potential_monthly_revenue, "/mo opportunity")), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center space-x-2 text-xs text-gray-500 dark:text-gray-400" }, /* @__PURE__ */ import_react35.default.createElement("span", null, "Your AI Assistant"), source && /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-xs opacity-60" }, "\u2022", " ", source === "ai-generated" ? "AI Personalized" : "Smart Template")))), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center space-x-1" }, /* @__PURE__ */ import_react35.default.createElement( "button", { onClick: toggleMinimize, className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700", "aria-label": "Minimize" }, /* @__PURE__ */ import_react35.default.createElement( "svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20" }, /* @__PURE__ */ import_react35.default.createElement( "path", { fillRule: "evenodd", d: "M3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z", clipRule: "evenodd" } ) ) ), /* @__PURE__ */ import_react35.default.createElement( "button", { onClick: handleDismiss, className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700", "aria-label": "Dismiss" }, /* @__PURE__ */ import_react35.default.createElement( "svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20" }, /* @__PURE__ */ import_react35.default.createElement( "path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" } ) ) ))), messageData.title && /* @__PURE__ */ import_react35.default.createElement( "div", { className: `font-semibold text-lg leading-tight transition-all duration-300 ${isAIStudioFocused && isHighConfidence ? "text-gray-900 dark:text-gray-100" : "text-gray-900 dark:text-gray-100"}` }, renderMessageText(messageData.title) ), /* @__PURE__ */ import_react35.default.createElement( "div", { className: `text-sm leading-relaxed whitespace-pre-line transition-all duration-300 ${isAIStudioFocused ? "text-gray-800 dark:text-gray-200" : "text-gray-700 dark:text-gray-300"}` }, renderMessageText(messageData.content) ), messageData.actions && messageData.actions.length > 0 && /* @__PURE__ */ import_react35.default.createElement( "div", { className: `flex ${isMobile ? "flex-col" : "flex-wrap"} gap-2` }, messageData.actions.map((action, index) => /* @__PURE__ */ import_react35.default.createElement( "button", { key: index, onClick: () => handleAction(action), className: ` px-4 py-2.5 rounded-full text-sm font-semibold transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 ${isMobile ? "w-full" : "flex-1 min-w-[120px]"} ${action.priority && isAIStudioFocused ? "bg-gradient-to-r from-blue-600 to-purple-600 text-white hover:from-blue-700 hover:to-purple-700 shadow-lg shadow-blue-500/25 focus-visible:ring-blue-500 transform hover:scale-[1.02] active:scale-[0.98]" : action.priority ? "bg-blue-600 text-white hover:bg-blue-700 focus-visible:ring-blue-500 transform hover:scale-[1.01] active:scale-[0.99]" : isAIStudioFocused ? "bg-white/80 text-blue-700 border border-blue-200 hover:bg-white hover:border-blue-300 focus-visible:ring-blue-500 dark:bg-gray-800/80 dark:text-blue-300 dark:border-blue-600 dark:hover:bg-gray-700" : "bg-gray-100 text-gray-700 border border-gray-200 hover:bg-gray-200 focus-visible:ring-gray-500 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600 dark:hover:bg-gray-600"} ` }, action.text )) ), isAIStudioFocused && /* @__PURE__ */ import_react35.default.createElement("div", { className: "mt-4 pt-4 border-t border-blue-200/30 dark:border-blue-600/30" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center justify-between text-xs" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center space-x-2 text-blue-600 dark:text-blue-400" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "w-2 h-2 bg-blue-500 rounded-full animate-pulse" }), /* @__PURE__ */ import_react35.default.createElement("span", null, "AI-powered recommendation"), /* @__PURE__ */ import_react35.default.createElement( "span", { className: "w-2 h-2 bg-purple-500 rounded-full animate-pulse", style: { animationDelay: "0.5s" } } )), confidence && /* @__PURE__ */ import_react35.default.createElement("div", { className: "text-gray-500 dark:text-gray-400" }, Math.round(confidence * 100), "% confidence")))), isAIStudioFocused && isHighConfidence && !isMinimized && /* @__PURE__ */ import_react35.default.createElement(import_react35.default.Fragment, null, /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute -inset-1 bg-gradient-to-r from-blue-500/30 to-purple-500/30 rounded-3xl blur-xl -z-10 animate-pulse" }), /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute -inset-0.5 bg-gradient-to-r from-blue-500/40 to-purple-500/40 rounded-3xl -z-10" })), !hasBeenSeen && !isMinimized && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute -inset-0.5 rounded-3xl border-2 border-blue-400/50 animate-ping -z-20" }) ) ); } function determineOptimalPosition(message2, screenWidth) { const isMobile = screenWidth < 768; if (isMobile) return "bottom-center"; const messageText = typeof message2 === "object" ? (message2.title + " " + message2.content).toLowerCase() : message2.toLowerCase(); if (messageText.includes("calendar") || messageText.includes("appointment")) { return "bottom-right"; } if (messageText.includes("client") || messageText.includes("portfolio")) { return "bottom-left"; } return "bottom-right"; } function getPositionClasses(position, isMobile) { if (isMobile) { return "bottom-4 left-4 right-4"; } const baseClasses = "bottom-4"; switch (position) { case "bottom-left": return `${baseClasses} left-4`; case "bottom-center": return `${baseClasses} left-1/2 transform -translate-x-1/2`; case "bottom-right": default: return `${baseClasses} right-4`; } } function renderMessageText(text) { if (!text) return null; const lines = text.split("\n"); return lines.map((line, lineIndex) => { if (!line.trim()) return /* @__PURE__ */ import_react35.default.createElement("br", { key: lineIndex }); const parts = line.split(/(\*\*.*?\*\*)/g); return /* @__PURE__ */ import_react35.default.createElement("span", { key: lineIndex }, parts.map((part, partIndex) => { if (part.startsWith("**") && part.endsWith("**")) { return /* @__PURE__ */ import_react35.default.createElement("strong", { key: partIndex, className: "font-semibold" }, part.slice(2, -2)); } return part; }), lineIndex < lines.length - 1 && /* @__PURE__ */ import_react35.default.createElement("br", null)); }); } function useProactiveNilaTriggers() { const lastEmptyStateRef = import_react35.default.useRef(0); const lastInsightRef = import_react35.default.useRef(0); const lastErrorRef = import_react35.default.useRef(0); const lastSeasonalRef = import_react35.default.useRef(0); const EMPTY_STATE_COOLDOWN_MS = 10 * 60 * 1e3; const INSIGHT_COOLDOWN_MS = 5 * 60 * 1e3; const ERROR_COOLDOWN_MS = 2 * 60 * 1e3; const SEASONAL_COOLDOWN_MS = 30 * 60 * 1e3; const emit = (detail) => { try { if (typeof window === "undefined") return; window.dispatchEvent(new CustomEvent(NILA_PROACTIVE_EVENT, { detail })); } catch (e) { console.error("Failed to dispatch Nila proactive event", e); } }; return import_react35.default.useMemo( () => ({ // Trigger empty state help when pages load with no data onEmptyState: (pageType) => { const now2 = Date.now(); if (now2 - lastEmptyStateRef.current < EMPTY_STATE_COOLDOWN_MS) { return; } lastEmptyStateRef.current = now2; setTimeout(() => { emit({ type: "empty-state", pageType, hasData: false }); }, 3e3); }, // Trigger feature discovery when users interact with certain features onFeatureInteraction: (feature, context) => { emit({ type: "feature", feature, context: context || {} }); }, // Trigger error recovery when API calls fail onError: (error, context) => { const now2 = Date.now(); if (now2 - lastErrorRef.current < ERROR_COOLDOWN_MS) { return; } lastErrorRef.current = now2; emit({ type: "error", error, context: context || {} }); }, // Track modal interactions for stuck user detection onModalInteraction: () => { emit({ type: "modal" }); }, // Trigger smart suggestions based on data insights onInsight: (insight) => { const now2 = Date.now(); if (now2 - lastInsightRef.current < INSIGHT_COOLDOWN_MS) { return; } lastInsightRef.current = now2; emit({ type: "insight", insight }); }, // Trigger seasonal suggestions onSeasonalOpportunity: (season, context) => { const now2 = Date.now(); if (now2 - lastSeasonalRef.current < SEASONAL_COOLDOWN_MS) { return; } lastSeasonalRef.current = now2; emit({ type: "seasonal", season, context: context || {} }); } }), [] ); } // virtual:/apps/web/src/components/clients/EditClientModal.jsx var ALL_TABS = [ { key: "profile", label: "Profile" }, { key: "messages", label: "Messages" }, { key: "formulas", label: "Formulas" }, { key: "appointments", label: "Appointments" }, { key: "orders", label: "Orders" } ]; function EditClientModal({ client, onClose, clientMode = false, initialTab = null }) { const allowedTabs = clientMode ? ALL_TABS.filter((t) => t.key !== "formulas") : ALL_TABS; const defaultTab = initialTab && allowedTabs.find((t) => t.key === initialTab) ? initialTab : allowedTabs[0]?.key || "profile"; const [activeTab, setActiveTab] = (0, import_react36.useState)(defaultTab); const [profileUrl, setProfileUrl] = (0, import_react36.useState)(client.profile_image_url || ""); const [saveSignal, setSaveSignal] = (0, import_react36.useState)(0); const details = useClientDetails(client); const [lightboxOpen, setLightboxOpen] = (0, import_react36.useState)(false); const [lightboxIndex, setLightboxIndex] = (0, import_react36.useState)(0); const proactiveTriggers = useProactiveNilaTriggers(); (0, import_react36.useEffect)(() => { if (!allowedTabs.find((t) => t.key === activeTab)) { setActiveTab(allowedTabs[0]?.key || "profile"); } }, [clientMode]); (0, import_react36.useEffect)(() => { const url = (profileUrl || "").trim(); const imgs = details.galleryImages || []; const exists = imgs.some((img) => img?.url === url); if (url && !exists && details.addGalleryImage && !details.addGalleryImage.isPending) { try { details.addGalleryImage.mutate({ url, source: "profile" }); } catch (e) { console.error("Auto-add profile image to gallery failed", e); } } }, [profileUrl, details.galleryImages]); (0, import_react36.useEffect)(() => { if (clientMode) return; if (activeTab === "messages") { setTimeout(() => { proactiveTriggers.onFeatureInteraction("messaging_with_ai", { clientId: client.id, clientName: `${client.first_name || ""} ${client.last_name || ""}`.trim(), hasImages: details.galleryImages?.length > 0, context: "client-modal-messages-tab" }); }, 2e3); } if (activeTab === "appointments" && details.appointments?.length > 0) { setTimeout(() => { proactiveTriggers.onFeatureInteraction("calendar_ai_booking", { clientId: client.id, appointmentCount: details.appointments.length, context: "client-modal-appointments-tab" }); }, 3e3); } if (details.galleryImages?.length >= 3) { proactiveTriggers.onInsight({ type: "client_with_photos", clientId: client.id, photosCount: details.galleryImages.length, context: "client-modal-gallery" }); } }, [ activeTab, clientMode, details.galleryImages, details.appointments, client.id ]); const handleCloseAndSave = () => { setSaveSignal((s) => s + 1); }; const openLightboxAt = (idx) => { setLightboxIndex(idx); setLightboxOpen(true); }; const handleDeleteFromLightbox = async (id3) => { try { const ok = window.confirm("Delete this image?"); if (!ok) return; await details.deleteGalleryImage.mutateAsync(id3); setLightboxOpen(false); } catch (e) { console.error("Delete from lightbox failed", e); alert("Could not delete image. Please try again."); } }; const handleArchive = async () => { try { const ok = window.confirm( "Archive this client? You can unarchive later. Their history stays intact." ); if (!ok) return; await details.archiveClient.mutateAsync(); onClose && onClose(); } catch (e) { console.error("Archive failed", e); alert("Could not archive client"); } }; const handleUnarchive = async () => { try { await details.unarchiveClient.mutateAsync(); onClose && onClose(); } catch (e) { console.error("Unarchive failed", e); alert("Could not unarchive client"); } }; const panel = /* @__PURE__ */ import_react36.default.createElement( "div", { className: "relative w-full rounded-2xl p-0 overflow-hidden max-h-[calc(100vh-4rem)] sm:max-h-[calc(100vh-6rem)] flex flex-col", style: { backgroundColor: "var(--theme-bg-surface)", border: "1px solid var(--theme-border)", boxShadow: "var(--theme-tile-shadow)", color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" } }, /* @__PURE__ */ import_react36.default.createElement( "div", { className: "sticky top-0 z-10 flex items-center justify-between px-6 py-4 border-b backdrop-blur-xl", style: { borderColor: "var(--theme-border)", backgroundColor: "var(--theme-tile-translucent)" } }, /* @__PURE__ */ import_react36.default.createElement( "h2", { className: "text-xl font-semibold", style: { color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" }, "data-modal-title": true }, "Edit client" ), /* @__PURE__ */ import_react36.default.createElement("div", { className: "flex items-center gap-2" }, !clientMode && client?.archived_at && /* @__PURE__ */ import_react36.default.createElement( "button", { onClick: handleUnarchive, className: "px-3 py-1.5 rounded-full text-sm font-semibold", style: { backgroundColor: "var(--theme-btn-primary-bg)", color: "var(--theme-btn-primary-text)", boxShadow: "var(--theme-btn-primary-shadow)", opacity: details.unarchiveClient.isPending ? 0.7 : 1 }, disabled: details.unarchiveClient.isPending }, details.unarchiveClient.isPending ? "Unarchiving\u2026" : "Unarchive" ), /* @__PURE__ */ import_react36.default.createElement( "button", { onClick: handleCloseAndSave, className: "px-3 py-1.5 rounded-full text-sm font-semibold hover:opacity-90", style: { backgroundColor: "var(--theme-btn-secondary-bg)", color: "var(--theme-btn-secondary-text)", border: "1px solid var(--theme-border)", fontFamily: "var(--theme-font-body)" } }, "Close & Save" )) ), /* @__PURE__ */ import_react36.default.createElement("div", { className: "hidden sm:block px-4 pt-3" }, /* @__PURE__ */ import_react36.default.createElement("div", { style: { borderBottom: `1px solid var(--theme-border)` } }, /* @__PURE__ */ import_react36.default.createElement("nav", { className: "-mb-px flex space-x-8 overflow-x-auto" }, allowedTabs.map((t) => /* @__PURE__ */ import_react36.default.createElement( "button", { key: t.key, onClick: () => setActiveTab(t.key), className: `whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm transition-colors`, style: { borderColor: activeTab === t.key ? "var(--theme-accent)" : "transparent", color: activeTab === t.key ? "var(--theme-text-primary)" : "var(--theme-text-secondary)", fontFamily: "var(--theme-font-body)" } }, t.label ))))), /* @__PURE__ */ import_react36.default.createElement("div", { className: "p-6 space-y-8 sm:space-y-0 overflow-y-auto flex-1 pb-24 sm:pb-16" }, client?.archived_at && !clientMode && /* @__PURE__ */ import_react36.default.createElement(Alert, { variant: "warning", title: "Archived client" }, "This client is archived. You can unarchive to make changes and include them back in lists."), /* @__PURE__ */ import_react36.default.createElement("section", { className: activeTab === "profile" ? "block" : "hidden" }, /* @__PURE__ */ import_react36.default.createElement( ProfileTab, { client, updateProfile: details.updateProfile, isUpdatingProfile: details.isUpdatingProfile, onClose, sendSms: details.sendSms, isSendingSms: details.isSendingSms, smsSuccess: details.smsSuccess, profileUrl, setProfileUrl, saveSignal } )), /* @__PURE__ */ import_react36.default.createElement("section", { className: activeTab === "messages" ? "block" : "hidden" }, /* @__PURE__ */ import_react36.default.createElement(MessagesTab, { client })), !clientMode && /* @__PURE__ */ import_react36.default.createElement("section", { className: activeTab === "formulas" ? "block" : "hidden" }, /* @__PURE__ */ import_react36.default.createElement( FormulasTab, { client, formulas: details.formulas, createFormula: details.createFormula, updateFormula: details.updateFormula, deleteFormula: details.deleteFormula } )), /* @__PURE__ */ import_react36.default.createElement("section", { className: activeTab === "appointments" ? "block" : "hidden" }, /* @__PURE__ */ import_react36.default.createElement( AppointmentsTab2, { client, appointments: details.appointments, updateAppointment: details.updateAppointment, deleteAppointment: details.deleteAppointment } )), /* @__PURE__ */ import_react36.default.createElement("section", { className: activeTab === "orders" ? "block" : "hidden" }, /* @__PURE__ */ import_react36.default.createElement( OrdersTab, { client, orders: details.orders, createOrder: details.createOrder, updateOrder: details.updateOrder } )), !clientMode && /* @__PURE__ */ import_react36.default.createElement( GallerySection, { images: details.galleryImages, profileUrl, addGalleryImage: details.addGalleryImage, onImageClick: openLightboxAt, deleteGalleryImage: details.deleteGalleryImage } ), !clientMode && /* @__PURE__ */ import_react36.default.createElement( "div", { className: "mt-8 rounded-3xl p-5", style: { border: "1px solid var(--theme-border)", backgroundColor: "var(--theme-bg-hover)" } }, /* @__PURE__ */ import_react36.default.createElement( "h3", { className: "text-lg font-semibold mb-2", style: { color: "var(--theme-text-primary)" } }, "AI Studio" ), /* @__PURE__ */ import_react36.default.createElement( "p", { className: "text-sm mb-4", style: { color: "var(--theme-text-secondary)" } }, "Analyze face and hair, get style ideas, try on hair styles and colors, and generate a high\u2011quality image \u2014 all in one place." ), /* @__PURE__ */ import_react36.default.createElement( "a", { href: `/ai-studio?sourceTab=client&clientId=${client.id}`, className: "ai-studio-glow inline-flex items-center px-4 py-2 rounded-full font-semibold focus:outline-none focus-visible:ring-2 focus-visible:ring-white/70", style: { backgroundColor: "var(--theme-btn-primary-bg)", color: "var(--theme-btn-primary-text)", boxShadow: "var(--theme-btn-primary-shadow)" } }, "AI Studio" ) )), !clientMode && !client?.archived_at && /* @__PURE__ */ import_react36.default.createElement( "div", { className: "sticky bottom-0 z-10 flex items-center justify-end px-6 py-4 border-t backdrop-blur-xl", style: { borderColor: "var(--theme-border)", backgroundColor: "var(--theme-tile-translucent)" } }, /* @__PURE__ */ import_react36.default.createElement( "button", { onClick: handleArchive, className: "px-4 py-2 rounded-full border text-sm font-semibold focus:outline-none focus-visible:ring-2 focus-visible:ring-red-400/50 disabled:opacity-50", style: { backgroundColor: "rgba(239, 68, 68, 0.15)", color: "#ef4444", border: "1px solid rgba(239, 68, 68, 0.3)" }, disabled: details.archiveClient.isPending, "aria-label": "Archive client" }, details.archiveClient.isPending ? "Archiving\u2026" : "Archive" ) ), /* @__PURE__ */ import_react36.default.createElement("style", { jsx: true, global: true }, ` @keyframes aiGlowPulse { 0% { box-shadow: 0 0 22px 8px rgba(59,130,246,0.60), 0 0 4px rgba(255,255,255,0.85); } 50% { box-shadow: 0 0 38px 14px rgba(59,130,246,0.88), 0 0 10px rgba(255,255,255,0.95); } 100% { box-shadow: 0 0 22px 8px rgba(59,130,246,0.60), 0 0 4px rgba(255,255,255,0.85); } } .ai-studio-glow { transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease; animation: aiGlowPulse 2.1s ease-in-out infinite; animation-fill-mode: both; will-change: box-shadow, transform; } .ai-studio-glow:hover { transform: translateY(-1.5px) scale(1.01); } @media (prefers-reduced-motion: reduce) { .ai-studio-glow { animation: none; } } `) ); if (!client) return null; return /* @__PURE__ */ import_react36.default.createElement(import_react36.default.Fragment, null, /* @__PURE__ */ import_react36.default.createElement( Modal, { isOpen: !!client, onClose, dismissible: true, overlayClassName: "items-center p-4 sm:pt-12", contentClassName: "w-full max-w-lg" }, panel ), /* @__PURE__ */ import_react36.default.createElement( ImageLightbox, { isOpen: lightboxOpen, onClose: () => setLightboxOpen(false), images: details.galleryImages, initialIndex: lightboxIndex, clientName: `${client.first_name || ""} ${client.last_name || ""}`.trim(), clientId: client.id, onDeleteImage: handleDeleteFromLightbox } )); } // virtual:/apps/web/src/hooks/useOnboardingRewards.js init_injected_globals(); var import_react37 = __toESM(require_react()); // virtual:/apps/web/src/utils/tokenAnimation.js init_injected_globals(); var TokenAnimator = class { constructor() { this.activeAnimations = []; this.onTokenChange = null; } /** * Set a callback to refresh token balance in header * @param {Function} callback - Function to call when tokens change */ setTokenChangeCallback(callback) { this.onTokenChange = callback; } /** * Create a flying token animation from source element to target element * @param {Object} options * @param {HTMLElement} options.fromElement - Source element (form field) * @param {HTMLElement} options.toElement - Target element (header token display) * @param {number} options.amount - Token amount to display * @param {number} options.delay - Delay before starting (ms) * @param {Function} options.onComplete - Callback when animation completes */ createFlyingToken({ fromElement, toElement, amount, delay: delay2 = 0, onComplete }) { if (!fromElement || !toElement) { console.warn("TokenAnimator: Missing required elements"); return; } setTimeout(() => { const fromRect = fromElement.getBoundingClientRect(); const toRect = toElement.getBoundingClientRect(); const token = document.createElement("div"); token.className = "token-flying-animation"; token.innerHTML = `

\u{1FA99} +${amount}

`; token.style.cssText = ` position: fixed; left: ${fromRect.left + fromRect.width / 2}px; top: ${fromRect.top + fromRect.height / 2}px; z-index: 9999; pointer-events: none; transform: translate(-50%, -50%); transition: all 2.5s cubic-bezier(0.34, 1.56, 0.64, 1); opacity: 1; `; document.body.appendChild(token); requestAnimationFrame(() => { requestAnimationFrame(() => { token.style.left = `${toRect.left + toRect.width / 2}px`; token.style.top = `${toRect.top + toRect.height / 2}px`; token.style.opacity = "0"; token.style.transform = "translate(-50%, -50%) scale(0.5)"; }); }); setTimeout(() => { token.remove(); if (this.onTokenChange) { this.onTokenChange(); } if (onComplete) onComplete(); }, 2600); this.activeAnimations.push(token); }, delay2); } /** * Create multiple flying token animations in sequence * @param {Array} rewards - Array of {fromElement, amount, onComplete} * @param {HTMLElement} toElement - Target element (header) */ createSequence(rewards, toElement) { rewards.forEach((reward, index) => { this.createFlyingToken({ fromElement: reward.fromElement, toElement, amount: reward.amount, delay: index * 500, // Increased stagger to 500ms onComplete: reward.onComplete }); }); } /** * Animate token counter in header from old to new value * @param {HTMLElement} element - Counter element * @param {number} from - Starting value * @param {number} to - Ending value * @param {number} duration - Animation duration (ms) */ animateCounter(element, from, to, duration = 1500) { if (!element) return; const startTime = Date.now(); const diff = to - from; const update = () => { const elapsed = Date.now() - startTime; const progress2 = Math.min(elapsed / duration, 1); const eased = 1 - Math.pow(1 - progress2, 3); const current = Math.round(from + diff * eased); element.textContent = current.toString(); if (progress2 < 1) { requestAnimationFrame(update); } }; requestAnimationFrame(update); } /** * Clean up all active animations */ cleanup() { this.activeAnimations.forEach((token) => token.remove()); this.activeAnimations = []; } }; function injectTokenAnimationStyles() { if (typeof document === "undefined") return; if (document.getElementById("token-animation-styles")) return; const style = document.createElement("style"); style.id = "token-animation-styles"; style.textContent = ` .token-flying-content { display: flex; align-items: center; gap: 4px; padding: 6px 12px; background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%); border-radius: 20px; box-shadow: 0 4px 16px rgba(251, 191, 36, 0.6), 0 0 24px rgba(245, 158, 11, 0.3); font-weight: 600; color: white; font-size: 14px; border: 1px solid rgba(255, 255, 255, 0.3); } .token-coin { font-size: 18px; animation: token-spin 1.2s ease-in-out; filter: drop-shadow(0 2px 4px rgba(217, 119, 6, 0.4)); } .token-amount { font-size: 14px; font-weight: bold; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); } @keyframes token-spin { 0% { transform: rotateY(0deg); } 50% { transform: rotateY(180deg); } 100% { transform: rotateY(360deg); } } `; document.head.appendChild(style); } var tokenAnimator = new TokenAnimator(); if (typeof window !== "undefined") { injectTokenAnimationStyles(); } // virtual:/apps/web/src/hooks/useOnboardingRewards.js function useOnboardingRewards() { const queryClient2 = useQueryClient(); const [claiming, setClaiming] = (0, import_react37.useState)(false); const [lastReward, setLastReward] = (0, import_react37.useState)(null); const claimReward = async (step) => { if (claiming) return null; setClaiming(true); try { const response = await fetch("/api/onboarding/reward", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ step }) }); if (response.ok) { const data = await response.json(); if (data.success && data.awarded) { setLastReward(data); queryClient2.invalidateQueries({ queryKey: ["user"] }); queryClient2.invalidateQueries({ queryKey: ["tokens"] }); if (window.tokenDisplayRef && data.tokens) { const tempElement = document.createElement("div"); tempElement.style.cssText = ` position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); pointer-events: none; `; document.body.appendChild(tempElement); setTimeout(() => { tokenAnimator.createFlyingToken({ fromElement: tempElement, toElement: window.tokenDisplayRef, amount: data.tokens, delay: 0, onComplete: () => { tempElement.remove(); } }); }, 100); } const event = new CustomEvent("nila-celebration", { detail: { step, tokens: data.tokens, message: data.message } }); window.dispatchEvent(event); console.log("\u{1F389} Reward claimed:", { step, tokens: data.tokens, balance: data.new_balance }); return data; } else if (data.already_claimed) { return null; } } } catch (error) { console.error("Failed to claim reward:", error); } finally { setClaiming(false); } return null; }; (0, import_react37.useEffect)(() => { const handleProgressUpdate = async (event) => { const { step } = event.detail || {}; if (step) { await claimReward(step); } }; window.addEventListener("onboarding-step-completed", handleProgressUpdate); return () => window.removeEventListener( "onboarding-step-completed", handleProgressUpdate ); }, []); return { claimReward, claiming, lastReward }; } // virtual:/apps/web/src/hooks/useOnboardingGuide.js init_injected_globals(); var import_react38 = __toESM(require_react()); function useOnboardingGuide() { const { data: user } = useUser_default(); const [onboardingState, setOnboardingState] = (0, import_react38.useState)({ isNewUser: false, hasServices: false, hasClients: false, hasAppointments: false, currentStep: null, isLoading: true, showWelcome: false, claimedSteps: [] }); const checkOnboardingProgress = (0, import_react38.useCallback)(async () => { if (!user?.email) return; try { const response = await fetch("/api/onboarding/progress"); if (response.ok) { const data = await response.json(); const isNewUser = data.isNewUser; const currentStep = data.nextStep; const isComplete = currentStep === "complete"; const hasSeenComplete = localStorage.getItem( "nila-onboarding-complete-seen" ); const shouldShowWelcome = isNewUser && !localStorage.getItem("nila-onboarding-dismissed") || isComplete && !hasSeenComplete; setOnboardingState({ isNewUser, hasServices: data.hasServices, hasClients: data.hasClients, hasAppointments: data.hasAppointments, currentStep, isLoading: false, showWelcome: shouldShowWelcome, claimedSteps: data.claimedSteps || [] }); } } catch (error) { console.error("Failed to check onboarding progress:", error); setOnboardingState((prev) => ({ ...prev, isLoading: false })); } }, [user?.email]); const getNextStepMessage = (step, claimed) => { if (!step || step === "complete") { return "\u{1F38A} **Congratulations!** You've completed onboarding! You can now use your tokens in AI-Studio for virtual try-ons, hair analysis, and more!"; } const messages = { complete_profile: "**Next:** Complete your profile (30 tokens)\nGo to Settings \u2192 Stylist Profile", add_phone_number: "**Next:** Add phone number (15 tokens)\nGo to Settings \u2192 Stylist Profile", set_timezone: "**Next:** Set your timezone (15 tokens)\nGo to Settings \u2192 Stylist Profile", set_business_hours: "**Next:** Set business hours (20 tokens)\nGo to Settings \u2192 Business Profile", add_first_service: "**Next:** Add your first service (40 tokens)\nWhat services do you offer?", add_first_client: "**Next:** Add your first client (40 tokens)\nStart building your client list", schedule_first_appointment: "**Next:** Schedule your first appointment (40 tokens)\nBook your first client!" }; return messages[step] || "Keep going - you're doing great!"; }; const getNextStepActions = (step) => { const actions = { complete_profile: [ { label: "Complete Profile", action: "navigate", url: "/settings" } ], add_phone_number: [ { label: "Add Phone", action: "navigate", url: "/settings" } ], set_timezone: [ { label: "Set Timezone", action: "navigate", url: "/settings" } ], set_business_hours: [ { label: "Set Hours", action: "navigate", url: "/settings" } ], add_first_service: [ { label: "Add Service", action: "navigate", url: "/services" } ], add_first_client: [ { label: "Add Client", action: "navigate", url: "/clients" } ], schedule_first_appointment: [ { label: "Schedule Appointment", action: "navigate", url: "/calendar" } ] }; return actions[step] || []; }; const markCongratsAsSeen = (0, import_react38.useCallback)(() => { if (onboardingState.currentStep === "complete") { localStorage.setItem("nila-onboarding-complete-seen", "true"); setOnboardingState((prev) => ({ ...prev, showWelcome: false })); } }, [onboardingState.currentStep]); const getWelcomeMessage = () => { const { claimedSteps, isNewUser, currentStep } = onboardingState; const allSteps = [ { key: "complete_profile", label: "Complete Your Profile", tokens: 30, url: "/settings", description: "Add your name and bio (10+ characters)" }, { key: "add_phone_number", label: "Add Phone Number", tokens: 15, url: "/settings", description: "Add your phone so clients can reach you" }, { key: "set_timezone", label: "Set Your Timezone", tokens: 15, url: "/settings", description: "Help us show you the right times" }, { key: "set_business_hours", label: "Set Business Hours", tokens: 20, url: "/settings", description: "Let clients know when you're available" }, { key: "add_first_service", label: "Add a Service", tokens: 40, url: "/services", description: "Add at least one service you offer" }, { key: "add_first_client", label: "Add a Client", tokens: 40, url: "/clients", description: "Add your first client to the system" }, { key: "schedule_first_appointment", label: "Schedule Appointment", tokens: 40, url: "/calendar", description: "Book your first appointment" }, { key: "onboarding_complete", label: "Complete All Steps (Bonus!)", tokens: 20, url: null, description: "Finish all steps to get bonus tokens" } ]; const remainingSteps = allSteps.filter( (step) => !claimedSteps.includes(step.key) ); const completedCount = allSteps.length - remainingSteps.length; const tokensEarned = claimedSteps.reduce((sum, step) => { const stepData = allSteps.find((s) => s.key === step); return sum + (stepData?.tokens || 0); }, 0); if (isNewUser && claimedSteps.length === 0) { return { message: `Hey there! \u{1F44B} I'm **Nila**, your AI assistant! I'm here to help you manage your salon, schedule appointments, message clients, and more. Think of me as your virtual assistant who knows your business inside and out. \u{1F381} **Let's get you set up and earn 220 tokens!** ![AI Studio Demo](https://ucarecdn.com/a9e69173-2b2f-4ad4-ae0e-b474f4977fbb/) You can use tokens in **AI-Studio** for amazing features like: \u2022 Virtual hair try-ons for clients \u2022 AI-powered hair analysis \u2022 Personalized style recommendations \u2022 And much more! **Here's how to earn your tokens:** ${allSteps.map( (step, i) => `**${i + 1}. ${step.label}** (${step.tokens} tokens) ${step.description}` ).join("\n\n")} **Total: 220 tokens** to explore AI-Studio features! I can help you with any of these steps. What would you like to start with? \u{1F60A}`, actions: [ { label: "Complete Profile", action: "navigate", url: "/settings" }, { label: "Learn More About Nila", action: "help", target: "nila-intro" } ] }; } if (remainingSteps.length === 0) { return { message: `\u{1F38A} **Congratulations!** You've completed all onboarding steps! **Total Tokens Earned:** ${tokensEarned}/220 \u{1FA99} You can now use your tokens in **AI-Studio** for: \u2022 Virtual hair try-ons for clients \u2022 AI-powered hair analysis \u2022 Personalized style recommendations \u2022 And much more! How can I help you today?`, actions: [ { label: "Go to AI-Studio", action: "navigate", url: "/ai-studio" } ] }; } const stepsMessage = remainingSteps.map( (step, i) => `**${i + 1}. ${step.label}** (${step.tokens} tokens) ${step.description}` ).join("\n\n"); return { message: `Welcome back! \u{1F389} **Your Progress:** ${completedCount}/${allSteps.length} steps completed **Tokens Earned:** ${tokensEarned}/220 \u{1FA99} **Steps Remaining:** ${stepsMessage} How can I help you today?`, actions: remainingSteps.length > 0 && remainingSteps[0].url ? [ { label: `Start: ${remainingSteps[0].label}`, action: "navigate", url: remainingSteps[0].url } ] : [] }; }; const completeStep = async (step) => { const event = new CustomEvent("onboarding-step-completed", { detail: { step } }); window.dispatchEvent(event); setTimeout(() => { checkOnboardingProgress(); const updateEvent = new CustomEvent("onboarding-progress-update"); window.dispatchEvent(updateEvent); }, 500); }; const dismissOnboarding = () => { localStorage.setItem("nila-onboarding-dismissed", "true"); if (onboardingState.currentStep === "complete") { localStorage.setItem("nila-onboarding-complete-seen", "true"); } setOnboardingState((prev) => ({ ...prev, showWelcome: false })); }; (0, import_react38.useEffect)(() => { checkOnboardingProgress(); }, [checkOnboardingProgress]); (0, import_react38.useEffect)(() => { const handleProgressUpdate = () => { setTimeout(checkOnboardingProgress, 1e3); }; window.addEventListener("onboarding-progress-update", handleProgressUpdate); return () => window.removeEventListener( "onboarding-progress-update", handleProgressUpdate ); }, [checkOnboardingProgress]); return { ...onboardingState, dismissOnboarding, completeStep, refreshProgress: checkOnboardingProgress, getWelcomeMessage, markCongratsAsSeen }; } // virtual:/apps/web/src/app/page.jsx var import_lucide_react16 = __toESM(require_lucide_react()); function HomePage() { const { now: now2, apptLoading, apptError, ordersLoading, ordersError, smsTemplates, appointments, clientById, serviceById, nextAppointment, nextSmsOpen, setNextSmsOpen, nextSmsBody, setNextSmsBody, nextSmsError, rowSmsOpenId, setRowSmsOpenId, rowSmsBody, setRowSmsBody, rowSmsError, sendSmsMutation, upcomingBirthdays, upcomingHolidays, orders, updateAppointmentStatus } = useHomePage(); const { data: profileData, isLoading: isLoadingProfile } = useQuery({ queryKey: ["profile"], queryFn: async () => { const res = await fetch("/api/profile"); if (!res.ok) { throw new Error( `Profile fetch failed: ${res.status} ${res.statusText}` ); } return res.json(); } // removed per-query flags to rely on global defaults }); const userTimezone = profileData?.profile?.timezone; const proactiveTriggers = useProactiveNilaTriggers(); const { claimReward } = useOnboardingRewards(); const onboarding = useOnboardingGuide(); import_react39.default.useEffect(() => { if (onboarding.isLoading || !onboarding.isNewUser) return; const checkAndClaim = async () => { const progress2 = await fetch("/api/onboarding/progress").then( (r) => r.json() ); const claimed = await fetch("/api/onboarding/reward").then( (r) => r.json() ); const claimedSteps = claimed.rewards?.filter((r) => r.claimed).map((r) => r.step) || []; if (progress2.hasServices && !claimedSteps.includes("add_first_service")) { await claimReward("add_first_service"); } if (progress2.hasClients && !claimedSteps.includes("add_first_client")) { await claimReward("add_first_client"); } if (progress2.hasAppointments && !claimedSteps.includes("schedule_first_appointment")) { await claimReward("schedule_first_appointment"); } if (progress2.hasServices && progress2.hasClients && progress2.hasAppointments && !claimedSteps.includes("onboarding_complete")) { await claimReward("onboarding_complete"); } }; checkAndClaim(); }, [onboarding.isNewUser, onboarding.isLoading, claimReward]); import_react39.default.useEffect(() => { if (apptLoading || isLoadingProfile) return; const hasUpcomingAppointments = appointments && appointments.length > 0; if (!hasUpcomingAppointments && !nextAppointment) { proactiveTriggers.onEmptyState("calendar"); } if (upcomingBirthdays && upcomingBirthdays.length > 0) { proactiveTriggers.onInsight({ type: "birthday_clients", count: upcomingBirthdays.length, clients: upcomingBirthdays.map((b) => b.client_name) }); } if (upcomingHolidays && upcomingHolidays.length > 0) { proactiveTriggers.onInsight({ type: "holiday_opportunities", count: upcomingHolidays.length, holidays: upcomingHolidays.map((h) => h.name) }); } }, [ appointments, nextAppointment, upcomingBirthdays, upcomingHolidays, apptLoading, isLoadingProfile ]); const [editingAppointment, setEditingAppointment] = (0, import_react39.useState)(null); const [editingClient, setEditingClient] = (0, import_react39.useState)(null); const [pendingAppointmentReturn, setPendingAppointmentReturn] = (0, import_react39.useState)(null); const openEdit = () => { if (nextAppointment) setEditingAppointment(nextAppointment); }; const closeEdit = () => { setEditingAppointment(null); setPendingAppointmentReturn(null); }; const openClientEdit = (client) => { if (editingAppointment) { setPendingAppointmentReturn(editingAppointment); setEditingAppointment(null); } setEditingClient(client); }; const closeClientEdit = () => { setEditingClient(null); if (pendingAppointmentReturn) { setEditingAppointment(pendingAppointmentReturn); setPendingAppointmentReturn(null); } }; const startQuickStart = () => { try { if (typeof window !== "undefined") { window.dispatchEvent( new CustomEvent("startTutorial", { detail: { slug: "quick-start" } }) ); const nilaMsg = new CustomEvent("setNilaInput", { detail: { message: "Start Quick Start" } }); window.dispatchEvent(nilaMsg); const chatBubble = document.querySelector( '[aria-label="Open AI Assistant"]' ); chatBubble?.click?.(); } } catch (err) { console.error("Failed to start tutorial", err); } }; const [tutorialsOpen, setTutorialsOpen] = (0, import_react39.useState)(false); const startBySlug = (slug) => { try { if (typeof window !== "undefined") { window.dispatchEvent( new CustomEvent("startTutorial", { detail: { slug } }) ); setTutorialsOpen(false); const chatBubble = document.querySelector( '[aria-label="Open AI Assistant"]' ); chatBubble?.click?.(); } } catch (e) { console.error("Failed to start tutorial", e); } }; return /* @__PURE__ */ import_react39.default.createElement( "div", { className: "p-4 sm:p-6 lg:p-8 min-h-full", style: { backgroundColor: "var(--theme-bg-primary)" } }, /* @__PURE__ */ import_react39.default.createElement(HomePageHeader, null), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex justify-end mt-2 mb-4 gap-2 relative" }, /* @__PURE__ */ import_react39.default.createElement( "button", { type: "button", onClick: startQuickStart, className: "inline-flex items-center gap-2 px-3 py-1.5 rounded-full text-xs sm:text-sm", style: { backgroundColor: "var(--theme-bg-surface)", color: "var(--theme-text-primary)", border: `1px solid var(--theme-border)`, boxShadow: "var(--theme-tile-shadow)" }, "aria-label": "Start Quick Start tutorial" }, /* @__PURE__ */ import_react39.default.createElement(import_lucide_react16.Play, { size: 14 }), /* @__PURE__ */ import_react39.default.createElement("span", null, "Start Quick Start") ), /* @__PURE__ */ import_react39.default.createElement("div", { className: "inline-block" }, /* @__PURE__ */ import_react39.default.createElement( "button", { type: "button", onClick: () => setTutorialsOpen((v) => !v), className: "inline-flex items-center gap-2 px-3 py-1.5 rounded-full text-xs sm:text-sm", style: { backgroundColor: "var(--theme-bg-surface)", color: "var(--theme-text-primary)", border: `1px solid var(--theme-border)`, boxShadow: "var(--theme-tile-shadow)" }, "aria-haspopup": "menu", "aria-expanded": tutorialsOpen, "aria-label": "Open Tutorials menu" }, /* @__PURE__ */ import_react39.default.createElement("span", null, "Tutorials"), /* @__PURE__ */ import_react39.default.createElement(import_lucide_react16.ChevronDown, { size: 14 }) ), tutorialsOpen && /* @__PURE__ */ import_react39.default.createElement( "div", { role: "menu", className: "absolute right-0 mt-2 w-48 sm:w-56 rounded-2xl z-20", style: { backgroundColor: "var(--theme-bg-surface)", border: `1px solid var(--theme-border)`, boxShadow: "var(--theme-tile-shadow)" } }, /* @__PURE__ */ import_react39.default.createElement( "button", { role: "menuitem", className: "w-full text-left px-3 py-2 rounded-2xl text-xs sm:text-sm hover:bg-black/5", style: { color: "var(--theme-text-primary)" }, onClick: () => startBySlug("quick-start") }, "Quick Start" ), /* @__PURE__ */ import_react39.default.createElement( "button", { role: "menuitem", className: "w-full text-left px-3 py-2 rounded-2xl text-xs sm:text-sm hover:bg-black/5", style: { color: "var(--theme-text-primary)" }, onClick: () => startBySlug("clients-basics") }, "Clients Basics" ), /* @__PURE__ */ import_react39.default.createElement( "button", { role: "menuitem", className: "w-full text-left px-3 py-2 rounded-2xl text-xs sm:text-sm hover:bg-black/5", style: { color: "var(--theme-text-primary)" }, onClick: () => startBySlug("calendar-basics") }, "Calendar Basics" ), /* @__PURE__ */ import_react39.default.createElement( "button", { role: "menuitem", className: "w-full text-left px-3 py-2 rounded-2xl text-xs sm:text-sm hover:bg-black/5", style: { color: "var(--theme-text-primary)" }, onClick: () => startBySlug("invoicing-101") }, "Invoicing 101" ), /* @__PURE__ */ import_react39.default.createElement( "button", { role: "menuitem", className: "w-full text-left px-3 py-2 rounded-2xl text-xs sm:text-sm hover:bg-black/5", style: { color: "var(--theme-text-primary)" }, onClick: () => startBySlug("ai-studio-tour") }, "AI Studio tour" ) ))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "space-y-6 lg:space-y-8" }, /* @__PURE__ */ import_react39.default.createElement("div", null, /* @__PURE__ */ import_react39.default.createElement( NextAppointmentTile, { nextAppointment, clientById, serviceById, smsTemplates, isSmsOpen: nextSmsOpen, setSmsOpen: setNextSmsOpen, smsBody: nextSmsBody, setSmsBody: setNextSmsBody, smsError: nextSmsError, sendSmsMutation, onEdit: openEdit, onMarkCompleted: () => nextAppointment && updateAppointmentStatus.mutate({ id: nextAppointment.id, status: "completed" }), onMarkNoShow: () => nextAppointment && updateAppointmentStatus.mutate({ id: nextAppointment.id, status: "no_show" }), isUpdatingStatus: updateAppointmentStatus.isPending, userTimezone } )), /* @__PURE__ */ import_react39.default.createElement("div", null, /* @__PURE__ */ import_react39.default.createElement( UpcomingInfoTabs, { appointments, apptLoading, apptError, upcomingBirthdays, upcomingHolidays, orders, ordersLoading, ordersError, clientById, serviceById, now: now2, smsTemplates, rowSmsOpenId, setRowSmsOpenId, rowSmsBody, setRowSmsBody, rowSmsError, sendSmsMutation, onEditClient: openClientEdit } ))), /* @__PURE__ */ import_react39.default.createElement( EditAppointmentModal, { appointment: editingAppointment, onClose: closeEdit, position: "lower", onEditClient: openClientEdit, clientById, userTimezone } ), editingClient && /* @__PURE__ */ import_react39.default.createElement( EditClientModal, { client: editingClient, onClose: closeClientEdit, initialTab: "profile" } ) ); } // virtual:/apps/web/src/app/layout.jsx init_injected_globals(); // virtual:/apps/web/src/components/AppShell.jsx init_injected_globals(); var import_react94 = __toESM(require_react()); // virtual:/apps/web/src/hooks/useAppShellData.js init_injected_globals(); // virtual:/apps/web/src/hooks/useTokens.js init_injected_globals(); function useTokens() { const { data: user } = useUser(); const queryClient2 = useQueryClient(); const { data: tokenData, isLoading, error, refetch } = useQuery({ queryKey: ["tokens", user?.email], queryFn: async () => { try { console.log("\u{1F50D} useTokens - Starting fetch for user:", user?.email); const res = await fetch("/api/tokens", { cache: "no-cache", // Force fresh data headers: { "Cache-Control": "no-cache", Pragma: "no-cache" } }); console.log( "\u{1F50D} useTokens - Response status:", res.status, res.statusText ); if (!res.ok) { const errorText = await res.text(); console.error("\u{1F50D} useTokens - API Error Response:", errorText); throw new Error( `When fetching /api/tokens, the response was [${res.status}] ${res.statusText}: ${errorText}` ); } const data = await res.json(); console.log("\u{1F50D} useTokens - Success! Data received:", data); if (data === null || data === void 0) { console.warn( "\u{1F50D} useTokens - API returned null/undefined, using fallback" ); return { token_balance: 0, unlimited_tokens: false, error: "API returned null response", fallback: true }; } console.log("\u{1F4B0} useTokens - Fresh data received:", { user: user?.email, balance: data.token_balance, unlimited: data.unlimited_tokens, reconciled: data.reconciled }); return data; } catch (fetchError) { console.error("\u{1F50D} useTokens - Fetch failed:", { error: fetchError, message: fetchError.message, user: user?.email, stack: fetchError.stack }); throw fetchError; } }, enabled: !!user?.email // removed per-query cache and refetch flags to rely on global defaults }); const refreshTokens = () => { console.log("\u{1F4B0} useTokens - Force refreshing tokens for:", user?.email); queryClient2.removeQueries({ queryKey: ["tokens"] }); queryClient2.invalidateQueries({ queryKey: ["tokens"] }); return refetch(); }; const invalidateTokens = () => { console.log("\u{1F4B0} useTokens - Invalidating token cache for:", user?.email); queryClient2.invalidateQueries({ queryKey: ["tokens"] }); }; const resetTokenCache = () => { console.log( "\u{1F4B0} useTokens - Nuclear reset of token cache for:", user?.email ); queryClient2.removeQueries({ queryKey: ["tokens"] }); queryClient2.clear(); return refetch(); }; const getTokenLabel = () => { if (isLoading) return "Loading..."; if (error) return "Error"; if (!tokenData) return "0"; if (tokenData.unlimited_tokens) { return "\u221E"; } return `${tokenData.token_balance || 0}`; }; const getTokenDisplayText = () => { if (isLoading) return "Loading tokens..."; if (error) return "Error loading tokens"; if (!tokenData) return "0 tokens"; if (tokenData.unlimited_tokens) { return "Unlimited tokens"; } const balance = tokenData.token_balance || 0; return `${balance} token${balance !== 1 ? "s" : ""}`; }; const hasEnoughTokens = (requiredTokens) => { if (!tokenData) return false; if (tokenData.unlimited_tokens) return true; return (tokenData.token_balance || 0) >= requiredTokens; }; const getTokenDeficit = (requiredTokens) => { if (!tokenData || tokenData.unlimited_tokens) return 0; const balance = tokenData.token_balance || 0; return Math.max(0, requiredTokens - balance); }; return { // Raw data tokenData, isLoading, error, // Actions refetch, refreshTokens, invalidateTokens, resetTokenCache, // New nuclear option // Helpers getTokenLabel, getTokenDisplayText, hasEnoughTokens, getTokenDeficit, // Direct access to common values balance: tokenData?.token_balance || 0, unlimited: tokenData?.unlimited_tokens || false, hasTokens: tokenData?.unlimited_tokens || (tokenData?.token_balance || 0) > 0, // Debug info wasReconciled: tokenData?.reconciled || false, reconcileDetails: tokenData?.reconcile_details || null }; } var useTokens_default = useTokens; // virtual:/apps/web/src/hooks/useAppShellData.js var import_react40 = __toESM(require_react()); function useAppShellData() { const { data: sessionUser } = useUser_default(); const qc = useQueryClient(); const backgroundCacheKey = (0, import_react40.useMemo)(() => { const email = (sessionUser?.email || "").toLowerCase(); return email ? `background:${email}` : null; }, [sessionUser?.email]); const cachedBackgroundData = (0, import_react40.useMemo)(() => { if (typeof window === "undefined" || !backgroundCacheKey) return void 0; try { const raw = window.localStorage.getItem(backgroundCacheKey); return raw ? JSON.parse(raw) : void 0; } catch (_) { return void 0; } }, [backgroundCacheKey]); const { data: profileData } = useQuery({ queryKey: ["profile", sessionUser?.email], queryFn: async () => { const res = await fetch("/api/profile"); if (!res.ok) throw new Error( `When fetching /api/profile, the response was [${res.status}] ${res.statusText}` ); return res.json(); }, enabled: !!sessionUser, // Use cached background preference as placeholder data placeholderData: cachedBackgroundData ? { profile: { background_preference: cachedBackgroundData.background_preference } } : void 0 }); (0, import_react40.useEffect)(() => { if (!backgroundCacheKey || !profileData?.profile?.background_preference) return; try { window.localStorage.setItem( backgroundCacheKey, JSON.stringify({ background_preference: profileData.profile.background_preference }) ); } catch (_) { } }, [backgroundCacheKey, profileData?.profile?.background_preference]); const isClient = (profileData?.profile?.role || "").toLowerCase() === "client"; const { tokenData, isLoading: tokensLoading } = useTokens_default(); const { data: notificationsData } = useQuery({ queryKey: ["notifications", sessionUser?.email], queryFn: async () => { const res = await fetch("/api/notifications"); if (!res.ok) throw new Error( `When fetching /api/notifications, the response was [${res.status}] ${res.statusText}` ); return res.json(); }, enabled: !!sessionUser && !isClient, staleTime: 60 * 1e3, refetchInterval: () => typeof document !== "undefined" && document.visibilityState === "visible" ? 60 * 1e3 : false // removed refetchOnWindowFocus to rely on global defaults }); return { sessionUser, profileData, isClient, tokenData, tokensLoading, notificationsData }; } // virtual:/apps/web/src/hooks/useGlobalSearch.js init_injected_globals(); var import_react41 = __toESM(require_react()); function useGlobalSearch({ sessionUser, isClient, isReceptionist, selectedStylist }) { const [search, setSearch] = (0, import_react41.useState)(""); const [showSearch, setShowSearch] = (0, import_react41.useState)(false); const [highlightIndex, setHighlightIndex] = (0, import_react41.useState)(0); const searchWrapRef = (0, import_react41.useRef)(null); (0, import_react41.useEffect)(() => { function onClick(e) { if (searchWrapRef.current && !searchWrapRef.current.contains(e.target)) { setShowSearch(false); } } document.addEventListener("mousedown", onClick); return () => document.removeEventListener("mousedown", onClick); }, []); const now2 = (0, import_react41.useMemo)(() => /* @__PURE__ */ new Date(), []); const rangeFrom = (0, import_react41.useMemo)( () => new Date(now2.getFullYear(), now2.getMonth(), 1).toISOString(), [now2] ); const rangeTo = (0, import_react41.useMemo)( () => new Date( now2.getFullYear(), now2.getMonth() + 1, 0, 23, 59, 59 ).toISOString(), [now2] ); const searchEnabled = !isClient && showSearch && search.trim().length >= 2 && !!sessionUser && (!isReceptionist || !!selectedStylist); const { data: clientsData } = useQuery({ queryKey: [ "clients", "for-search", sessionUser?.email, isReceptionist ? selectedStylist || "" : "", searchEnabled ? search.trim().toLowerCase() : "" ], queryFn: async () => { const base = isReceptionist && selectedStylist ? `/api/clients?stylist_email=${encodeURIComponent(selectedStylist)}` : "/api/clients"; const sep = base.includes("?") ? "&" : "?"; const url = `${base}${sep}q=${encodeURIComponent(search.trim())}&limit=25`; const res = await fetch(url); if (!res.ok) throw new Error( `When fetching ${url}, the response was [${res.status}] ${res.statusText}` ); return res.json(); }, enabled: searchEnabled, staleTime: 3e4 }); const { data: apptData } = useQuery({ queryKey: [ "appointments", "for-search", rangeFrom, rangeTo, sessionUser?.email, isReceptionist ? selectedStylist || "" : "" ], queryFn: async () => { const base = `/api/appointments?from=${encodeURIComponent(rangeFrom)}&to=${encodeURIComponent(rangeTo)}`; const url = isReceptionist && selectedStylist ? `${base}&stylist_email=${encodeURIComponent(selectedStylist)}` : base; const res = await fetch(url); if (!res.ok) throw new Error( `When fetching ${url}, the response was [${res.status}] ${res.statusText}` ); return res.json(); }, enabled: searchEnabled, staleTime: 15e3 }); const clients = clientsData?.clients || []; const appointments = apptData?.appointments || []; const clientById = (0, import_react41.useMemo)(() => { const m = /* @__PURE__ */ new Map(); for (const c of clients) m.set(c.id, c); return m; }, [clients]); const norm = (v) => v != null ? v.toString().toLowerCase() : ""; const onlyDigits = (v) => (v || "").replace(/\D+/g, ""); const filteredClients = (0, import_react41.useMemo)(() => { if (!searchEnabled) return []; return (clients || []).slice(0, 5); }, [clients, searchEnabled]); const filteredAppointments = (0, import_react41.useMemo)(() => { if (!searchEnabled) return []; const q = norm(search); const qDigits = onlyDigits(search); return appointments.filter((a) => { const c = clientById.get(a.client_id); const clientName = c ? `${c.first_name || ""} ${c.last_name || ""}`.trim() : ""; const svc = a.service_name_snapshot || ""; const status = a.status || ""; const phone = c?.phone || ""; return norm(clientName).includes(q) || norm(svc).includes(q) || norm(status).includes(q) || onlyDigits(phone).includes(qDigits); }).slice(0, 5); }, [appointments, clientById, search, searchEnabled]); const allResults = (0, import_react41.useMemo)(() => { const items = []; for (const c of filteredClients) items.push({ type: "client", item: c }); for (const a of filteredAppointments) items.push({ type: "appointment", item: a }); return items; }, [filteredClients, filteredAppointments]); (0, import_react41.useEffect)(() => { setHighlightIndex(0); }, [search, showSearch]); return { search, setSearch, showSearch, setShowSearch, highlightIndex, setHighlightIndex, searchWrapRef, searchEnabled, filteredClients, filteredAppointments, allResults, clientById }; } // virtual:/apps/web/src/hooks/useRouteGuards.js init_injected_globals(); var import_react42 = __toESM(require_react()); function useRouteGuards({ isClient, isReceptionist }) { (0, import_react42.useEffect)(() => { if (!isClient) return; if (typeof window === "undefined") return; const path = window.location.pathname; if (!path.startsWith("/portal")) { window.location.href = "/portal"; } }, [isClient]); (0, import_react42.useEffect)(() => { if (!isReceptionist) return; if (typeof window === "undefined") return; const path = window.location.pathname; const allowed = ["/", "/calendar", "/clients", "/ai-studio"]; const isAllowed = allowed.some((p) => { if (p === "/") return path === "/"; return path === p || path.startsWith(p + "/"); }); if (!isAllowed) { window.location.href = "/calendar"; } }, [isReceptionist]); } // virtual:/apps/web/src/hooks/useNotificationsDropdown.js init_injected_globals(); var import_react43 = __toESM(require_react()); function useNotificationsDropdown() { const [showNotifications, setShowNotifications] = (0, import_react43.useState)(false); const notificationRef = (0, import_react43.useRef)(null); (0, import_react43.useEffect)(() => { function onClick(e) { if (notificationRef.current && !notificationRef.current.contains(e.target)) { setShowNotifications(false); } } document.addEventListener("mousedown", onClick); return () => document.removeEventListener("mousedown", onClick); }, []); return { showNotifications, setShowNotifications, notificationRef }; } // virtual:/apps/web/src/hooks/useTermsAcceptance.js init_injected_globals(); var import_react44 = __toESM(require_react()); function useTermsAcceptance() { const [showModal, setShowModal] = (0, import_react44.useState)(false); const { data: user, loading: userLoading } = useUser_default(); const queryClient2 = useQueryClient(); const { data: termsStatus, isLoading: termsLoading, error: termsError } = useQuery({ queryKey: ["terms-status"], queryFn: async () => { const response = await fetch("/api/terms/accept"); if (!response.ok) { throw new Error("Failed to check terms status"); } return response.json(); }, enabled: !!user && !userLoading }); const acceptTermsMutation = useMutation({ mutationFn: async () => { const response = await fetch("/api/terms/accept", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ terms_version: "v1.0" }) }); if (!response.ok) { const error = await response.json(); throw new Error(error.message || "Failed to accept terms"); } return response.json(); }, onSuccess: () => { queryClient2.invalidateQueries({ queryKey: ["terms-status"] }); setShowModal(false); }, onError: (error) => { console.error("Failed to accept terms:", error); } }); (0, import_react44.useEffect)(() => { if (user && !userLoading && termsStatus && !termsLoading && !termsStatus.has_accepted_current_terms) { setShowModal(true); } else { setShowModal(false); } }, [user, userLoading, termsStatus, termsLoading]); const acceptTerms = async () => { try { await acceptTermsMutation.mutateAsync(); } catch (error) { throw error; } }; return { showModal, acceptTerms, isAccepting: acceptTermsMutation.isPending, acceptError: acceptTermsMutation.error?.message, needsAcceptance: termsStatus && !termsStatus.has_accepted_current_terms, termsStatus, isLoading: userLoading || termsLoading, error: termsError }; } // virtual:/apps/web/src/utils/navigationConfig.js init_injected_globals(); var import_lucide_react17 = __toESM(require_lucide_react()); var essentialsNavItems = [ { icon: import_lucide_react17.LayoutGrid, label: "Home", href: "/", tier: "essentials" }, { icon: import_lucide_react17.Calendar, label: "Calendar", href: "/calendar", tier: "essentials" }, { icon: import_lucide_react17.Users, label: "Clients", href: "/clients", tier: "essentials" }, { icon: import_lucide_react17.Scissors, label: "Services", href: "/services", tier: "essentials" }, { icon: import_lucide_react17.MessageCircle, label: "Messages", href: "/messages", tier: "essentials" }, { icon: import_lucide_react17.Sparkles, label: "AI Studio", href: "/ai-studio", tier: "essentials" } ]; var growthNavItems = [ { icon: import_lucide_react17.FileText, label: "Invoices", href: "/invoices", tier: "growth", locked: false }, { icon: import_lucide_react17.Package, label: "Products", href: "/products", tier: "growth", locked: false }, { icon: import_lucide_react17.Megaphone, label: "Outreach", href: "/outreach", tier: "growth", locked: false }, { icon: import_lucide_react17.CheckSquare, label: "Approvals", href: "/approvals", tier: "growth", locked: false } ]; var baseNavItems = [...essentialsNavItems, ...growthNavItems]; var clientNavItems = [ { icon: import_lucide_react17.Users, label: "Portal", href: "/portal" } ]; var receptionistNavItems = [...essentialsNavItems, ...growthNavItems]; function getNavigationItems({ isClient, isReceptionist, showAdmin }) { if (isClient) { return clientNavItems; } if (isReceptionist) { return receptionistNavItems; } if (showAdmin) { return [ ...essentialsNavItems.slice(0, 1), { icon: import_lucide_react17.MoreHorizontal, label: "Admin", href: "/admin" }, ...essentialsNavItems.slice(1), ...growthNavItems ]; } return baseNavItems; } function getGroupedNavigation({ isClient, isReceptionist, showAdmin }) { if (isClient) { return { essentials: clientNavItems, growth: [] }; } if (showAdmin) { return { essentials: [ ...essentialsNavItems.slice(0, 1), { icon: import_lucide_react17.MoreHorizontal, label: "Admin", href: "/admin" }, ...essentialsNavItems.slice(1) ], growth: growthNavItems }; } return { essentials: essentialsNavItems, growth: growthNavItems }; } // virtual:/apps/web/src/utils/backgroundThemes.js init_injected_globals(); var BACKGROUND_THEMES = { "midnight-elegance": { type: "gradient", name: "Midnight Elegance", gradient: "linear-gradient(135deg, #1a0b2e 0%, #2d1b69 50%, #0f0f23 100%)", preview: ["#1a0b2e", "#2d1b69", "#0f0f23"], description: "Deep purple with mystical undertones" }, "charcoal-sophistication": { type: "gradient", name: "Charcoal Sophistication", gradient: "linear-gradient(135deg, #1a1a1a 0%, #0a1929 50%, #000000 100%)", preview: ["#1a1a1a", "#0a1929", "#000000"], description: "Professional charcoal with navy accents" }, "rose-gold-luxury": { type: "gradient", name: "Rose Gold Luxury", gradient: "linear-gradient(135deg, #2d1b1b 0%, #3d1f3f 50%, #1a1a1a 100%)", preview: ["#2d1b1b", "#3d1f3f", "#1a1a1a"], description: "Warm burgundy with luxurious purple hints" }, "ocean-depths": { type: "gradient", name: "Ocean Depths", gradient: "linear-gradient(135deg, #0d3d3d 0%, #0a1f3d 50%, #000814 100%)", preview: ["#0d3d3d", "#0a1f3d", "#000814"], description: "Deep teal flowing into midnight blue" }, "forest-zen": { type: "gradient", name: "Forest Zen", gradient: "linear-gradient(135deg, #0d2818 0%, #0a2a2a 50%, #121212 100%)", preview: ["#0d2818", "#0a2a2a", "#121212"], description: "Calming forest green with charcoal depth" }, "velvet-night": { type: "gradient", name: "Velvet Night", gradient: "linear-gradient(135deg, #2b1b3d 0%, #1a0f2e 50%, #0a0a0a 100%)", preview: ["#2b1b3d", "#1a0f2e", "#0a0a0a"], description: "Rich plum transitioning to midnight" }, "copper-bronze": { type: "gradient", name: "Copper Bronze", gradient: "linear-gradient(135deg, #2d1f0f 0%, #3d2515 50%, #1a1210 100%)", preview: ["#2d1f0f", "#3d2515", "#1a1210"], description: "Warm copper with bronze undertones" }, "slate-storm": { type: "gradient", name: "Slate Storm", gradient: "linear-gradient(135deg, #1f1f2e 0%, #2a2a3d 50%, #0f0f18 100%)", preview: ["#1f1f2e", "#2a2a3d", "#0f0f18"], description: "Cool slate with stormy blue-grays" }, "soft-cream": { type: "gradient", name: "Soft Cream", gradient: "linear-gradient(135deg, #fef6e4 0%, #f9f0dc 50%, #f5e9d3 100%)", preview: ["#fef6e4", "#f9f0dc", "#f5e9d3"], description: "Warm cream with subtle beige tones" }, "pearl-white": { type: "gradient", name: "Pearl White", gradient: "linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #e9ecef 100%)", preview: ["#ffffff", "#f8f9fa", "#e9ecef"], description: "Clean white with pearl shimmer" }, "pastel-blush": { type: "gradient", name: "Pastel Blush", gradient: "linear-gradient(135deg, #fff5f7 0%, #ffe3e8 50%, #ffd4dd 100%)", preview: ["#fff5f7", "#ffe3e8", "#ffd4dd"], description: "Soft pink with delicate blush" }, "mint-fresh": { type: "gradient", name: "Mint Fresh", gradient: "linear-gradient(135deg, #f0fdf4 0%, #dcfce7 50%, #bbf7d0 100%)", preview: ["#f0fdf4", "#dcfce7", "#bbf7d0"], description: "Light mint with fresh green hints" }, "sky-breeze": { type: "gradient", name: "Sky Breeze", gradient: "linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 50%, #bae6fd 100%)", preview: ["#f0f9ff", "#e0f2fe", "#bae6fd"], description: "Airy blue like a clear sky" }, "lavender-dream": { type: "gradient", name: "Lavender Dream", gradient: "linear-gradient(135deg, #faf5ff 0%, #f3e8ff 50%, #e9d5ff 100%)", preview: ["#faf5ff", "#f3e8ff", "#e9d5ff"], description: "Gentle lavender with dreamy purple" }, "peach-glow": { type: "gradient", name: "Peach Glow", gradient: "linear-gradient(135deg, #fff7ed 0%, #ffedd5 50%, #fed7aa 100%)", preview: ["#fff7ed", "#ffedd5", "#fed7aa"], description: "Warm peach with golden glow" }, "champagne-rose": { type: "gradient", name: "Champagne Rose", gradient: "linear-gradient(135deg, #fdf2f8 0%, #fce7f3 50%, #fbcfe8 100%)", preview: ["#fdf2f8", "#fce7f3", "#fbcfe8"], description: "Elegant champagne with rose accents" } }; var BACKGROUND_IMAGES = { "modern-studio": { type: "image", name: "Modern Studio", url: "https://ucarecdn.com/cff09224-dfa4-42bf-82da-747009117570/-/format/auto/", description: "Contemporary salon with clean lines" }, "luxury-salon": { type: "image", name: "Luxury Salon", url: "https://ucarecdn.com/27b1f4c4-bc57-49fa-a872-bf77565c843c/-/format/auto/", description: "Elegant space with premium finishes" }, "industrial-chic": { type: "image", name: "Industrial Chic", url: "https://ucarecdn.com/fdf3d5c7-6330-4375-8885-8d3c2587d43b/-/format/auto/", description: "Urban loft style with exposed elements" }, "neon-vibes": { type: "image", name: "Neon Vibes", url: "https://ucarecdn.com/0fd429c1-5216-41fb-a8d8-f0e9da054670/-/format/auto/", description: "Vibrant atmosphere with neon accents" }, "contemporary-space": { type: "image", name: "Contemporary Space", url: "https://ucarecdn.com/05100503-d56b-4ee9-994a-eb9595ec899b/-/format/auto/", description: "Modern design with warm lighting" }, "natural-warmth": { type: "image", name: "Natural Warmth", url: "https://ucarecdn.com/d604ae99-0ae4-469f-a988-14d3063e96b4/-/format/auto/", description: "Organic textures with cozy ambiance" } }; var DEFAULT_BACKGROUND = { id: "slate-storm", type: "gradient" }; function getBackgroundStyle(backgroundPreference) { if (!backgroundPreference) { const defaultTheme = BACKGROUND_THEMES[DEFAULT_BACKGROUND.id]; return defaultTheme.gradient; } if (backgroundPreference.type === "gradient") { const theme = BACKGROUND_THEMES[backgroundPreference.id]; return theme ? theme.gradient : BACKGROUND_THEMES[DEFAULT_BACKGROUND.id].gradient; } else if (backgroundPreference.type === "image") { const image = BACKGROUND_IMAGES[backgroundPreference.id]; if (image) { return `url('${image.url}') center/cover, ${BACKGROUND_THEMES["slate-storm"].gradient}`; } return BACKGROUND_THEMES[DEFAULT_BACKGROUND.id].gradient; } return BACKGROUND_THEMES[DEFAULT_BACKGROUND.id].gradient; } // virtual:/apps/web/src/components/AppShell/Sidebar.jsx init_injected_globals(); var import_lucide_react19 = __toESM(require_lucide_react()); // virtual:/apps/web/src/components/AppShell/NavigationItems.jsx init_injected_globals(); var import_lucide_react18 = __toESM(require_lucide_react()); var import_react45 = __toESM(require_react()); function NavigationItems({ navItems, isClient, notificationsData, groupedNav, subscribedFeatures = [], onLockedFeatureClick, isAdmin = false }) { const [growthExpanded, setGrowthExpanded] = (0, import_react45.useState)(false); if (groupedNav) { return /* @__PURE__ */ React.createElement("nav", { className: "px-4 flex-1 overflow-y-auto" }, groupedNav.essentials.map((item) => /* @__PURE__ */ React.createElement( NavItem, { key: item.label, item, isClient, notificationsData, subscribedFeatures, onLockedClick: onLockedFeatureClick, isAdmin } )), groupedNav.growth.length > 0 && /* @__PURE__ */ React.createElement( "button", { onClick: () => setGrowthExpanded(!growthExpanded), className: "w-full mt-6 mb-3 px-4 flex items-center justify-between hover:opacity-70 transition-opacity" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "div", { className: "text-xs font-semibold uppercase tracking-wider text-left", style: { color: "var(--theme-tile-text-secondary)", fontFamily: "var(--theme-font-body)" } }, "Growth Tools" ), /* @__PURE__ */ React.createElement( "div", { className: "text-[10px] mt-0.5 text-left", style: { color: "var(--theme-tile-text-tertiary)" } }, "Scale your business" )), growthExpanded ? /* @__PURE__ */ React.createElement( import_lucide_react18.ChevronDown, { size: 16, style: { color: "var(--theme-tile-text-secondary)" } } ) : /* @__PURE__ */ React.createElement( import_lucide_react18.ChevronRight, { size: 16, style: { color: "var(--theme-tile-text-secondary)" } } ) ), growthExpanded && groupedNav.growth.map((item) => /* @__PURE__ */ React.createElement( NavItem, { key: item.label, item, isClient, notificationsData, isGrowth: true, subscribedFeatures, onLockedClick: onLockedFeatureClick, isAdmin } ))); } return /* @__PURE__ */ React.createElement("nav", { className: "px-4 flex-1 overflow-y-auto" }, navItems.map((item) => /* @__PURE__ */ React.createElement( NavItem, { key: item.label, item, isClient, notificationsData, subscribedFeatures, onLockedClick: onLockedFeatureClick, isAdmin } ))); } function NavItem({ item, isClient, notificationsData, isGrowth = false, subscribedFeatures = [], onLockedClick, isAdmin = false }) { const Icon = item.icon; const isActive = typeof window !== "undefined" && window.location.pathname === item.href; const isAdminItem = item.label === "Admin"; const isApprovals = item.label === "Approvals"; const isMessages = item.label === "Messages"; const featureNameMap = { Invoices: "invoices", Products: "products", Outreach: "outreach", Approvals: "approvals" }; const featureName = featureNameMap[item.label]; const isLocked = isGrowth && featureName && !subscribedFeatures.includes(featureName) && !isAdmin; const approvalsCount = !isClient ? Math.max( 0, Number(notificationsData?.pendingOrders || 0) + Number(notificationsData?.pendingAppointments || 0) ) : 0; const unreadMessagesCount = !isClient ? Math.max(0, Number(notificationsData?.unreadMessages || 0)) : 0; const baseStyle = { fontFamily: "var(--theme-font-body)" }; const activeStyle = { ...baseStyle, backgroundColor: "var(--theme-accent)", color: "var(--theme-btn-primary-text)", boxShadow: "var(--theme-tile-shadow)" }; const inactiveStyle = { ...baseStyle, color: "var(--theme-tile-text-primary)", backgroundColor: "transparent" }; const className = `flex items-center px-4 py-3 mb-1 rounded-full transition-all duration-200 ${isLocked ? "cursor-pointer" : ""}`; const hoverClass = !isActive ? "hover:opacity-80" : ""; const content = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Icon, { size: 20, className: "mr-3" }), /* @__PURE__ */ React.createElement("span", { className: `font-medium flex items-center gap-2 flex-1` }, item.label, isApprovals && approvalsCount > 0 && /* @__PURE__ */ React.createElement( "span", { className: "inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-bold rounded-full", style: { backgroundColor: "var(--theme-status-pending)", color: "var(--theme-btn-primary-text)" } }, approvalsCount > 99 ? "99+" : approvalsCount ), isMessages && unreadMessagesCount > 0 && /* @__PURE__ */ React.createElement( "span", { className: "inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-bold rounded-full", style: { backgroundColor: "var(--theme-status-pending)", color: "var(--theme-btn-primary-text)" } }, unreadMessagesCount > 99 ? "99+" : unreadMessagesCount )), isGrowth && !isLocked && /* @__PURE__ */ React.createElement( "span", { className: "text-[9px] px-2 py-0.5 rounded-full font-bold uppercase tracking-wide", style: { background: "linear-gradient(to right, var(--theme-accent), var(--theme-accent-hover))", color: "var(--theme-btn-primary-text)" } }, "Pro" ), isLocked && /* @__PURE__ */ React.createElement(import_lucide_react18.Lock, { size: 14, style: { color: "var(--theme-tile-text-tertiary)" } })); if (isLocked) { return /* @__PURE__ */ React.createElement( "button", { key: item.label, onClick: () => onLockedClick(featureName), className: `${className} ${hoverClass}`, style: inactiveStyle }, content ); } return /* @__PURE__ */ React.createElement( "a", { key: item.label, href: item.href, className: `${className} ${hoverClass}`, style: isActive ? activeStyle : inactiveStyle }, content ); } // virtual:/apps/web/src/components/AppShell/Sidebar.jsx function Sidebar({ sidebarOpen, setSidebarOpen, navItems, groupedNav, sessionUser, profileData, isClient, notificationsData, subscribedFeatures = [], onLockedFeatureClick, isAdmin = false }) { const getFirstName = (fullName) => { if (!fullName) return ""; return fullName.split(" ")[0]; }; return /* @__PURE__ */ React.createElement( "div", { className: `fixed lg:fixed inset-y-0 left-0 z-50 w-60 backdrop-blur-2xl border-r flex flex-col transform transition-transform duration-300 ease-in-out lg:translate-x-0 ${sidebarOpen ? "translate-x-0" : "-translate-x-full"}`, style: { backgroundColor: "var(--theme-bg-surface)", borderColor: "var(--theme-border)", color: "var(--theme-tile-text-primary)" } }, /* @__PURE__ */ React.createElement("div", { className: "p-8 flex items-center justify-between" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React.createElement( "img", { src: "https://ucarecdn.com/4027295a-cf77-4ca7-b294-afc2a3351f55/-/format/auto/", alt: "SilqueCRM", className: "w-8 h-8 mr-3 rounded" } ), /* @__PURE__ */ React.createElement( "span", { className: "text-xl font-bold", style: { fontFamily: "var(--theme-font-heading)" } }, "SilqueCRM" )), /* @__PURE__ */ React.createElement( "button", { onClick: () => setSidebarOpen(false), className: "lg:hidden p-2 rounded-lg hover:opacity-70 transition-opacity duration-200" }, /* @__PURE__ */ React.createElement(import_lucide_react19.X, { size: 20 }) )), /* @__PURE__ */ React.createElement( NavigationItems, { navItems, groupedNav, isClient, notificationsData, subscribedFeatures, onLockedFeatureClick, isAdmin } ), /* @__PURE__ */ React.createElement("div", { className: "p-4" }, sessionUser ? /* @__PURE__ */ React.createElement( "a", { href: isClient ? "/account/logout" : "/settings", className: "flex items-center p-3 rounded-xl hover:opacity-80 transition-opacity duration-200 border", style: { backgroundColor: "var(--theme-bg-hover)", borderColor: "var(--theme-border)" } }, /* @__PURE__ */ React.createElement( "img", { src: profileData?.profile?.profile_image_url || "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=40&h=40&fit=crop&crop=face", alt: "User", className: "w-10 h-10 rounded-full mr-3 object-cover" } ), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React.createElement( "div", { className: "font-semibold text-sm", style: { fontFamily: "var(--theme-font-body)" } }, getFirstName(profileData?.profile?.name) || getFirstName(sessionUser.name) || sessionUser.email ), /* @__PURE__ */ React.createElement( "div", { className: "text-xs", style: { color: "var(--theme-tile-text-secondary)", fontFamily: "var(--theme-font-body)" } }, isClient ? "Logout" : "Settings" )), /* @__PURE__ */ React.createElement( import_lucide_react19.ChevronDown, { size: 16, style: { color: "var(--theme-tile-text-tertiary)" } } ) ) : /* @__PURE__ */ React.createElement( "a", { href: "/account/signin", className: "flex items-center p-3 rounded-xl hover:opacity-80 transition-opacity duration-200 border", style: { backgroundColor: "var(--theme-bg-hover)", borderColor: "var(--theme-border)" } }, /* @__PURE__ */ React.createElement( "img", { src: "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=40&h=40&fit=crop&crop=face", alt: "User", className: "w-10 h-10 rounded-full mr-3" } ), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React.createElement( "div", { className: "font-semibold text-sm", style: { fontFamily: "var(--theme-font-body)" } }, "Sign in" ), /* @__PURE__ */ React.createElement( "div", { className: "text-xs", style: { color: "var(--theme-tile-text-secondary)", fontFamily: "var(--theme-font-body)" } }, "Access your account" )), /* @__PURE__ */ React.createElement( import_lucide_react19.ChevronDown, { size: 16, style: { color: "var(--theme-tile-text-tertiary)" } } ) )) ); } // virtual:/apps/web/src/components/AppShell/Header.jsx init_injected_globals(); var import_lucide_react22 = __toESM(require_lucide_react()); // virtual:/apps/web/src/components/AppShell/SearchBar.jsx init_injected_globals(); var import_lucide_react21 = __toESM(require_lucide_react()); // virtual:/apps/web/src/components/AppShell/SearchResults.jsx init_injected_globals(); var import_lucide_react20 = __toESM(require_lucide_react()); var fmtMD = (dStr) => { try { const d = new Date(dStr); const mm = `${d.getMonth() + 1}`.padStart(2, "0"); const dd = `${d.getDate()}`.padStart(2, "0"); return `${mm}/${dd}`; } catch { return "--/--"; } }; function SearchResults({ isReceptionist, selectedStylist, filteredClients, filteredAppointments, highlightIndex, setHighlightIndex, clientById }) { return /* @__PURE__ */ React.createElement( "div", { className: "absolute z-[9999] mt-2 w-full rounded-2xl backdrop-blur-xl border shadow-lg overflow-hidden", style: { backgroundColor: "var(--theme-bg-surface)", borderColor: "var(--theme-border)", boxShadow: "var(--theme-tile-shadow)" } }, isReceptionist && !selectedStylist ? /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 text-sm", style: { color: "var(--theme-text-secondary)", fontFamily: "var(--theme-font-body)" } }, "Select a stylist to search their clients." ) : filteredClients.length === 0 && filteredAppointments.length === 0 ? /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 text-sm", style: { color: "var(--theme-text-secondary)", fontFamily: "var(--theme-font-body)" } }, "No matches" ) : /* @__PURE__ */ React.createElement("div", { className: "max-h-80 overflow-auto" }, filteredClients.length > 0 && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-2 text-xs uppercase tracking-wide", style: { color: "var(--theme-text-tertiary)", fontFamily: "var(--theme-font-body)" } }, "Clients" ), filteredClients.map((c, idx) => { const name = `${c.first_name || ""} ${c.last_name || ""}`.trim() || "Unnamed"; const isActive = highlightIndex === idx; return /* @__PURE__ */ React.createElement( "a", { key: `c-${c.id}`, href: `/clients?clientId=${c.id}`, className: `flex items-center px-4 py-2 text-sm transition-opacity`, style: { backgroundColor: isActive ? "var(--theme-bg-hover)" : "transparent", color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" }, onMouseEnter: () => setHighlightIndex(idx) }, /* @__PURE__ */ React.createElement(import_lucide_react20.Users, { size: 16, className: "mr-2 opacity-70" }), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "font-medium" }, name), /* @__PURE__ */ React.createElement( "div", { className: "text-xs", style: { color: "var(--theme-text-secondary)" } }, c.email || "", " ", c.phone ? `\u2022 ${c.phone}` : "" )) ); })), filteredAppointments.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "pt-1" }, /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-2 text-xs uppercase tracking-wide", style: { color: "var(--theme-text-tertiary)", fontFamily: "var(--theme-font-body)" } }, "Appointments" ), filteredAppointments.map((a, aIdx) => { const idx = filteredClients.length + aIdx; const isActive = highlightIndex === idx; const c = clientById.get(a.client_id); const clientName = c ? `${c.first_name || ""} ${c.last_name || ""}`.trim() : "Client"; return /* @__PURE__ */ React.createElement( "a", { key: `a-${a.id}`, href: `/calendar?appointmentId=${a.id}`, className: `flex items-center px-4 py-2 text-sm transition-opacity`, style: { backgroundColor: isActive ? "var(--theme-bg-hover)" : "transparent", color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" }, onMouseEnter: () => setHighlightIndex(idx) }, /* @__PURE__ */ React.createElement(import_lucide_react20.Calendar, { size: 16, className: "mr-2 opacity-70" }), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "font-medium" }, clientName), /* @__PURE__ */ React.createElement( "div", { className: "text-xs", style: { color: "var(--theme-text-secondary)" } }, fmtMD(a.start_at), " \u2022", " ", a.service_name_snapshot || "Appointment", " \u2022 ", a.status )) ); }))) ); } // virtual:/apps/web/src/components/AppShell/SearchBar.jsx function SearchBar({ search, setSearch, showSearch, setShowSearch, searchWrapRef, onKeyDown, searchEnabled, isReceptionist, selectedStylist, filteredClients, filteredAppointments, allResults, highlightIndex, setHighlightIndex, clientById }) { return /* @__PURE__ */ React.createElement("div", { className: "flex-1 max-w-md mx-4 lg:mx-8", ref: searchWrapRef }, /* @__PURE__ */ React.createElement("div", { className: "relative z-[110]" }, /* @__PURE__ */ React.createElement( import_lucide_react21.Search, { className: "absolute left-3 lg:left-4 top-1/2 transform -translate-y-1/2", style: { color: "var(--theme-text-tertiary)" }, size: 20 } ), /* @__PURE__ */ React.createElement( "input", { type: "text", placeholder: "Search clients, appointments...", value: search, onChange: (e) => { setSearch(e.target.value); if (!showSearch) setShowSearch(true); }, onFocus: () => setShowSearch(true), onKeyDown, className: "w-full pl-10 lg:pl-12 pr-4 py-2 lg:py-3 text-sm lg:text-base border rounded-full focus:outline-none focus:ring-2 hover:opacity-90 transition-all duration-200", style: { backgroundColor: "var(--theme-bg-hover)", borderColor: showSearch ? "var(--theme-accent)" : "var(--theme-border)", color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" } } ), showSearch && search.trim().length >= 2 && /* @__PURE__ */ React.createElement( SearchResults, { isReceptionist, selectedStylist, filteredClients, filteredAppointments, allResults, highlightIndex, setHighlightIndex, clientById } ))); } // virtual:/apps/web/src/components/AppShell/NotificationsDropdown.jsx init_injected_globals(); function NotificationsDropdown({ notificationsData }) { return /* @__PURE__ */ React.createElement( "div", { className: "absolute right-0 mt-2 w-80 rounded-2xl backdrop-blur-xl border shadow-lg overflow-hidden z-[9999]", style: { backgroundColor: "var(--theme-bg-surface)", borderColor: "var(--theme-border)", boxShadow: "var(--theme-tile-shadow)" } }, /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 border-b", style: { borderColor: "var(--theme-border)" } }, /* @__PURE__ */ React.createElement( "h3", { className: "font-semibold", style: { color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-heading)" } }, "Pending Approvals (", notificationsData?.total || 0, ")" ) ), /* @__PURE__ */ React.createElement("div", { className: "max-h-96 overflow-auto" }, !notificationsData?.items?.length ? /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 text-sm", style: { color: "var(--theme-text-secondary)", fontFamily: "var(--theme-font-body)" } }, "No pending approvals" ) : /* @__PURE__ */ React.createElement( "div", { className: "divide-y", style: { borderColor: "var(--theme-border)" } }, notificationsData.items.map((item, idx) => /* @__PURE__ */ React.createElement( NotificationItem, { key: `${item.type}-${item.id}-${idx}`, item } )) )), /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 border-t", style: { borderColor: "var(--theme-border)" } }, /* @__PURE__ */ React.createElement( "a", { href: "/approvals", className: "text-sm hover:underline", style: { color: "var(--theme-accent)", fontFamily: "var(--theme-font-body)" } }, "View all approvals" ) ) ); } function NotificationItem({ item }) { const clientName = `${item.first_name || ""} ${item.last_name || ""}`.trim() || "Client"; if (item.type === "order") { const itemNames = Array.isArray(item.items) ? item.items.map((i) => i.item || i.name || "Item").slice(0, 2).join(", ") : "Products"; return /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 hover:opacity-80 transition-opacity", style: { backgroundColor: "transparent" } }, /* @__PURE__ */ React.createElement( "div", { className: "text-sm font-medium", style: { color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" } }, "New Product Order" ), /* @__PURE__ */ React.createElement( "div", { className: "text-xs", style: { color: "var(--theme-text-secondary)", fontFamily: "var(--theme-font-body)" } }, clientName, " \u2022 ", itemNames ) ); } if (item.type === "appointment") { return /* @__PURE__ */ React.createElement( "div", { className: "px-4 py-3 hover:opacity-80 transition-opacity", style: { backgroundColor: "transparent" } }, /* @__PURE__ */ React.createElement( "div", { className: "text-sm font-medium", style: { color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-body)" } }, "Appointment Change Request" ), /* @__PURE__ */ React.createElement( "div", { className: "text-xs", style: { color: "var(--theme-text-secondary)", fontFamily: "var(--theme-font-body)" } }, clientName, " \u2022 ", item.service_name_snapshot || "Appointment" ) ); } return null; } // virtual:/apps/web/src/components/AppShell/Header.jsx var import_react46 = __toESM(require_react()); function Header({ setSidebarOpen, isClient, isReceptionist, tokenLabel, // Keep for backwards compatibility but we'll override it notificationsData, showNotifications, setShowNotifications, notificationRef, searchProps }) { const [mounted, setMounted] = (0, import_react46.useState)(false); const [showGiftBanner, setShowGiftBanner] = (0, import_react46.useState)(false); const tokenDisplayRef = (0, import_react46.useRef)(null); const { getTokenLabel, refreshTokens, isLoading: tokenLoading } = useTokens_default(); (0, import_react46.useEffect)(() => { setMounted(true); if (typeof window === "undefined") return; if (tokenDisplayRef.current) { window.tokenDisplayRef = tokenDisplayRef.current; } tokenAnimator.setTokenChangeCallback(() => { console.log("\u{1FA99} Token animation completed, refreshing balance..."); refreshTokens(); }); try { const url = new URL(window.location.href); const gifted = url.searchParams.get("gifted") || url.searchParams.get("signup_gift"); if (gifted) { setShowGiftBanner(true); const t = setTimeout(() => setShowGiftBanner(false), 6e3); url.searchParams.delete("gifted"); url.searchParams.delete("signup_gift"); const qs = url.searchParams.toString(); const newUrl = `${url.pathname}${qs ? `?${qs}` : ""}${url.hash || ""}`; window.history.replaceState({}, "", newUrl); return () => clearTimeout(t); } } catch (_) { } }, [refreshTokens]); const displayTokenLabel = getTokenLabel(); return /* @__PURE__ */ import_react46.default.createElement( "header", { className: "relative z-[100] backdrop-blur-2xl border-b px-4 sm:px-6 lg:px-8 py-4 lg:py-6", style: { backgroundColor: "var(--theme-bg-surface)", borderColor: "var(--theme-border)", boxShadow: "var(--theme-tile-shadow)", color: "var(--theme-tile-text-primary)" } }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ import_react46.default.createElement( "button", { onClick: () => setSidebarOpen(true), className: "lg:hidden p-2 rounded-lg hover:opacity-70 transition-opacity duration-200" }, /* @__PURE__ */ import_react46.default.createElement(import_lucide_react22.Menu, { size: 20 }) ), /* @__PURE__ */ import_react46.default.createElement("div", { className: "hidden lg:block flex-1" }), !isClient && /* @__PURE__ */ import_react46.default.createElement(SearchBar, { ...searchProps }), /* @__PURE__ */ import_react46.default.createElement("div", { className: "flex items-center space-x-2 lg:space-x-6" }, /* @__PURE__ */ import_react46.default.createElement( "a", { href: "/tokens", ref: tokenDisplayRef, className: `px-3 py-2 lg:px-4 lg:py-2 rounded-full border-2 text-base lg:text-sm font-bold shadow-lg hover:scale-105 transition-all cursor-pointer ${tokenLoading ? "opacity-50" : ""}`, style: { backgroundColor: "var(--theme-bg-surface)", borderColor: "var(--theme-accent)", fontFamily: "var(--theme-font-body)" }, title: "View token balance and purchase more" }, tokenLoading ? "..." : `\u{1FA99} ${displayTokenLabel}` ), !isClient && !isReceptionist && /* @__PURE__ */ import_react46.default.createElement("div", { className: "relative", ref: notificationRef }, /* @__PURE__ */ import_react46.default.createElement( "button", { onClick: () => setShowNotifications((v) => !v), className: "p-2 lg:p-3 border rounded-full hover:opacity-80 transition-opacity duration-200", style: { backgroundColor: "var(--theme-bg-hover)", borderColor: "var(--theme-border)" } }, /* @__PURE__ */ import_react46.default.createElement(import_lucide_react22.Bell, { size: 16, className: "lg:hidden" }), /* @__PURE__ */ import_react46.default.createElement(import_lucide_react22.Bell, { size: 20, className: "hidden lg:block" }) ), !isClient && (notificationsData?.total || 0) > 0 && /* @__PURE__ */ import_react46.default.createElement("div", { className: "absolute -top-1 -right-1 w-2 h-2 lg:w-3 lg:h-3 bg-red-500 rounded-full" }), !isClient && showNotifications && /* @__PURE__ */ import_react46.default.createElement(NotificationsDropdown, { notificationsData })))), mounted && showGiftBanner && /* @__PURE__ */ import_react46.default.createElement("div", { className: "mt-3 flex items-center justify-center" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "px-4 py-2 rounded-full text-sm font-medium bg-green-600 text-white shadow" }, "You've been gifted 200 tokens \u2014 enjoy AI\u2011Studio!")) ); } // virtual:/apps/web/src/components/TermsAcceptanceModal.jsx init_injected_globals(); var import_react47 = __toESM(require_react()); var import_lucide_react23 = __toESM(require_lucide_react()); function TermsAcceptanceModal({ isOpen, onAccept, loading = false }) { const [hasRead, setHasRead] = (0, import_react47.useState)(false); const [acceptanceError, setAcceptanceError] = (0, import_react47.useState)(""); const overlayRef = (0, import_react47.useRef)(null); useModalA11y(overlayRef, { onClose: null, dismissible: false }); const handleAccept = async () => { if (!hasRead) { setAcceptanceError( "Please confirm that you have read the Terms of Service" ); return; } try { setAcceptanceError(""); await onAccept(); } catch (error) { setAcceptanceError("Failed to accept terms. Please try again."); } }; if (!isOpen) return null; return /* @__PURE__ */ import_react47.default.createElement( Modal, { isOpen, onClose: () => { }, dismissible: false, overlayClassName: "items-center", contentClassName: "w-full max-w-2xl mx-4" }, /* @__PURE__ */ import_react47.default.createElement( "div", { ref: overlayRef, className: "max-h-[90vh] rounded-2xl shadow-2xl border flex flex-col", style: { backgroundColor: "var(--theme-bg-surface)", borderColor: "var(--theme-border)", fontFamily: "var(--theme-font-body)" } }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "px-6 py-5 border-b flex items-center space-x-3", style: { borderColor: "var(--theme-border)" } }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "w-10 h-10 rounded-lg flex items-center justify-center", style: { backgroundColor: "var(--theme-accent)", opacity: 0.2 } }, /* @__PURE__ */ import_react47.default.createElement( import_lucide_react23.FileText, { className: "w-5 h-5", style: { color: "var(--theme-accent)" } } ) ), /* @__PURE__ */ import_react47.default.createElement("div", null, /* @__PURE__ */ import_react47.default.createElement( "h2", { className: "text-xl font-semibold", style: { color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-heading)" } }, "Updated Terms of Service" ), /* @__PURE__ */ import_react47.default.createElement( "p", { className: "text-sm", style: { color: "var(--theme-text-secondary)" } }, "Please review and accept our updated terms to continue" )) ), /* @__PURE__ */ import_react47.default.createElement("div", { className: "flex-1 px-6 py-4 overflow-y-auto" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react47.default.createElement(Alert, { variant: "warning", title: "Important Updates" }, "We've updated our Terms of Service to include important provisions about AI features, professional liability, and data protection. Please review these changes carefully.")), /* @__PURE__ */ import_react47.default.createElement("div", { className: "mb-6 space-y-4" }, /* @__PURE__ */ import_react47.default.createElement( "h3", { className: "text-lg font-medium flex items-center space-x-2", style: { color: "var(--theme-text-primary)" } }, /* @__PURE__ */ import_react47.default.createElement( import_lucide_react23.Shield, { className: "w-5 h-5", style: { color: "var(--theme-accent)" } } ), /* @__PURE__ */ import_react47.default.createElement("span", null, "Key Updates Include:") ), /* @__PURE__ */ import_react47.default.createElement( "ul", { className: "space-y-3 text-sm", style: { color: "var(--theme-text-secondary)" } }, /* @__PURE__ */ import_react47.default.createElement("li", { className: "flex items-start space-x-3" }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "w-1.5 h-1.5 rounded-full mt-2 flex-shrink-0", style: { backgroundColor: "var(--theme-accent)" } } ), /* @__PURE__ */ import_react47.default.createElement("span", null, /* @__PURE__ */ import_react47.default.createElement("strong", { style: { color: "var(--theme-text-primary)" } }, "AI Liability Provisions:"), " ", "Clear guidelines about AI-generated recommendations and professional responsibility")), /* @__PURE__ */ import_react47.default.createElement("li", { className: "flex items-start space-x-3" }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "w-1.5 h-1.5 rounded-full mt-2 flex-shrink-0", style: { backgroundColor: "var(--theme-accent)" } } ), /* @__PURE__ */ import_react47.default.createElement("span", null, /* @__PURE__ */ import_react47.default.createElement("strong", { style: { color: "var(--theme-text-primary)" } }, "Data Protection:"), " ", "Enhanced provisions for client data handling and consent management")), /* @__PURE__ */ import_react47.default.createElement("li", { className: "flex items-start space-x-3" }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "w-1.5 h-1.5 rounded-full mt-2 flex-shrink-0", style: { backgroundColor: "var(--theme-accent)" } } ), /* @__PURE__ */ import_react47.default.createElement("span", null, /* @__PURE__ */ import_react47.default.createElement("strong", { style: { color: "var(--theme-text-primary)" } }, "Professional Standards:"), " ", "Requirements for maintaining licenses and professional judgment")), /* @__PURE__ */ import_react47.default.createElement("li", { className: "flex items-start space-x-3" }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "w-1.5 h-1.5 rounded-full mt-2 flex-shrink-0", style: { backgroundColor: "var(--theme-accent)" } } ), /* @__PURE__ */ import_react47.default.createElement("span", null, /* @__PURE__ */ import_react47.default.createElement("strong", { style: { color: "var(--theme-text-primary)" } }, "Limitation of Liability:"), " ", "Updated liability limitations and indemnification terms")) )), /* @__PURE__ */ import_react47.default.createElement( "div", { className: "mb-6 p-4 rounded-lg", style: { backgroundColor: "var(--theme-bg-hover)" } }, /* @__PURE__ */ import_react47.default.createElement( "p", { className: "text-sm mb-3", style: { color: "var(--theme-text-secondary)" } }, "We strongly recommend reading the complete Terms of Service before accepting:" ), /* @__PURE__ */ import_react47.default.createElement( "a", { href: "/terms", target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center space-x-2 font-medium text-sm hover:opacity-80", style: { color: "var(--theme-accent)" } }, /* @__PURE__ */ import_react47.default.createElement(import_lucide_react23.FileText, { className: "w-4 h-4" }), /* @__PURE__ */ import_react47.default.createElement("span", null, "View Full Terms of Service"), /* @__PURE__ */ import_react47.default.createElement( "span", { className: "text-xs px-2 py-0.5 rounded", style: { backgroundColor: "var(--theme-accent)", color: "var(--theme-btn-primary-text)", opacity: 0.8 } }, "Opens in new tab" ) ) ), /* @__PURE__ */ import_react47.default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "flex items-start space-x-3" }, /* @__PURE__ */ import_react47.default.createElement( "input", { type: "checkbox", id: "terms-read-confirm", checked: hasRead, onChange: (e) => setHasRead(e.target.checked), className: "mt-1 h-4 w-4 rounded border focus:ring-offset-0", style: { borderColor: "var(--theme-border)", accentColor: "var(--theme-accent)" } } ), /* @__PURE__ */ import_react47.default.createElement( "label", { htmlFor: "terms-read-confirm", className: "text-sm leading-relaxed", style: { color: "var(--theme-text-primary)" } }, "I have read and understand the updated Terms of Service, including the provisions regarding AI features, professional liability, and data protection." )), acceptanceError && /* @__PURE__ */ import_react47.default.createElement(Alert, { variant: "error" }, acceptanceError))), /* @__PURE__ */ import_react47.default.createElement( "div", { className: "px-6 py-4 border-t flex items-center justify-between", style: { borderColor: "var(--theme-border)" } }, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "text-xs", style: { color: "var(--theme-text-tertiary)" } }, "Version 1.0 \u2022 Effective November 26, 2025" ), /* @__PURE__ */ import_react47.default.createElement("div", { className: "flex items-center space-x-3" }, /* @__PURE__ */ import_react47.default.createElement( "button", { type: "button", onClick: handleAccept, disabled: loading || !hasRead, className: "px-6 py-2.5 font-medium text-sm rounded-lg transition-colors duration-200 flex items-center space-x-2 disabled:opacity-50 disabled:cursor-not-allowed", style: { backgroundColor: "var(--theme-btn-primary-bg)", color: "var(--theme-btn-primary-text)" } }, loading ? /* @__PURE__ */ import_react47.default.createElement(import_react47.default.Fragment, null, /* @__PURE__ */ import_react47.default.createElement( "div", { className: "w-4 h-4 border-2 rounded-full animate-spin", style: { borderColor: "rgba(255, 255, 255, 0.3)", borderTopColor: "var(--theme-btn-primary-text)" } } ), /* @__PURE__ */ import_react47.default.createElement("span", null, "Accepting...")) : /* @__PURE__ */ import_react47.default.createElement(import_react47.default.Fragment, null, /* @__PURE__ */ import_react47.default.createElement(import_lucide_react23.Shield, { className: "w-4 h-4" }), /* @__PURE__ */ import_react47.default.createElement("span", null, "Accept Terms & Continue")) )) ) ) ); } // virtual:/apps/web/src/components/FeatureLockModal.jsx init_injected_globals(); var import_lucide_react24 = __toESM(require_lucide_react()); var import_react48 = __toESM(require_react()); var FEATURE_DETAILS = { invoices: { name: "Invoices Pro", tagline: "Professional invoicing made simple", price: "$19/month", benefits: [ "Create unlimited invoices", "Send via email & SMS", "Automatic payment tracking", "Professional PDF templates", "Client payment history", "Custom branding & logos" ], icon: "\u{1F4C4}" }, products: { name: "Products Pro", tagline: "Manage inventory & product sales", price: "$29/month", benefits: [ "Track unlimited products", "Manage inventory levels", "Product orders & approvals", "Supplier management", "Client purchase history", "Custom product catalogs" ], icon: "\u{1F4E6}" }, outreach: { name: "Outreach Pro", tagline: "Scale your marketing efforts", price: "$39/month", benefits: [ "Bulk email & SMS campaigns", "Client cohort targeting", "Template library", "Automated reminders", "Campaign analytics", "A/B testing tools" ], icon: "\u{1F4E2}" }, approvals: { name: "Approvals Pro", tagline: "Let clients request & approve", price: "$15/month", benefits: [ "Client self-service requests", "Appointment approvals", "Product order approvals", "Automated workflows", "Approval history tracking", "Email & SMS notifications" ], icon: "\u2705" } }; function FeatureLockModal({ featureName, onClose }) { const [loading, setLoading] = (0, import_react48.useState)(false); const [error, setError] = (0, import_react48.useState)(null); const feature = FEATURE_DETAILS[featureName]; if (!feature) { return null; } const handleUpgrade = async () => { setLoading(true); setError(null); try { const response = await fetch("/api/subscriptions/subscribe", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ featureName }) }); const data = await response.json(); if (!response.ok) { throw new Error(data.error || "Failed to start subscription"); } if (data.checkoutUrl) { window.location.href = data.checkoutUrl; } } catch (err) { console.error("Upgrade error:", err); setError(err.message); setLoading(false); } }; return /* @__PURE__ */ React.createElement( Modal, { isOpen: !!feature, onClose, dismissible: true, overlayClassName: "items-center", contentClassName: "w-full max-w-lg" }, /* @__PURE__ */ React.createElement( "div", { className: "rounded-2xl shadow-2xl max-w-lg w-full max-h-[90vh] overflow-y-auto", style: { backgroundColor: "var(--theme-bg-surface)", border: `1px solid var(--theme-border)`, fontFamily: "var(--theme-font-body)" }, onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React.createElement( "div", { className: "relative p-6 border-b", style: { borderColor: "var(--theme-border)" } }, /* @__PURE__ */ React.createElement( "button", { onClick: onClose, className: "absolute top-4 right-4 p-2 rounded-lg transition-colors", style: { color: "var(--theme-text-tertiary)" }, onMouseEnter: (e) => { e.currentTarget.style.backgroundColor = "var(--theme-bg-hover)"; }, onMouseLeave: (e) => { e.currentTarget.style.backgroundColor = "transparent"; } }, /* @__PURE__ */ React.createElement(import_lucide_react24.X, { size: 20 }) ), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "text-5xl" }, feature.icon), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "h2", { className: "text-2xl font-bold", style: { color: "var(--theme-text-primary)", fontFamily: "var(--theme-font-heading)" }, "data-modal-title": true }, feature.name ), /* @__PURE__ */ React.createElement( "p", { className: "mt-1", style: { color: "var(--theme-text-secondary)" } }, feature.tagline ))) ), /* @__PURE__ */ React.createElement( "div", { className: "p-6", style: { background: "linear-gradient(to bottom right, var(--theme-accent), var(--theme-accent-hover))", opacity: 0.9 } }, /* @__PURE__ */ React.createElement("div", { className: "flex items-baseline gap-2" }, /* @__PURE__ */ React.createElement( "span", { className: "text-4xl font-bold", style: { color: "var(--theme-btn-primary-text)" } }, feature.price.split("/")[0] ), /* @__PURE__ */ React.createElement( "span", { style: { color: "var(--theme-btn-primary-text)", opacity: 0.8 } }, "/month" )), /* @__PURE__ */ React.createElement( "p", { className: "text-sm mt-2", style: { color: "var(--theme-btn-primary-text)", opacity: 0.8 } }, "Cancel anytime \u2022 No long-term contracts" ) ), /* @__PURE__ */ React.createElement("div", { className: "p-6 space-y-3" }, /* @__PURE__ */ React.createElement( "h3", { className: "text-sm font-semibold uppercase tracking-wider", style: { color: "var(--theme-text-secondary)" } }, "What's included" ), feature.benefits.map((benefit, index) => /* @__PURE__ */ React.createElement("div", { key: index, className: "flex items-start gap-3" }, /* @__PURE__ */ React.createElement( import_lucide_react24.CheckCircle2, { size: 20, className: "flex-shrink-0 mt-0.5", style: { color: "var(--theme-status-confirmed)" } } ), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--theme-text-primary)" } }, benefit)))), error && /* @__PURE__ */ React.createElement("div", { className: "mx-6 mb-4" }, /* @__PURE__ */ React.createElement(Alert, { variant: "error", title: "Upgrade failed" }, error)), /* @__PURE__ */ React.createElement( "div", { className: "p-6 border-t flex gap-3", style: { borderColor: "var(--theme-border)" } }, /* @__PURE__ */ React.createElement( "button", { onClick: onClose, className: "flex-1 px-6 py-3 rounded-lg border font-medium transition-colors", style: { borderColor: "var(--theme-border)", color: "var(--theme-text-primary)" }, onMouseEnter: (e) => { e.currentTarget.style.backgroundColor = "var(--theme-bg-hover)"; }, onMouseLeave: (e) => { e.currentTarget.style.backgroundColor = "transparent"; } }, "Maybe Later" ), /* @__PURE__ */ React.createElement( "button", { onClick: handleUpgrade, disabled: loading, className: "flex-1 px-6 py-3 rounded-lg font-semibold transition-all shadow-lg hover:shadow-xl disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", style: { background: "linear-gradient(to right, var(--theme-accent), var(--theme-accent-hover))", color: "var(--theme-btn-primary-text)" } }, loading ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement( "div", { className: "w-4 h-4 border-2 rounded-full animate-spin", style: { borderColor: "rgba(255, 255, 255, 0.3)", borderTopColor: "var(--theme-btn-primary-text)" } } ), "Processing...") : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(import_lucide_react24.Sparkles, { size: 18 }), "Upgrade Now") ) ) ) ); } // virtual:/apps/web/src/components/AIChat.jsx init_injected_globals(); var import_react92 = __toESM(require_react()); // ../../../node_modules/motion/dist/es/motion/lib/react.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/index.mjs init_injected_globals(); var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1); var import_react58 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/LayoutGroupContext.mjs init_injected_globals(); var import_react49 = __toESM(require_react(), 1); var LayoutGroupContext = (0, import_react49.createContext)({}); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/use-constant.mjs init_injected_globals(); var import_react50 = __toESM(require_react(), 1); function useConstant(init) { const ref = (0, import_react50.useRef)(null); if (ref.current === null) { ref.current = init(); } return ref.current; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/use-isomorphic-effect.mjs init_injected_globals(); var import_react51 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/is-browser.mjs init_injected_globals(); var isBrowser = typeof window !== "undefined"; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/use-isomorphic-effect.mjs var useIsomorphicLayoutEffect = isBrowser ? import_react51.useLayoutEffect : import_react51.useEffect; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs init_injected_globals(); var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1); var React41 = __toESM(require_react(), 1); var import_react55 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/PresenceContext.mjs init_injected_globals(); var import_react52 = __toESM(require_react(), 1); var PresenceContext = /* @__PURE__ */ (0, import_react52.createContext)(null); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs init_injected_globals(); var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1); var React40 = __toESM(require_react(), 1); var import_react54 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/MotionConfigContext.mjs init_injected_globals(); var import_react53 = __toESM(require_react(), 1); var MotionConfigContext = (0, import_react53.createContext)({ transformPagePoint: (p) => p, isStatic: false, reducedMotion: "never" }); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs var PopChildMeasure = class extends React40.Component { getSnapshotBeforeUpdate(prevProps) { const element = this.props.childRef.current; if (element && prevProps.isPresent && !this.props.isPresent) { const parent = element.offsetParent; const parentWidth = parent instanceof HTMLElement ? parent.offsetWidth || 0 : 0; const size = this.props.sizeRef.current; size.height = element.offsetHeight || 0; size.width = element.offsetWidth || 0; size.top = element.offsetTop; size.left = element.offsetLeft; size.right = parentWidth - size.width - size.left; } return null; } /** * Required with getSnapshotBeforeUpdate to stop React complaining. */ componentDidUpdate() { } render() { return this.props.children; } }; function PopChild({ children, isPresent, anchorX }) { const id3 = (0, import_react54.useId)(); const ref = (0, import_react54.useRef)(null); const size = (0, import_react54.useRef)({ width: 0, height: 0, top: 0, left: 0, right: 0 }); const { nonce } = (0, import_react54.useContext)(MotionConfigContext); (0, import_react54.useInsertionEffect)(() => { const { width, height, top, left, right } = size.current; if (isPresent || !ref.current || !width || !height) return; const x = anchorX === "left" ? `left: ${left}` : `right: ${right}`; ref.current.dataset.motionPopId = id3; const style = document.createElement("style"); if (nonce) style.nonce = nonce; document.head.appendChild(style); if (style.sheet) { style.sheet.insertRule(` [data-motion-pop-id="${id3}"] { position: absolute !important; width: ${width}px !important; height: ${height}px !important; ${x}px !important; top: ${top}px !important; } `); } return () => { document.head.removeChild(style); }; }, [isPresent]); return (0, import_jsx_runtime3.jsx)(PopChildMeasure, { isPresent, childRef: ref, sizeRef: size, children: React40.cloneElement(children, { ref }) }); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs var PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, anchorX }) => { const presenceChildren = useConstant(newChildrenMap); const id3 = (0, import_react55.useId)(); let isReusedContext = true; let context = (0, import_react55.useMemo)(() => { isReusedContext = false; return { id: id3, initial, isPresent, custom, onExitComplete: (childId) => { presenceChildren.set(childId, true); for (const isComplete of presenceChildren.values()) { if (!isComplete) return; } onExitComplete && onExitComplete(); }, register: (childId) => { presenceChildren.set(childId, false); return () => presenceChildren.delete(childId); } }; }, [isPresent, presenceChildren, onExitComplete]); if (presenceAffectsLayout && isReusedContext) { context = { ...context }; } (0, import_react55.useMemo)(() => { presenceChildren.forEach((_, key) => presenceChildren.set(key, false)); }, [isPresent]); React41.useEffect(() => { !isPresent && !presenceChildren.size && onExitComplete && onExitComplete(); }, [isPresent]); if (mode === "popLayout") { children = (0, import_jsx_runtime4.jsx)(PopChild, { isPresent, anchorX, children }); } return (0, import_jsx_runtime4.jsx)(PresenceContext.Provider, { value: context, children }); }; function newChildrenMap() { return /* @__PURE__ */ new Map(); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/use-presence.mjs init_injected_globals(); var import_react56 = __toESM(require_react(), 1); function usePresence(subscribe = true) { const context = (0, import_react56.useContext)(PresenceContext); if (context === null) return [true, null]; const { isPresent, onExitComplete, register } = context; const id3 = (0, import_react56.useId)(); (0, import_react56.useEffect)(() => { if (subscribe) { return register(id3); } }, [subscribe]); const safeToRemove = (0, import_react56.useCallback)(() => subscribe && onExitComplete && onExitComplete(id3), [id3, onExitComplete, subscribe]); return !isPresent && onExitComplete ? [false, safeToRemove] : [true]; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/utils.mjs init_injected_globals(); var import_react57 = __toESM(require_react(), 1); var getChildKey = (child) => child.key || ""; function onlyElements(children) { const filtered = []; import_react57.Children.forEach(children, (child) => { if ((0, import_react57.isValidElement)(child)) filtered.push(child); }); return filtered; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/index.mjs var AnimatePresence = ({ children, custom, initial = true, onExitComplete, presenceAffectsLayout = true, mode = "sync", propagate = false, anchorX = "left" }) => { const [isParentPresent, safeToRemove] = usePresence(propagate); const presentChildren = (0, import_react58.useMemo)(() => onlyElements(children), [children]); const presentKeys = propagate && !isParentPresent ? [] : presentChildren.map(getChildKey); const isInitialRender = (0, import_react58.useRef)(true); const pendingPresentChildren = (0, import_react58.useRef)(presentChildren); const exitComplete = useConstant(() => /* @__PURE__ */ new Map()); const [diffedChildren, setDiffedChildren] = (0, import_react58.useState)(presentChildren); const [renderedChildren, setRenderedChildren] = (0, import_react58.useState)(presentChildren); useIsomorphicLayoutEffect(() => { isInitialRender.current = false; pendingPresentChildren.current = presentChildren; for (let i = 0; i < renderedChildren.length; i++) { const key = getChildKey(renderedChildren[i]); if (!presentKeys.includes(key)) { if (exitComplete.get(key) !== true) { exitComplete.set(key, false); } } else { exitComplete.delete(key); } } }, [renderedChildren, presentKeys.length, presentKeys.join("-")]); const exitingChildren = []; if (presentChildren !== diffedChildren) { let nextChildren = [...presentChildren]; for (let i = 0; i < renderedChildren.length; i++) { const child = renderedChildren[i]; const key = getChildKey(child); if (!presentKeys.includes(key)) { nextChildren.splice(i, 0, child); exitingChildren.push(child); } } if (mode === "wait" && exitingChildren.length) { nextChildren = exitingChildren; } setRenderedChildren(onlyElements(nextChildren)); setDiffedChildren(presentChildren); return null; } if (false) { console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`); } const { forceRender } = (0, import_react58.useContext)(LayoutGroupContext); return (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: renderedChildren.map((child) => { const key = getChildKey(child); const isPresent = propagate && !isParentPresent ? false : presentChildren === renderedChildren || presentKeys.includes(key); const onExit = () => { if (exitComplete.has(key)) { exitComplete.set(key, true); } else { return; } let isEveryExitComplete = true; exitComplete.forEach((isExitComplete) => { if (!isExitComplete) isEveryExitComplete = false; }); if (isEveryExitComplete) { forceRender?.(); setRenderedChildren(pendingPresentChildren.current); propagate && safeToRemove?.(); onExitComplete && onExitComplete(); } }; return (0, import_jsx_runtime5.jsx)(PresenceChild, { isPresent, initial: !isInitialRender.current || initial ? void 0 : false, custom, presenceAffectsLayout, mode, onExitComplete: isPresent ? void 0 : onExit, anchorX, children: child }, key); }) }); }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/frame.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/batcher.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/order.mjs init_injected_globals(); var stepsOrder = [ "read", // Read "resolveKeyframes", // Write/Read/Write/Read "update", // Compute "preRender", // Compute "render", // Write "postRender" // Compute ]; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/render-step.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/stats/buffer.mjs init_injected_globals(); var statsBuffer = { value: null, addProjectionMetrics: null }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/render-step.mjs function createRenderStep(runNextFrame, stepName) { let thisFrame = /* @__PURE__ */ new Set(); let nextFrame = /* @__PURE__ */ new Set(); let isProcessing = false; let flushNextFrame = false; const toKeepAlive = /* @__PURE__ */ new WeakSet(); let latestFrameData = { delta: 0, timestamp: 0, isProcessing: false }; let numCalls = 0; function triggerCallback(callback) { if (toKeepAlive.has(callback)) { step.schedule(callback); runNextFrame(); } numCalls++; callback(latestFrameData); } const step = { /** * Schedule a process to run on the next frame. */ schedule: (callback, keepAlive = false, immediate = false) => { const addToCurrentFrame = immediate && isProcessing; const queue = addToCurrentFrame ? thisFrame : nextFrame; if (keepAlive) toKeepAlive.add(callback); if (!queue.has(callback)) queue.add(callback); return callback; }, /** * Cancel the provided callback from running on the next frame. */ cancel: (callback) => { nextFrame.delete(callback); toKeepAlive.delete(callback); }, /** * Execute all schedule callbacks. */ process: (frameData2) => { latestFrameData = frameData2; if (isProcessing) { flushNextFrame = true; return; } isProcessing = true; [thisFrame, nextFrame] = [nextFrame, thisFrame]; thisFrame.forEach(triggerCallback); if (stepName && statsBuffer.value) { statsBuffer.value.frameloop[stepName].push(numCalls); } numCalls = 0; thisFrame.clear(); isProcessing = false; if (flushNextFrame) { flushNextFrame = false; step.process(frameData2); } } }; return step; } // ../../../node_modules/motion/dist/es/motion-utils/dist/es/global-config.mjs init_injected_globals(); var MotionGlobalConfig = { skipAnimations: false, useManualTiming: false }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/batcher.mjs var maxElapsed = 40; function createRenderBatcher(scheduleNextBatch, allowKeepAlive) { let runNextFrame = false; let useDefaultElapsed = true; const state = { delta: 0, timestamp: 0, isProcessing: false }; const flagRunNextFrame = () => runNextFrame = true; const steps = stepsOrder.reduce((acc, key) => { acc[key] = createRenderStep(flagRunNextFrame, allowKeepAlive ? key : void 0); return acc; }, {}); const { read, resolveKeyframes, update, preRender, render, postRender } = steps; const processBatch = () => { const timestamp = MotionGlobalConfig.useManualTiming ? state.timestamp : performance.now(); runNextFrame = false; if (!MotionGlobalConfig.useManualTiming) { state.delta = useDefaultElapsed ? 1e3 / 60 : Math.max(Math.min(timestamp - state.timestamp, maxElapsed), 1); } state.timestamp = timestamp; state.isProcessing = true; read.process(state); resolveKeyframes.process(state); update.process(state); preRender.process(state); render.process(state); postRender.process(state); state.isProcessing = false; if (runNextFrame && allowKeepAlive) { useDefaultElapsed = false; scheduleNextBatch(processBatch); } }; const wake = () => { runNextFrame = true; useDefaultElapsed = true; if (!state.isProcessing) { scheduleNextBatch(processBatch); } }; const schedule = stepsOrder.reduce((acc, key) => { const step = steps[key]; acc[key] = (process2, keepAlive = false, immediate = false) => { if (!runNextFrame) wake(); return step.schedule(process2, keepAlive, immediate); }; return acc; }, {}); const cancel = (process2) => { for (let i = 0; i < stepsOrder.length; i++) { steps[stepsOrder[i]].cancel(process2); } }; return { schedule, cancel, state, steps }; } // ../../../node_modules/motion/dist/es/motion-utils/dist/es/noop.mjs init_injected_globals(); var noop3 = /* @__NO_SIDE_EFFECTS__ */ (any) => any; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/frame.mjs var { schedule: frame, cancel: cancelFrame, state: frameData, steps: frameSteps } = /* @__PURE__ */ createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop3, true); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/LazyContext.mjs init_injected_globals(); var import_react59 = __toESM(require_react(), 1); var LazyContext = (0, import_react59.createContext)({ strict: false }); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/load-features.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/definitions.mjs init_injected_globals(); var featureProps = { animation: [ "animate", "variants", "whileHover", "whileTap", "exit", "whileInView", "whileFocus", "whileDrag" ], exit: ["exit"], drag: ["drag", "dragControls"], focus: ["whileFocus"], hover: ["whileHover", "onHoverStart", "onHoverEnd"], tap: ["whileTap", "onTap", "onTapStart", "onTapCancel"], pan: ["onPan", "onPanStart", "onPanSessionStart", "onPanEnd"], inView: ["whileInView", "onViewportEnter", "onViewportLeave"], layout: ["layout", "layoutId"] }; var featureDefinitions = {}; for (const key in featureProps) { featureDefinitions[key] = { isEnabled: (props) => featureProps[key].some((name) => !!props[name]) }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/load-features.mjs function loadFeatures(features) { for (const key in features) { featureDefinitions[key] = { ...featureDefinitions[key], ...features[key] }; } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/filter-props.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/valid-prop.mjs init_injected_globals(); var validMotionProps = /* @__PURE__ */ new Set([ "animate", "exit", "variants", "initial", "style", "values", "variants", "transition", "transformTemplate", "custom", "inherit", "onBeforeLayoutMeasure", "onAnimationStart", "onAnimationComplete", "onUpdate", "onDragStart", "onDrag", "onDragEnd", "onMeasureDragConstraints", "onDirectionLock", "onDragTransitionEnd", "_dragX", "_dragY", "onHoverStart", "onHoverEnd", "onViewportEnter", "onViewportLeave", "globalTapTarget", "ignoreStrict", "viewport" ]); function isValidMotionProp(key) { return key.startsWith("while") || key.startsWith("drag") && key !== "draggable" || key.startsWith("layout") || key.startsWith("onTap") || key.startsWith("onPan") || key.startsWith("onLayout") || validMotionProps.has(key); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/filter-props.mjs var shouldForward = (key) => !isValidMotionProp(key); function loadExternalIsValidProp(isValidProp) { if (!isValidProp) return; shouldForward = (key) => key.startsWith("on") ? !isValidMotionProp(key) : isValidProp(key); } try { loadExternalIsValidProp(require_is_prop_valid_browser_cjs().default); } catch { } function filterProps(props, isDom, forwardMotionProps) { const filteredProps = {}; for (const key in props) { if (key === "values" && typeof props.values === "object") continue; if (shouldForward(key) || forwardMotionProps === true && isValidMotionProp(key) || !isDom && !isValidMotionProp(key) || // If trying to use native HTML drag events, forward drag listeners props["draggable"] && key.startsWith("onDrag")) { filteredProps[key] = props[key]; } } return filteredProps; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/components/create-proxy.mjs init_injected_globals(); function createDOMMotionComponentProxy(componentFactory) { if (typeof Proxy === "undefined") { return componentFactory; } const componentCache = /* @__PURE__ */ new Map(); const deprecatedFactoryFunction = (...args) => { if (false) { warnOnce(false, "motion() is deprecated. Use motion.create() instead."); } return componentFactory(...args); }; return new Proxy(deprecatedFactoryFunction, { /** * Called when `motion` is referenced with a prop: `motion.div`, `motion.input` etc. * The prop name is passed through as `key` and we can use that to generate a `motion` * DOM component with that name. */ get: (_target, key) => { if (key === "create") return componentFactory; if (!componentCache.has(key)) { componentCache.set(key, componentFactory(key)); } return componentCache.get(key); } }); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/components/create-factory.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/index.mjs init_injected_globals(); var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1); var import_react65 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/MotionContext/index.mjs init_injected_globals(); var import_react60 = __toESM(require_react(), 1); var MotionContext = /* @__PURE__ */ (0, import_react60.createContext)({}); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/MotionContext/create.mjs init_injected_globals(); var import_react61 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/MotionContext/utils.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/is-controlling-variants.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/is-animation-controls.mjs init_injected_globals(); function isAnimationControls(v) { return v !== null && typeof v === "object" && typeof v.start === "function"; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/is-variant-label.mjs init_injected_globals(); function isVariantLabel(v) { return typeof v === "string" || Array.isArray(v); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/variant-props.mjs init_injected_globals(); var variantPriorityOrder = [ "animate", "whileInView", "whileFocus", "whileHover", "whileTap", "whileDrag", "exit" ]; var variantProps = ["initial", ...variantPriorityOrder]; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/is-controlling-variants.mjs function isControllingVariants(props) { return isAnimationControls(props.animate) || variantProps.some((name) => isVariantLabel(props[name])); } function isVariantNode(props) { return Boolean(isControllingVariants(props) || props.variants); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/MotionContext/utils.mjs function getCurrentTreeVariants(props, context) { if (isControllingVariants(props)) { const { initial, animate } = props; return { initial: initial === false || isVariantLabel(initial) ? initial : void 0, animate: isVariantLabel(animate) ? animate : void 0 }; } return props.inherit !== false ? context : {}; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/MotionContext/create.mjs function useCreateMotionContext(props) { const { initial, animate } = getCurrentTreeVariants(props, (0, import_react61.useContext)(MotionContext)); return (0, import_react61.useMemo)(() => ({ initial, animate }), [variantLabelsAsDependency(initial), variantLabelsAsDependency(animate)]); } function variantLabelsAsDependency(prop) { return Array.isArray(prop) ? prop.join(" ") : prop; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/symbol.mjs init_injected_globals(); var motionComponentSymbol = Symbol.for("motionComponentSymbol"); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/use-motion-ref.mjs init_injected_globals(); var import_react62 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/is-ref-object.mjs init_injected_globals(); function isRefObject(ref) { return ref && typeof ref === "object" && Object.prototype.hasOwnProperty.call(ref, "current"); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/use-motion-ref.mjs function useMotionRef(visualState, visualElement, externalRef) { return (0, import_react62.useCallback)( (instance) => { if (instance) { visualState.onMount && visualState.onMount(instance); } if (visualElement) { if (instance) { visualElement.mount(instance); } else { visualElement.unmount(); } } if (externalRef) { if (typeof externalRef === "function") { externalRef(instance); } else if (isRefObject(externalRef)) { externalRef.current = instance; } } }, /** * Only pass a new ref callback to React if we've received a visual element * factory. Otherwise we'll be mounting/remounting every time externalRef * or other dependencies change. */ [visualElement] ); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/use-visual-element.mjs init_injected_globals(); var import_react64 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/optimized-appear/data-id.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/camel-to-dash.mjs init_injected_globals(); var camelToDash = (str) => str.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/optimized-appear/data-id.mjs var optimizedAppearDataId = "framerAppearId"; var optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/context/SwitchLayoutGroupContext.mjs init_injected_globals(); var import_react63 = __toESM(require_react(), 1); var SwitchLayoutGroupContext = (0, import_react63.createContext)({}); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/microtask.mjs init_injected_globals(); var { schedule: microtask, cancel: cancelMicrotask } = /* @__PURE__ */ createRenderBatcher(queueMicrotask, false); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/use-visual-element.mjs function useVisualElement(Component3, visualState, props, createVisualElement, ProjectionNodeConstructor) { const { visualElement: parent } = (0, import_react64.useContext)(MotionContext); const lazyContext = (0, import_react64.useContext)(LazyContext); const presenceContext = (0, import_react64.useContext)(PresenceContext); const reducedMotionConfig = (0, import_react64.useContext)(MotionConfigContext).reducedMotion; const visualElementRef = (0, import_react64.useRef)(null); createVisualElement = createVisualElement || lazyContext.renderer; if (!visualElementRef.current && createVisualElement) { visualElementRef.current = createVisualElement(Component3, { visualState, parent, props, presenceContext, blockInitialAnimation: presenceContext ? presenceContext.initial === false : false, reducedMotionConfig }); } const visualElement = visualElementRef.current; const initialLayoutGroupConfig = (0, import_react64.useContext)(SwitchLayoutGroupContext); if (visualElement && !visualElement.projection && ProjectionNodeConstructor && (visualElement.type === "html" || visualElement.type === "svg")) { createProjectionNode(visualElementRef.current, props, ProjectionNodeConstructor, initialLayoutGroupConfig); } const isMounted = (0, import_react64.useRef)(false); (0, import_react64.useInsertionEffect)(() => { if (visualElement && isMounted.current) { visualElement.update(props, presenceContext); } }); const optimisedAppearId = props[optimizedAppearDataAttribute]; const wantsHandoff = (0, import_react64.useRef)(Boolean(optimisedAppearId) && !window.MotionHandoffIsComplete?.(optimisedAppearId) && window.MotionHasOptimisedAnimation?.(optimisedAppearId)); useIsomorphicLayoutEffect(() => { if (!visualElement) return; isMounted.current = true; window.MotionIsMounted = true; visualElement.updateFeatures(); microtask.render(visualElement.render); if (wantsHandoff.current && visualElement.animationState) { visualElement.animationState.animateChanges(); } }); (0, import_react64.useEffect)(() => { if (!visualElement) return; if (!wantsHandoff.current && visualElement.animationState) { visualElement.animationState.animateChanges(); } if (wantsHandoff.current) { queueMicrotask(() => { window.MotionHandoffMarkAsComplete?.(optimisedAppearId); }); wantsHandoff.current = false; } }); return visualElement; } function createProjectionNode(visualElement, props, ProjectionNodeConstructor, initialPromotionConfig) { const { layoutId, layout: layout2, drag: drag2, dragConstraints, layoutScroll, layoutRoot, layoutCrossfade } = props; visualElement.projection = new ProjectionNodeConstructor(visualElement.latestValues, props["data-framer-portal-id"] ? void 0 : getClosestProjectingNode(visualElement.parent)); visualElement.projection.setOptions({ layoutId, layout: layout2, alwaysMeasureLayout: Boolean(drag2) || dragConstraints && isRefObject(dragConstraints), visualElement, /** * TODO: Update options in an effect. This could be tricky as it'll be too late * to update by the time layout animations run. * We also need to fix this safeToRemove by linking it up to the one returned by usePresence, * ensuring it gets called if there's no potential layout animations. * */ animationType: typeof layout2 === "string" ? layout2 : "both", initialPromotionConfig, crossfade: layoutCrossfade, layoutScroll, layoutRoot }); } function getClosestProjectingNode(visualElement) { if (!visualElement) return void 0; return visualElement.options.allowProjection !== false ? visualElement.projection : getClosestProjectingNode(visualElement.parent); } // ../../../node_modules/motion/dist/es/motion-utils/dist/es/errors.mjs init_injected_globals(); var warning = () => { }; var invariant = () => { }; if (false) { warning = (check, message2) => { if (!check && typeof console !== "undefined") { console.warn(message2); } }; invariant = (check, message2) => { if (!check) { throw new Error(message2); } }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/index.mjs function createRendererMotionComponent({ preloadedFeatures, createVisualElement, useRender, useVisualState, Component: Component3 }) { preloadedFeatures && loadFeatures(preloadedFeatures); function MotionComponent(props, externalRef) { let MeasureLayout2; const configAndProps = { ...(0, import_react65.useContext)(MotionConfigContext), ...props, layoutId: useLayoutId(props) }; const { isStatic } = configAndProps; const context = useCreateMotionContext(props); const visualState = useVisualState(props, isStatic); if (!isStatic && isBrowser) { useStrictMode(configAndProps, preloadedFeatures); const layoutProjection = getProjectionFunctionality(configAndProps); MeasureLayout2 = layoutProjection.MeasureLayout; context.visualElement = useVisualElement(Component3, visualState, configAndProps, createVisualElement, layoutProjection.ProjectionNode); } return (0, import_jsx_runtime6.jsxs)(MotionContext.Provider, { value: context, children: [MeasureLayout2 && context.visualElement ? (0, import_jsx_runtime6.jsx)(MeasureLayout2, { visualElement: context.visualElement, ...configAndProps }) : null, useRender(Component3, props, useMotionRef(visualState, context.visualElement, externalRef), visualState, isStatic, context.visualElement)] }); } MotionComponent.displayName = `motion.${typeof Component3 === "string" ? Component3 : `create(${Component3.displayName ?? Component3.name ?? ""})`}`; const ForwardRefMotionComponent = (0, import_react65.forwardRef)(MotionComponent); ForwardRefMotionComponent[motionComponentSymbol] = Component3; return ForwardRefMotionComponent; } function useLayoutId({ layoutId }) { const layoutGroupId = (0, import_react65.useContext)(LayoutGroupContext).id; return layoutGroupId && layoutId !== void 0 ? layoutGroupId + "-" + layoutId : layoutId; } function useStrictMode(configAndProps, preloadedFeatures) { const isStrict = (0, import_react65.useContext)(LazyContext).strict; if (false) { const strictMessage = "You have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead."; configAndProps.ignoreStrict ? warning(false, strictMessage) : invariant(false, strictMessage); } } function getProjectionFunctionality(props) { const { drag: drag2, layout: layout2 } = featureDefinitions; if (!drag2 && !layout2) return {}; const combined = { ...drag2, ...layout2 }; return { MeasureLayout: drag2?.isEnabled(props) || layout2?.isEnabled(props) ? combined.MeasureLayout : void 0, ProjectionNode: combined.ProjectionNode }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/use-render.mjs init_injected_globals(); var import_react68 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/use-props.mjs init_injected_globals(); var import_react66 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/is-forced-motion-value.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/styles/scale-correction.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/is-css-variable.mjs init_injected_globals(); var checkStringStartsWith = (token) => (key) => typeof key === "string" && key.startsWith(token); var isCSSVariableName = /* @__PURE__ */ checkStringStartsWith("--"); var startsAsVariableToken = /* @__PURE__ */ checkStringStartsWith("var(--"); var isCSSVariableToken = (value) => { const startsWithToken = startsAsVariableToken(value); if (!startsWithToken) return false; return singleCssVariableRegex.test(value.split("/*")[0].trim()); }; var singleCssVariableRegex = /var$--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*$)*\))+\s*)\)$/iu; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/styles/scale-correction.mjs var scaleCorrectors = {}; function addScaleCorrector(correctors) { for (const key in correctors) { scaleCorrectors[key] = correctors[key]; if (isCSSVariableName(key)) { scaleCorrectors[key].isCSSVariable = true; } } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/keys-transform.mjs init_injected_globals(); var transformPropOrder = [ "transformPerspective", "x", "y", "z", "translateX", "translateY", "translateZ", "scale", "scaleX", "scaleY", "rotate", "rotateX", "rotateY", "rotateZ", "skew", "skewX", "skewY" ]; var transformProps = new Set(transformPropOrder); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/is-forced-motion-value.mjs function isForcedMotionValue(key, { layout: layout2, layoutId }) { return transformProps.has(key) || key.startsWith("origin") || (layout2 || layoutId !== void 0) && (!!scaleCorrectors[key] || key === "opacity"); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/utils/is-motion-value.mjs init_injected_globals(); var isMotionValue = (value) => Boolean(value && value.getVelocity); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/build-styles.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/get-as-type.mjs init_injected_globals(); var getValueAsType = (value, type) => { return type && typeof value === "number" ? type.transform(value) : value; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/number.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/numbers/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/clamp.mjs init_injected_globals(); var clamp = (min, max, v) => { if (v > max) return max; if (v < min) return min; return v; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/numbers/index.mjs var number = { test: (v) => typeof v === "number", parse: parseFloat, transform: (v) => v }; var alpha = { ...number, transform: (v) => clamp(0, 1, v) }; var scale = { ...number, default: 1 }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/numbers/units.mjs init_injected_globals(); var createUnitType = (unit) => ({ test: (v) => typeof v === "string" && v.endsWith(unit) && v.split(" ").length === 1, parse: parseFloat, transform: (v) => `${v}${unit}` }); var degrees = /* @__PURE__ */ createUnitType("deg"); var percent = /* @__PURE__ */ createUnitType("%"); var px = /* @__PURE__ */ createUnitType("px"); var vh = /* @__PURE__ */ createUnitType("vh"); var vw = /* @__PURE__ */ createUnitType("vw"); var progressPercentage = { ...percent, parse: (v) => percent.parse(v) / 100, transform: (v) => percent.transform(v * 100) }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/number-browser.mjs init_injected_globals(); var browserNumberValueTypes = { // Border props borderWidth: px, borderTopWidth: px, borderRightWidth: px, borderBottomWidth: px, borderLeftWidth: px, borderRadius: px, radius: px, borderTopLeftRadius: px, borderTopRightRadius: px, borderBottomRightRadius: px, borderBottomLeftRadius: px, // Positioning props width: px, maxWidth: px, height: px, maxHeight: px, top: px, right: px, bottom: px, left: px, // Spacing props padding: px, paddingTop: px, paddingRight: px, paddingBottom: px, paddingLeft: px, margin: px, marginTop: px, marginRight: px, marginBottom: px, marginLeft: px, // Misc backgroundPositionX: px, backgroundPositionY: px }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/transform.mjs init_injected_globals(); var transformValueTypes = { rotate: degrees, rotateX: degrees, rotateY: degrees, rotateZ: degrees, scale, scaleX: scale, scaleY: scale, scaleZ: scale, skew: degrees, skewX: degrees, skewY: degrees, distance: px, translateX: px, translateY: px, translateZ: px, x: px, y: px, z: px, perspective: px, transformPerspective: px, opacity: alpha, originX: progressPercentage, originY: progressPercentage, originZ: px }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/type-int.mjs init_injected_globals(); var int = { ...number, transform: Math.round }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/number.mjs var numberValueTypes = { ...browserNumberValueTypes, ...transformValueTypes, zIndex: int, size: px, // SVG fillOpacity: alpha, strokeOpacity: alpha, numOctaves: int }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/build-transform.mjs init_injected_globals(); var translateAlias = { x: "translateX", y: "translateY", z: "translateZ", transformPerspective: "perspective" }; var numTransforms = transformPropOrder.length; function buildTransform(latestValues, transform, transformTemplate) { let transformString = ""; let transformIsDefault = true; for (let i = 0; i < numTransforms; i++) { const key = transformPropOrder[i]; const value = latestValues[key]; if (value === void 0) continue; let valueIsDefault = true; if (typeof value === "number") { valueIsDefault = value === (key.startsWith("scale") ? 1 : 0); } else { valueIsDefault = parseFloat(value) === 0; } if (!valueIsDefault || transformTemplate) { const valueAsType = getValueAsType(value, numberValueTypes[key]); if (!valueIsDefault) { transformIsDefault = false; const transformName = translateAlias[key] || key; transformString += `${transformName}(${valueAsType}) `; } if (transformTemplate) { transform[key] = valueAsType; } } } transformString = transformString.trim(); if (transformTemplate) { transformString = transformTemplate(transform, transformIsDefault ? "" : transformString); } else if (transformIsDefault) { transformString = "none"; } return transformString; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/build-styles.mjs function buildHTMLStyles(state, latestValues, transformTemplate) { const { style, vars, transformOrigin } = state; let hasTransform2 = false; let hasTransformOrigin = false; for (const key in latestValues) { const value = latestValues[key]; if (transformProps.has(key)) { hasTransform2 = true; continue; } else if (isCSSVariableName(key)) { vars[key] = value; continue; } else { const valueAsType = getValueAsType(value, numberValueTypes[key]); if (key.startsWith("origin")) { hasTransformOrigin = true; transformOrigin[key] = valueAsType; } else { style[key] = valueAsType; } } } if (!latestValues.transform) { if (hasTransform2 || transformTemplate) { style.transform = buildTransform(latestValues, state.transform, transformTemplate); } else if (style.transform) { style.transform = "none"; } } if (hasTransformOrigin) { const { originX = "50%", originY = "50%", originZ = 0 } = transformOrigin; style.transformOrigin = `${originX} ${originY} ${originZ}`; } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/create-render-state.mjs init_injected_globals(); var createHtmlRenderState = () => ({ style: {}, transform: {}, transformOrigin: {}, vars: {} }); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/use-props.mjs function copyRawValuesOnly(target, source, props) { for (const key in source) { if (!isMotionValue(source[key]) && !isForcedMotionValue(key, props)) { target[key] = source[key]; } } } function useInitialMotionValues({ transformTemplate }, visualState) { return (0, import_react66.useMemo)(() => { const state = createHtmlRenderState(); buildHTMLStyles(state, visualState, transformTemplate); return Object.assign({}, state.vars, state.style); }, [visualState]); } function useStyle(props, visualState) { const styleProp = props.style || {}; const style = {}; copyRawValuesOnly(style, styleProp, props); Object.assign(style, useInitialMotionValues(props, visualState)); return style; } function useHTMLProps(props, visualState) { const htmlProps = {}; const style = useStyle(props, visualState); if (props.drag && props.dragListener !== false) { htmlProps.draggable = false; style.userSelect = style.WebkitUserSelect = style.WebkitTouchCallout = "none"; style.touchAction = props.drag === true ? "none" : `pan-${props.drag === "x" ? "y" : "x"}`; } if (props.tabIndex === void 0 && (props.onTap || props.onTapStart || props.whileTap)) { htmlProps.tabIndex = 0; } htmlProps.style = style; return htmlProps; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/lowercase-elements.mjs init_injected_globals(); var lowercaseSVGElements = [ "animate", "circle", "defs", "desc", "ellipse", "g", "image", "line", "filter", "marker", "mask", "metadata", "path", "pattern", "polygon", "polyline", "rect", "stop", "switch", "symbol", "svg", "text", "tspan", "use", "view" ]; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs function isSVGComponent(Component3) { if ( /** * If it's not a string, it's a custom React component. Currently we only support * HTML custom React components. */ typeof Component3 !== "string" || /** * If it contains a dash, the element is a custom HTML webcomponent. */ Component3.includes("-") ) { return false; } else if ( /** * If it's in our list of lowercase SVG tags, it's an SVG component */ lowercaseSVGElements.indexOf(Component3) > -1 || /** * If it contains a capital letter, it's an SVG component */ /[A-Z]/u.test(Component3) ) { return true; } return false; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/use-props.mjs init_injected_globals(); var import_react67 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/build-attrs.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/path.mjs init_injected_globals(); var dashKeys = { offset: "stroke-dashoffset", array: "stroke-dasharray" }; var camelKeys = { offset: "strokeDashoffset", array: "strokeDasharray" }; function buildSVGPath(attrs, length, spacing = 1, offset = 0, useDashCase = true) { attrs.pathLength = 1; const keys = useDashCase ? dashKeys : camelKeys; attrs[keys.offset] = px.transform(-offset); const pathLength = px.transform(length); const pathSpacing = px.transform(spacing); attrs[keys.array] = `${pathLength} ${pathSpacing}`; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/transform-origin.mjs init_injected_globals(); function calcOrigin(origin, offset, size) { return typeof origin === "string" ? origin : px.transform(offset + size * origin); } function calcSVGTransformOrigin(dimensions, originX, originY) { const pxOriginX = calcOrigin(originX, dimensions.x, dimensions.width); const pxOriginY = calcOrigin(originY, dimensions.y, dimensions.height); return `${pxOriginX} ${pxOriginY}`; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/build-attrs.mjs function buildSVGAttrs(state, { attrX, attrY, attrScale, originX, originY, pathLength, pathSpacing = 1, pathOffset = 0, // This is object creation, which we try to avoid per-frame. ...latest }, isSVGTag2, transformTemplate) { buildHTMLStyles(state, latest, transformTemplate); if (isSVGTag2) { if (state.style.viewBox) { state.attrs.viewBox = state.style.viewBox; } return; } state.attrs = state.style; state.style = {}; const { attrs, style, dimensions } = state; if (attrs.transform) { if (dimensions) style.transform = attrs.transform; delete attrs.transform; } if (dimensions && (originX !== void 0 || originY !== void 0 || style.transform)) { style.transformOrigin = calcSVGTransformOrigin(dimensions, originX !== void 0 ? originX : 0.5, originY !== void 0 ? originY : 0.5); } if (attrX !== void 0) attrs.x = attrX; if (attrY !== void 0) attrs.y = attrY; if (attrScale !== void 0) attrs.scale = attrScale; if (pathLength !== void 0) { buildSVGPath(attrs, pathLength, pathSpacing, pathOffset, false); } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/create-render-state.mjs init_injected_globals(); var createSvgRenderState = () => ({ ...createHtmlRenderState(), attrs: {} }); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/is-svg-tag.mjs init_injected_globals(); var isSVGTag = (tag) => typeof tag === "string" && tag.toLowerCase() === "svg"; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/use-props.mjs function useSVGProps(props, visualState, _isStatic, Component3) { const visualProps = (0, import_react67.useMemo)(() => { const state = createSvgRenderState(); buildSVGAttrs(state, visualState, isSVGTag(Component3), props.transformTemplate); return { ...state.attrs, style: { ...state.style } }; }, [visualState]); if (props.style) { const rawStyles = {}; copyRawValuesOnly(rawStyles, props.style, props); visualProps.style = { ...rawStyles, ...visualProps.style }; } return visualProps; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/use-render.mjs function createUseRender(forwardMotionProps = false) { const useRender = (Component3, props, ref, { latestValues }, isStatic) => { const useVisualProps = isSVGComponent(Component3) ? useSVGProps : useHTMLProps; const visualProps = useVisualProps(props, latestValues, isStatic, Component3); const filteredProps = filterProps(props, typeof Component3 === "string", forwardMotionProps); const elementProps = Component3 !== import_react68.Fragment ? { ...filteredProps, ...visualProps, ref } : {}; const { children } = props; const renderedChildren = (0, import_react68.useMemo)(() => isMotionValue(children) ? children.get() : children, [children]); return (0, import_react68.createElement)(Component3, { ...elementProps, children: renderedChildren }); }; return useRender; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/config-motion.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/use-visual-state.mjs init_injected_globals(); var import_react69 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/resolve-variants.mjs init_injected_globals(); function getValueState(visualElement) { const state = [{}, {}]; visualElement?.values.forEach((value, key) => { state[0][key] = value.get(); state[1][key] = value.getVelocity(); }); return state; } function resolveVariantFromProps(props, definition, custom, visualElement) { if (typeof definition === "function") { const [current, velocity] = getValueState(visualElement); definition = definition(custom !== void 0 ? custom : props.custom, current, velocity); } if (typeof definition === "string") { definition = props.variants && props.variants[definition]; } if (typeof definition === "function") { const [current, velocity] = getValueState(visualElement); definition = definition(custom !== void 0 ? custom : props.custom, current, velocity); } return definition; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/utils/resolve-motion-value.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/resolve-value.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/is-keyframes-target.mjs init_injected_globals(); var isKeyframesTarget = (v) => { return Array.isArray(v); }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/resolve-value.mjs var isCustomValue = (v) => { return Boolean(v && typeof v === "object" && v.mix && v.toValue); }; var resolveFinalValueInKeyframes = (v) => { return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/utils/resolve-motion-value.mjs function resolveMotionValue(value) { const unwrappedValue = isMotionValue(value) ? value.get() : value; return isCustomValue(unwrappedValue) ? unwrappedValue.toValue() : unwrappedValue; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/utils/use-visual-state.mjs function makeState({ scrapeMotionValuesFromProps: scrapeMotionValuesFromProps3, createRenderState, onUpdate }, props, context, presenceContext) { const state = { latestValues: makeLatestValues(props, context, presenceContext, scrapeMotionValuesFromProps3), renderState: createRenderState() }; if (onUpdate) { state.onMount = (instance) => onUpdate({ props, current: instance, ...state }); state.onUpdate = (visualElement) => onUpdate(visualElement); } return state; } var makeUseVisualState = (config) => (props, isStatic) => { const context = (0, import_react69.useContext)(MotionContext); const presenceContext = (0, import_react69.useContext)(PresenceContext); const make = () => makeState(config, props, context, presenceContext); return isStatic ? make() : useConstant(make); }; function makeLatestValues(props, context, presenceContext, scrapeMotionValues) { const values = {}; const motionValues = scrapeMotionValues(props, {}); for (const key in motionValues) { values[key] = resolveMotionValue(motionValues[key]); } let { initial, animate } = props; const isControllingVariants$1 = isControllingVariants(props); const isVariantNode$1 = isVariantNode(props); if (context && isVariantNode$1 && !isControllingVariants$1 && props.inherit !== false) { if (initial === void 0) initial = context.initial; if (animate === void 0) animate = context.animate; } let isInitialAnimationBlocked = presenceContext ? presenceContext.initial === false : false; isInitialAnimationBlocked = isInitialAnimationBlocked || initial === false; const variantToSet = isInitialAnimationBlocked ? animate : initial; if (variantToSet && typeof variantToSet !== "boolean" && !isAnimationControls(variantToSet)) { const list = Array.isArray(variantToSet) ? variantToSet : [variantToSet]; for (let i = 0; i < list.length; i++) { const resolved = resolveVariantFromProps(props, list[i]); if (resolved) { const { transitionEnd, transition, ...target } = resolved; for (const key in target) { let valueTarget = target[key]; if (Array.isArray(valueTarget)) { const index = isInitialAnimationBlocked ? valueTarget.length - 1 : 0; valueTarget = valueTarget[index]; } if (valueTarget !== null) { values[key] = valueTarget; } } for (const key in transitionEnd) { values[key] = transitionEnd[key]; } } } } return values; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs init_injected_globals(); function scrapeMotionValuesFromProps(props, prevProps, visualElement) { const { style } = props; const newValues = {}; for (const key in style) { if (isMotionValue(style[key]) || prevProps.style && isMotionValue(prevProps.style[key]) || isForcedMotionValue(key, props) || visualElement?.getValue(key)?.liveStyle !== void 0) { newValues[key] = style[key]; } } return newValues; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/config-motion.mjs var htmlMotionConfig = { useVisualState: makeUseVisualState({ scrapeMotionValuesFromProps, createRenderState: createHtmlRenderState }) }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/config-motion.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/measure.mjs init_injected_globals(); function updateSVGDimensions(instance, renderState) { try { renderState.dimensions = typeof instance.getBBox === "function" ? instance.getBBox() : instance.getBoundingClientRect(); } catch (e) { renderState.dimensions = { x: 0, y: 0, width: 0, height: 0 }; } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/render.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/render.mjs init_injected_globals(); function renderHTML(element, { style, vars }, styleProp, projection) { Object.assign(element.style, style, projection && projection.getProjectionStyles(styleProp)); for (const key in vars) { element.style.setProperty(key, vars[key]); } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/camel-case-attrs.mjs init_injected_globals(); var camelCaseAttributes = /* @__PURE__ */ new Set([ "baseFrequency", "diffuseConstant", "kernelMatrix", "kernelUnitLength", "keySplines", "keyTimes", "limitingConeAngle", "markerHeight", "markerWidth", "numOctaves", "targetX", "targetY", "surfaceScale", "specularConstant", "specularExponent", "stdDeviation", "tableValues", "viewBox", "gradientTransform", "pathLength", "startOffset", "textLength", "lengthAdjust" ]); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/render.mjs function renderSVG(element, renderState, _styleProp, projection) { renderHTML(element, renderState, void 0, projection); for (const key in renderState.attrs) { element.setAttribute(!camelCaseAttributes.has(key) ? camelToDash(key) : key, renderState.attrs[key]); } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/utils/scrape-motion-values.mjs init_injected_globals(); function scrapeMotionValuesFromProps2(props, prevProps, visualElement) { const newValues = scrapeMotionValuesFromProps(props, prevProps, visualElement); for (const key in props) { if (isMotionValue(props[key]) || isMotionValue(prevProps[key])) { const targetKey = transformPropOrder.indexOf(key) !== -1 ? "attr" + key.charAt(0).toUpperCase() + key.substring(1) : key; newValues[targetKey] = props[key]; } } return newValues; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/svg/config-motion.mjs var layoutProps = ["x", "y", "width", "height", "cx", "cy", "r"]; var svgMotionConfig = { useVisualState: makeUseVisualState({ scrapeMotionValuesFromProps: scrapeMotionValuesFromProps2, createRenderState: createSvgRenderState, onUpdate: ({ props, prevProps, current, renderState, latestValues }) => { if (!current) return; let hasTransform2 = !!props.drag; if (!hasTransform2) { for (const key in latestValues) { if (transformProps.has(key)) { hasTransform2 = true; break; } } } if (!hasTransform2) return; let needsMeasure = !prevProps; if (prevProps) { for (let i = 0; i < layoutProps.length; i++) { const key = layoutProps[i]; if (props[key] !== prevProps[key]) { needsMeasure = true; } } } if (!needsMeasure) return; frame.read(() => { updateSVGDimensions(current, renderState); frame.render(() => { buildSVGAttrs(renderState, latestValues, isSVGTag(current.tagName), props.transformTemplate); renderSVG(current, renderState); }); }); } }) }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/components/create-factory.mjs function createMotionComponentFactory(preloadedFeatures, createVisualElement) { return function createMotionComponent2(Component3, { forwardMotionProps } = { forwardMotionProps: false }) { const baseConfig = isSVGComponent(Component3) ? svgMotionConfig : htmlMotionConfig; const config = { ...baseConfig, preloadedFeatures, useRender: createUseRender(forwardMotionProps), createVisualElement, Component: Component3 }; return createRendererMotionComponent(config); }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/components/motion/proxy.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/components/motion/create.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/animations.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/animation/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/animation-state.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/visual-element.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/resolve-dynamic-variants.mjs init_injected_globals(); function resolveVariant(visualElement, definition, custom) { const props = visualElement.getProps(); return resolveVariantFromProps(props, definition, custom !== void 0 ? custom : props.custom, visualElement); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/keys-position.mjs init_injected_globals(); var positionalKeys = /* @__PURE__ */ new Set([ "width", "height", "top", "left", "right", "bottom", ...transformPropOrder ]); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/setters.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/value/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/frameloop/sync-time.mjs init_injected_globals(); var now; function clearTime() { now = void 0; } var time = { now: () => { if (now === void 0) { time.set(frameData.isProcessing || MotionGlobalConfig.useManualTiming ? frameData.timestamp : performance.now()); } return now; }, set: (newTime) => { now = newTime; queueMicrotask(clearTime); } }; // ../../../node_modules/motion/dist/es/motion-utils/dist/es/subscription-manager.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-utils/dist/es/array.mjs init_injected_globals(); function addUniqueItem(arr, item) { if (arr.indexOf(item) === -1) arr.push(item); } function removeItem(arr, item) { const index = arr.indexOf(item); if (index > -1) arr.splice(index, 1); } // ../../../node_modules/motion/dist/es/motion-utils/dist/es/subscription-manager.mjs var SubscriptionManager = class { constructor() { this.subscriptions = []; } add(handler) { addUniqueItem(this.subscriptions, handler); return () => removeItem(this.subscriptions, handler); } notify(a, b, c) { const numSubscriptions = this.subscriptions.length; if (!numSubscriptions) return; if (numSubscriptions === 1) { this.subscriptions[0](a, b, c); } else { for (let i = 0; i < numSubscriptions; i++) { const handler = this.subscriptions[i]; handler && handler(a, b, c); } } } getSize() { return this.subscriptions.length; } clear() { this.subscriptions.length = 0; } }; // ../../../node_modules/motion/dist/es/motion-utils/dist/es/velocity-per-second.mjs init_injected_globals(); function velocityPerSecond(velocity, frameDuration) { return frameDuration ? velocity * (1e3 / frameDuration) : 0; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/value/index.mjs var MAX_VELOCITY_DELTA = 30; var isFloat = (value) => { return !isNaN(parseFloat(value)); }; var collectMotionValues = { current: void 0 }; var MotionValue = class { /** * @param init - The initiating value * @param config - Optional configuration options * * - `transformer`: A function to transform incoming values with. */ constructor(init, options = {}) { this.version = "12.7.4"; this.canTrackVelocity = null; this.events = {}; this.updateAndNotify = (v, render = true) => { const currentTime = time.now(); if (this.updatedAt !== currentTime) { this.setPrevFrameValue(); } this.prev = this.current; this.setCurrent(v); if (this.current !== this.prev && this.events.change) { this.events.change.notify(this.current); } if (render && this.events.renderRequest) { this.events.renderRequest.notify(this.current); } }; this.hasAnimated = false; this.setCurrent(init); this.owner = options.owner; } setCurrent(current) { this.current = current; this.updatedAt = time.now(); if (this.canTrackVelocity === null && current !== void 0) { this.canTrackVelocity = isFloat(this.current); } } setPrevFrameValue(prevFrameValue = this.current) { this.prevFrameValue = prevFrameValue; this.prevUpdatedAt = this.updatedAt; } /** * Adds a function that will be notified when the `MotionValue` is updated. * * It returns a function that, when called, will cancel the subscription. * * When calling `onChange` inside a React component, it should be wrapped with the * `useEffect` hook. As it returns an unsubscribe function, this should be returned * from the `useEffect` function to ensure you don't add duplicate subscribers.. * * ```jsx * export const MyComponent = () => { * const x = useMotionValue(0) * const y = useMotionValue(0) * const opacity = useMotionValue(1) * * useEffect(() => { * function updateOpacity() { * const maxXY = Math.max(x.get(), y.get()) * const newOpacity = transform(maxXY, [0, 100], [1, 0]) * opacity.set(newOpacity) * } * * const unsubscribeX = x.on("change", updateOpacity) * const unsubscribeY = y.on("change", updateOpacity) * * return () => { * unsubscribeX() * unsubscribeY() * } * }, []) * * return * } * ``` * * @param subscriber - A function that receives the latest value. * @returns A function that, when called, will cancel this subscription. * * @deprecated */ onChange(subscription) { if (false) { warnOnce(false, `value.onChange(callback) is deprecated. Switch to value.on("change", callback).`); } return this.on("change", subscription); } on(eventName, callback) { if (!this.events[eventName]) { this.events[eventName] = new SubscriptionManager(); } const unsubscribe = this.events[eventName].add(callback); if (eventName === "change") { return () => { unsubscribe(); frame.read(() => { if (!this.events.change.getSize()) { this.stop(); } }); }; } return unsubscribe; } clearListeners() { for (const eventManagers in this.events) { this.events[eventManagers].clear(); } } /** * Attaches a passive effect to the `MotionValue`. */ attach(passiveEffect, stopPassiveEffect) { this.passiveEffect = passiveEffect; this.stopPassiveEffect = stopPassiveEffect; } /** * Sets the state of the `MotionValue`. * * @remarks * * ```jsx * const x = useMotionValue(0) * x.set(10) * ``` * * @param latest - Latest value to set. * @param render - Whether to notify render subscribers. Defaults to `true` * * @public */ set(v, render = true) { if (!render || !this.passiveEffect) { this.updateAndNotify(v, render); } else { this.passiveEffect(v, this.updateAndNotify); } } setWithVelocity(prev, current, delta) { this.set(current); this.prev = void 0; this.prevFrameValue = prev; this.prevUpdatedAt = this.updatedAt - delta; } /** * Set the state of the `MotionValue`, stopping any active animations, * effects, and resets velocity to `0`. */ jump(v, endAnimation = true) { this.updateAndNotify(v); this.prev = v; this.prevUpdatedAt = this.prevFrameValue = void 0; endAnimation && this.stop(); if (this.stopPassiveEffect) this.stopPassiveEffect(); } /** * Returns the latest state of `MotionValue` * * @returns - The latest state of `MotionValue` * * @public */ get() { if (collectMotionValues.current) { collectMotionValues.current.push(this); } return this.current; } /** * @public */ getPrevious() { return this.prev; } /** * Returns the latest velocity of `MotionValue` * * @returns - The latest velocity of `MotionValue`. Returns `0` if the state is non-numerical. * * @public */ getVelocity() { const currentTime = time.now(); if (!this.canTrackVelocity || this.prevFrameValue === void 0 || currentTime - this.updatedAt > MAX_VELOCITY_DELTA) { return 0; } const delta = Math.min(this.updatedAt - this.prevUpdatedAt, MAX_VELOCITY_DELTA); return velocityPerSecond(parseFloat(this.current) - parseFloat(this.prevFrameValue), delta); } /** * Registers a new animation to control this `MotionValue`. Only one * animation can drive a `MotionValue` at one time. * * ```jsx * value.start() * ``` * * @param animation - A function that starts the provided animation */ start(startAnimation) { this.stop(); return new Promise((resolve) => { this.hasAnimated = true; this.animation = startAnimation(resolve); if (this.events.animationStart) { this.events.animationStart.notify(); } }).then(() => { if (this.events.animationComplete) { this.events.animationComplete.notify(); } this.clearAnimation(); }); } /** * Stop the currently active animation. * * @public */ stop() { if (this.animation) { this.animation.stop(); if (this.events.animationCancel) { this.events.animationCancel.notify(); } } this.clearAnimation(); } /** * Returns `true` if this value is currently animating. * * @public */ isAnimating() { return !!this.animation; } clearAnimation() { delete this.animation; } /** * Destroy and clean up subscribers to this `MotionValue`. * * The `MotionValue` hooks like `useMotionValue` and `useTransform` automatically * handle the lifecycle of the returned `MotionValue`, so this method is only necessary if you've manually * created a `MotionValue` via the `motionValue` function. * * @public */ destroy() { this.clearListeners(); this.stop(); if (this.stopPassiveEffect) { this.stopPassiveEffect(); } } }; function motionValue(init, options) { return new MotionValue(init, options); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/setters.mjs function setMotionValue(visualElement, key, value) { if (visualElement.hasValue(key)) { visualElement.getValue(key).set(value); } else { visualElement.addValue(key, motionValue(value)); } } function setTarget(visualElement, definition) { const resolved = resolveVariant(visualElement, definition); let { transitionEnd = {}, transition = {}, ...target } = resolved || {}; target = { ...target, ...transitionEnd }; for (const key in target) { const value = resolveFinalValueInKeyframes(target[key]); setMotionValue(visualElement, key, value); } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/use-will-change/add-will-change.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/use-will-change/is.mjs init_injected_globals(); function isWillChangeMotionValue(value) { return Boolean(isMotionValue(value) && value.add); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/use-will-change/add-will-change.mjs function addValueToWillChange(visualElement, key) { const willChange = visualElement.getValue("willChange"); if (isWillChangeMotionValue(willChange)) { return willChange.add(key); } else if (!willChange && MotionGlobalConfig.WillChange) { const newWillChange = new MotionGlobalConfig.WillChange("auto"); visualElement.addValue("willChange", newWillChange); newWillChange.add(key); } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/optimized-appear/get-appear-id.mjs init_injected_globals(); function getOptimisedAppearId(visualElement) { return visualElement.props[optimizedAppearDataAttribute]; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/motion-value.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/use-instant-transition-state.mjs init_injected_globals(); var instantAnimationState = { current: false }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/anticipate.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/back.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/cubic-bezier.mjs init_injected_globals(); var calcBezier = (t, a1, a2) => (((1 - 3 * a2 + 3 * a1) * t + (3 * a2 - 6 * a1)) * t + 3 * a1) * t; var subdivisionPrecision = 1e-7; var subdivisionMaxIterations = 12; function binarySubdivide(x, lowerBound, upperBound, mX1, mX2) { let currentX; let currentT; let i = 0; do { currentT = lowerBound + (upperBound - lowerBound) / 2; currentX = calcBezier(currentT, mX1, mX2) - x; if (currentX > 0) { upperBound = currentT; } else { lowerBound = currentT; } } while (Math.abs(currentX) > subdivisionPrecision && ++i < subdivisionMaxIterations); return currentT; } function cubicBezier(mX1, mY1, mX2, mY2) { if (mX1 === mY1 && mX2 === mY2) return noop3; const getTForX = (aX) => binarySubdivide(aX, 0, 1, mX1, mX2); return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/modifiers/mirror.mjs init_injected_globals(); var mirrorEasing = (easing) => (p) => p <= 0.5 ? easing(2 * p) / 2 : (2 - easing(2 * (1 - p))) / 2; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/modifiers/reverse.mjs init_injected_globals(); var reverseEasing = (easing) => (p) => 1 - easing(1 - p); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/back.mjs var backOut = /* @__PURE__ */ cubicBezier(0.33, 1.53, 0.69, 0.99); var backIn = /* @__PURE__ */ reverseEasing(backOut); var backInOut = /* @__PURE__ */ mirrorEasing(backIn); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/anticipate.mjs var anticipate = (p) => (p *= 2) < 1 ? 0.5 * backIn(p) : 0.5 * (2 - Math.pow(2, -10 * (p - 1))); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/circ.mjs init_injected_globals(); var circIn = (p) => 1 - Math.sin(Math.acos(p)); var circOut = reverseEasing(circIn); var circInOut = mirrorEasing(circIn); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/is-none.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/is-zero-value-string.mjs init_injected_globals(); var isZeroValueString = (v) => /^0[^.\s]+$/u.test(v); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/is-none.mjs function isNone(value) { if (typeof value === "number") { return value === 0; } else if (value !== null) { return value === "none" || value === "0" || isZeroValueString(value); } else { return true; } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/complex/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/hex.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/rgba.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/utils/sanitize.mjs init_injected_globals(); var sanitize = (v) => Math.round(v * 1e5) / 1e5; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/utils.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/utils/float-regex.mjs init_injected_globals(); var floatRegex = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/utils/is-nullish.mjs init_injected_globals(); function isNullish(v) { return v == null; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/utils/single-color-regex.mjs init_injected_globals(); var singleColorRegex = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?$(?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?$)$/iu; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/utils.mjs var isColorString = (type, testProp) => (v) => { return Boolean(typeof v === "string" && singleColorRegex.test(v) && v.startsWith(type) || testProp && !isNullish(v) && Object.prototype.hasOwnProperty.call(v, testProp)); }; var splitColor = (aName, bName, cName) => (v) => { if (typeof v !== "string") return v; const [a, b, c, alpha2] = v.match(floatRegex); return { [aName]: parseFloat(a), [bName]: parseFloat(b), [cName]: parseFloat(c), alpha: alpha2 !== void 0 ? parseFloat(alpha2) : 1 }; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/rgba.mjs var clampRgbUnit = (v) => clamp(0, 255, v); var rgbUnit = { ...number, transform: (v) => Math.round(clampRgbUnit(v)) }; var rgba = { test: /* @__PURE__ */ isColorString("rgb", "red"), parse: /* @__PURE__ */ splitColor("red", "green", "blue"), transform: ({ red, green, blue, alpha: alpha$1 = 1 }) => "rgba(" + rgbUnit.transform(red) + ", " + rgbUnit.transform(green) + ", " + rgbUnit.transform(blue) + ", " + sanitize(alpha.transform(alpha$1)) + ")" }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/hex.mjs function parseHex(v) { let r = ""; let g = ""; let b = ""; let a = ""; if (v.length > 5) { r = v.substring(1, 3); g = v.substring(3, 5); b = v.substring(5, 7); a = v.substring(7, 9); } else { r = v.substring(1, 2); g = v.substring(2, 3); b = v.substring(3, 4); a = v.substring(4, 5); r += r; g += g; b += b; a += a; } return { red: parseInt(r, 16), green: parseInt(g, 16), blue: parseInt(b, 16), alpha: a ? parseInt(a, 16) / 255 : 1 }; } var hex = { test: /* @__PURE__ */ isColorString("#"), parse: parseHex, transform: rgba.transform }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/hsla.mjs init_injected_globals(); var hsla = { test: /* @__PURE__ */ isColorString("hsl", "hue"), parse: /* @__PURE__ */ splitColor("hue", "saturation", "lightness"), transform: ({ hue, saturation, lightness, alpha: alpha$1 = 1 }) => { return "hsla(" + Math.round(hue) + ", " + percent.transform(sanitize(saturation)) + ", " + percent.transform(sanitize(lightness)) + ", " + sanitize(alpha.transform(alpha$1)) + ")"; } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/color/index.mjs var color = { test: (v) => rgba.test(v) || hex.test(v) || hsla.test(v), parse: (v) => { if (rgba.test(v)) { return rgba.parse(v); } else if (hsla.test(v)) { return hsla.parse(v); } else { return hex.parse(v); } }, transform: (v) => { return typeof v === "string" ? v : v.hasOwnProperty("red") ? rgba.transform(v) : hsla.transform(v); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/utils/color-regex.mjs init_injected_globals(); var colorRegex = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?$(?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?$)/giu; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/complex/index.mjs function test(v) { return isNaN(v) && typeof v === "string" && (v.match(floatRegex)?.length || 0) + (v.match(colorRegex)?.length || 0) > 0; } var NUMBER_TOKEN = "number"; var COLOR_TOKEN = "color"; var VAR_TOKEN = "var"; var VAR_FUNCTION_TOKEN = "var("; var SPLIT_TOKEN = "${}"; var complexRegex = /var\s*$\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*$)*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?$(?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?$|-?(?:\d+(?:\.\d+)?|\.\d+)/giu; function analyseComplexValue(value) { const originalValue = value.toString(); const values = []; const indexes = { color: [], number: [], var: [] }; const types = []; let i = 0; const tokenised = originalValue.replace(complexRegex, (parsedValue) => { if (color.test(parsedValue)) { indexes.color.push(i); types.push(COLOR_TOKEN); values.push(color.parse(parsedValue)); } else if (parsedValue.startsWith(VAR_FUNCTION_TOKEN)) { indexes.var.push(i); types.push(VAR_TOKEN); values.push(parsedValue); } else { indexes.number.push(i); types.push(NUMBER_TOKEN); values.push(parseFloat(parsedValue)); } ++i; return SPLIT_TOKEN; }); const split = tokenised.split(SPLIT_TOKEN); return { values, split, indexes, types }; } function parseComplexValue(v) { return analyseComplexValue(v).values; } function createTransformer(source) { const { split, types } = analyseComplexValue(source); const numSections = split.length; return (v) => { let output = ""; for (let i = 0; i < numSections; i++) { output += split[i]; if (v[i] !== void 0) { const type = types[i]; if (type === NUMBER_TOKEN) { output += sanitize(v[i]); } else if (type === COLOR_TOKEN) { output += color.transform(v[i]); } else { output += v[i]; } } } return output; }; } var convertNumbersToZero = (v) => typeof v === "number" ? 0 : v; function getAnimatableNone(v) { const parsed = parseComplexValue(v); const transformer = createTransformer(v); return transformer(parsed.map(convertNumbersToZero)); } var complex = { test, parse: parseComplexValue, createTransformer, getAnimatableNone }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/value/types/complex/filter.mjs init_injected_globals(); var maxDefaults = /* @__PURE__ */ new Set(["brightness", "contrast", "saturate", "opacity"]); function applyDefaultFilter(v) { const [name, value] = v.slice(0, -1).split("("); if (name === "drop-shadow") return v; const [number2] = value.match(floatRegex) || []; if (!number2) return v; const unit = value.replace(number2, ""); let defaultValue = maxDefaults.has(name) ? 1 : 0; if (number2 !== value) defaultValue *= 100; return name + "(" + defaultValue + unit + ")"; } var functionRegex = /\b([a-z-]*)$.*?$/gu; var filter = { ...complex, getAnimatableNone: (v) => { const functions = v.match(functionRegex); return functions ? functions.map(applyDefaultFilter).join(" ") : v; } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/defaults.mjs init_injected_globals(); var defaultValueTypes = { ...numberValueTypes, // Color props color, backgroundColor: color, outlineColor: color, fill: color, stroke: color, // Border props borderColor: color, borderTopColor: color, borderRightColor: color, borderBottomColor: color, borderLeftColor: color, filter, WebkitFilter: filter }; var getDefaultValueType = (key) => defaultValueTypes[key]; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs function getAnimatableNone2(key, value) { let defaultValueType = getDefaultValueType(key); if (defaultValueType !== filter) defaultValueType = complex; return defaultValueType.getAnimatableNone ? defaultValueType.getAnimatableNone(value) : void 0; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs var invalidTemplates = /* @__PURE__ */ new Set(["auto", "none", "0"]); function makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name) { let i = 0; let animatableTemplate = void 0; while (i < unresolvedKeyframes.length && !animatableTemplate) { const keyframe = unresolvedKeyframes[i]; if (typeof keyframe === "string" && !invalidTemplates.has(keyframe) && analyseComplexValue(keyframe).values.length) { animatableTemplate = unresolvedKeyframes[i]; } i++; } if (animatableTemplate && name) { for (const noneIndex of noneKeyframeIndexes) { unresolvedKeyframes[noneIndex] = getAnimatableNone2(name, animatableTemplate); } } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/KeyframesResolver.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/html/utils/parse-transform.mjs init_injected_globals(); var radToDeg = (rad) => rad * 180 / Math.PI; var rotate = (v) => { const angle = radToDeg(Math.atan2(v[1], v[0])); return rebaseAngle(angle); }; var matrix2dParsers = { x: 4, y: 5, translateX: 4, translateY: 5, scaleX: 0, scaleY: 3, scale: (v) => (Math.abs(v[0]) + Math.abs(v[3])) / 2, rotate, rotateZ: rotate, skewX: (v) => radToDeg(Math.atan(v[1])), skewY: (v) => radToDeg(Math.atan(v[2])), skew: (v) => (Math.abs(v[1]) + Math.abs(v[2])) / 2 }; var rebaseAngle = (angle) => { angle = angle % 360; if (angle < 0) angle += 360; return angle; }; var rotateZ = rotate; var scaleX = (v) => Math.sqrt(v[0] * v[0] + v[1] * v[1]); var scaleY = (v) => Math.sqrt(v[4] * v[4] + v[5] * v[5]); var matrix3dParsers = { x: 12, y: 13, z: 14, translateX: 12, translateY: 13, translateZ: 14, scaleX, scaleY, scale: (v) => (scaleX(v) + scaleY(v)) / 2, rotateX: (v) => rebaseAngle(radToDeg(Math.atan2(v[6], v[5]))), rotateY: (v) => rebaseAngle(radToDeg(Math.atan2(-v[2], v[0]))), rotateZ, rotate: rotateZ, skewX: (v) => radToDeg(Math.atan(v[4])), skewY: (v) => radToDeg(Math.atan(v[1])), skew: (v) => (Math.abs(v[1]) + Math.abs(v[4])) / 2 }; function defaultTransformValue(name) { return name.includes("scale") ? 1 : 0; } function parseValueFromTransform(transform, name) { if (!transform || transform === "none") { return defaultTransformValue(name); } const matrix3dMatch = transform.match(/^matrix3d$([-\d.e\s,]+)$$/u); let parsers; let match2; if (matrix3dMatch) { parsers = matrix3dParsers; match2 = matrix3dMatch; } else { const matrix2dMatch = transform.match(/^matrix$([-\d.e\s,]+)$$/u); parsers = matrix2dParsers; match2 = matrix2dMatch; } if (!match2) { return defaultTransformValue(name); } const valueParser = parsers[name]; const values = match2[1].split(",").map(convertTransformToNumber); return typeof valueParser === "function" ? valueParser(values) : values[valueParser]; } var readTransformValue = (instance, name) => { const { transform = "none" } = getComputedStyle(instance); return parseValueFromTransform(transform, name); }; function convertTransformToNumber(value) { return parseFloat(value.trim()); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs var isNumOrPxType = (v) => v === number || v === px; var transformKeys = /* @__PURE__ */ new Set(["x", "y", "z"]); var nonTranslationalTransformKeys = transformPropOrder.filter((key) => !transformKeys.has(key)); function removeNonTranslationalTransform(visualElement) { const removedTransforms = []; nonTranslationalTransformKeys.forEach((key) => { const value = visualElement.getValue(key); if (value !== void 0) { removedTransforms.push([key, value.get()]); value.set(key.startsWith("scale") ? 1 : 0); } }); return removedTransforms; } var positionalValues = { // Dimensions width: ({ x }, { paddingLeft = "0", paddingRight = "0" }) => x.max - x.min - parseFloat(paddingLeft) - parseFloat(paddingRight), height: ({ y }, { paddingTop = "0", paddingBottom = "0" }) => y.max - y.min - parseFloat(paddingTop) - parseFloat(paddingBottom), top: (_bbox, { top }) => parseFloat(top), left: (_bbox, { left }) => parseFloat(left), bottom: ({ y }, { top }) => parseFloat(top) + (y.max - y.min), right: ({ x }, { left }) => parseFloat(left) + (x.max - x.min), // Transform x: (_bbox, { transform }) => parseValueFromTransform(transform, "x"), y: (_bbox, { transform }) => parseValueFromTransform(transform, "y") }; positionalValues.translateX = positionalValues.x; positionalValues.translateY = positionalValues.y; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/KeyframesResolver.mjs var toResolve = /* @__PURE__ */ new Set(); var isScheduled = false; var anyNeedsMeasurement = false; function measureAllKeyframes() { if (anyNeedsMeasurement) { const resolversToMeasure = Array.from(toResolve).filter((resolver) => resolver.needsMeasurement); const elementsToMeasure = new Set(resolversToMeasure.map((resolver) => resolver.element)); const transformsToRestore = /* @__PURE__ */ new Map(); elementsToMeasure.forEach((element) => { const removedTransforms = removeNonTranslationalTransform(element); if (!removedTransforms.length) return; transformsToRestore.set(element, removedTransforms); element.render(); }); resolversToMeasure.forEach((resolver) => resolver.measureInitialState()); elementsToMeasure.forEach((element) => { element.render(); const restore = transformsToRestore.get(element); if (restore) { restore.forEach(([key, value]) => { element.getValue(key)?.set(value); }); } }); resolversToMeasure.forEach((resolver) => resolver.measureEndState()); resolversToMeasure.forEach((resolver) => { if (resolver.suspendedScrollY !== void 0) { window.scrollTo(0, resolver.suspendedScrollY); } }); } anyNeedsMeasurement = false; isScheduled = false; toResolve.forEach((resolver) => resolver.complete()); toResolve.clear(); } function readAllKeyframes() { toResolve.forEach((resolver) => { resolver.readKeyframes(); if (resolver.needsMeasurement) { anyNeedsMeasurement = true; } }); } function flushKeyframeResolvers() { readAllKeyframes(); measureAllKeyframes(); } var KeyframeResolver = class { constructor(unresolvedKeyframes, onComplete, name, motionValue2, element, isAsync = false) { this.isComplete = false; this.isAsync = false; this.needsMeasurement = false; this.isScheduled = false; this.unresolvedKeyframes = [...unresolvedKeyframes]; this.onComplete = onComplete; this.name = name; this.motionValue = motionValue2; this.element = element; this.isAsync = isAsync; } scheduleResolve() { this.isScheduled = true; if (this.isAsync) { toResolve.add(this); if (!isScheduled) { isScheduled = true; frame.read(readAllKeyframes); frame.resolveKeyframes(measureAllKeyframes); } } else { this.readKeyframes(); this.complete(); } } readKeyframes() { const { unresolvedKeyframes, name, element, motionValue: motionValue2 } = this; for (let i = 0; i < unresolvedKeyframes.length; i++) { if (unresolvedKeyframes[i] === null) { if (i === 0) { const currentValue = motionValue2?.get(); const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1]; if (currentValue !== void 0) { unresolvedKeyframes[0] = currentValue; } else if (element && name) { const valueAsRead = element.readValue(name, finalKeyframe); if (valueAsRead !== void 0 && valueAsRead !== null) { unresolvedKeyframes[0] = valueAsRead; } } if (unresolvedKeyframes[0] === void 0) { unresolvedKeyframes[0] = finalKeyframe; } if (motionValue2 && currentValue === void 0) { motionValue2.set(unresolvedKeyframes[0]); } } else { unresolvedKeyframes[i] = unresolvedKeyframes[i - 1]; } } } } setFinalKeyframe() { } measureInitialState() { } renderEndStyles() { } measureEndState() { } complete() { this.isComplete = true; this.onComplete(this.unresolvedKeyframes, this.finalKeyframe); toResolve.delete(this); } cancel() { if (!this.isComplete) { this.isScheduled = false; toResolve.delete(this); } } resume() { if (!this.isComplete) this.scheduleResolve(); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/is-numerical-string.mjs init_injected_globals(); var isNumericalString = (v) => /^-?(?:\d+(?:\.\d+)?|\.\d+)$/u.test(v); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs var splitCSSVariableRegex = ( // eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words /^var$--(?:([\w-]+)|([\w-]+), ?([a-zA-Z\d ()%#.,-]+))$/u ); function parseCSSVariable(current) { const match2 = splitCSSVariableRegex.exec(current); if (!match2) return [,]; const [, token1, token2, fallback] = match2; return [`--${token1 ?? token2}`, fallback]; } var maxDepth = 4; function getVariableValue(current, element, depth = 1) { invariant(depth <= maxDepth, `Max CSS variable fallback depth detected in property "${current}". This may indicate a circular fallback dependency.`); const [token, fallback] = parseCSSVariable(current); if (!token) return; const resolved = window.getComputedStyle(element).getPropertyValue(token); if (resolved) { const trimmed = resolved.trim(); return isNumericalString(trimmed) ? parseFloat(trimmed) : trimmed; } return isCSSVariableToken(fallback) ? getVariableValue(fallback, element, depth + 1) : fallback; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/dimensions.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/test.mjs init_injected_globals(); var testValueType = (v) => (type) => type.test(v); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/type-auto.mjs init_injected_globals(); var auto = { test: (v) => v === "auto", parse: (v) => v }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/value-types/dimensions.mjs var dimensionValueTypes = [number, px, percent, degrees, vw, vh, auto]; var findDimensionValueType = (v) => dimensionValueTypes.find(testValueType(v)); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs var DOMKeyframesResolver = class extends KeyframeResolver { constructor(unresolvedKeyframes, onComplete, name, motionValue2, element) { super(unresolvedKeyframes, onComplete, name, motionValue2, element, true); } readKeyframes() { const { unresolvedKeyframes, element, name } = this; if (!element || !element.current) return; super.readKeyframes(); for (let i = 0; i < unresolvedKeyframes.length; i++) { let keyframe = unresolvedKeyframes[i]; if (typeof keyframe === "string") { keyframe = keyframe.trim(); if (isCSSVariableToken(keyframe)) { const resolved = getVariableValue(keyframe, element.current); if (resolved !== void 0) { unresolvedKeyframes[i] = resolved; } if (i === unresolvedKeyframes.length - 1) { this.finalKeyframe = keyframe; } } } } this.resolveNoneKeyframes(); if (!positionalKeys.has(name) || unresolvedKeyframes.length !== 2) { return; } const [origin, target] = unresolvedKeyframes; const originType = findDimensionValueType(origin); const targetType = findDimensionValueType(target); if (originType === targetType) return; if (isNumOrPxType(originType) && isNumOrPxType(targetType)) { for (let i = 0; i < unresolvedKeyframes.length; i++) { const value = unresolvedKeyframes[i]; if (typeof value === "string") { unresolvedKeyframes[i] = parseFloat(value); } } } else { this.needsMeasurement = true; } } resolveNoneKeyframes() { const { unresolvedKeyframes, name } = this; const noneKeyframeIndexes = []; for (let i = 0; i < unresolvedKeyframes.length; i++) { if (isNone(unresolvedKeyframes[i])) { noneKeyframeIndexes.push(i); } } if (noneKeyframeIndexes.length) { makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name); } } measureInitialState() { const { element, unresolvedKeyframes, name } = this; if (!element || !element.current) return; if (name === "height") { this.suspendedScrollY = window.pageYOffset; } this.measuredOrigin = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current)); unresolvedKeyframes[0] = this.measuredOrigin; const measureKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1]; if (measureKeyframe !== void 0) { element.getValue(name, measureKeyframe).jump(measureKeyframe, false); } } measureEndState() { const { element, name, unresolvedKeyframes } = this; if (!element || !element.current) return; const value = element.getValue(name); value && value.jump(this.measuredOrigin, false); const finalKeyframeIndex = unresolvedKeyframes.length - 1; const finalKeyframe = unresolvedKeyframes[finalKeyframeIndex]; unresolvedKeyframes[finalKeyframeIndex] = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current)); if (finalKeyframe !== null && this.finalKeyframe === void 0) { this.finalKeyframe = finalKeyframe; } if (this.removedTransforms?.length) { this.removedTransforms.forEach(([unsetTransformName, unsetTransformValue]) => { element.getValue(unsetTransformName).set(unsetTransformValue); }); } this.resolveNoneKeyframes(); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/BaseAnimation.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/utils/can-animate.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/is-animatable.mjs init_injected_globals(); var isAnimatable = (value, name) => { if (name === "zIndex") return false; if (typeof value === "number" || Array.isArray(value)) return true; if (typeof value === "string" && // It's animatable if we have a string (complex.test(value) || value === "0") && // And it contains numbers and/or colors !value.startsWith("url(")) { return true; } return false; }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/generators/utils/is-generator.mjs init_injected_globals(); function isGenerator(type) { return typeof type === "function" && "applyToOptions" in type; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/utils/can-animate.mjs function hasKeyframesChanged(keyframes2) { const current = keyframes2[0]; if (keyframes2.length === 1) return true; for (let i = 0; i < keyframes2.length; i++) { if (keyframes2[i] !== current) return true; } } function canAnimate(keyframes2, name, type, velocity) { const originKeyframe = keyframes2[0]; if (originKeyframe === null) return false; if (name === "display" || name === "visibility") return true; const targetKeyframe = keyframes2[keyframes2.length - 1]; const isOriginAnimatable = isAnimatable(originKeyframe, name); const isTargetAnimatable = isAnimatable(targetKeyframe, name); warning(isOriginAnimatable === isTargetAnimatable, `You are trying to animate ${name} from "${originKeyframe}" to "${targetKeyframe}". ${originKeyframe} is not an animatable value - to enable this animation set ${originKeyframe} to a value animatable to ${targetKeyframe} via the \`style\` property.`); if (!isOriginAnimatable || !isTargetAnimatable) { return false; } return hasKeyframesChanged(keyframes2) || (type === "spring" || isGenerator(type)) && velocity; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/waapi/utils/get-final-keyframe.mjs init_injected_globals(); var isNotNull = (value) => value !== null; function getFinalKeyframe(keyframes2, { repeat, repeatType = "loop" }, finalKeyframe) { const resolvedKeyframes = keyframes2.filter(isNotNull); const index = repeat && repeatType !== "loop" && repeat % 2 === 1 ? 0 : resolvedKeyframes.length - 1; return !index || finalKeyframe === void 0 ? resolvedKeyframes[index] : finalKeyframe; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/BaseAnimation.mjs var MAX_RESOLVE_DELAY = 40; var BaseAnimation = class { constructor({ autoplay = true, delay: delay2 = 0, type = "keyframes", repeat = 0, repeatDelay = 0, repeatType = "loop", ...options }) { this.isStopped = false; this.hasAttemptedResolve = false; this.createdAt = time.now(); this.options = { autoplay, delay: delay2, type, repeat, repeatDelay, repeatType, ...options }; this.updateFinishedPromise(); } /** * This method uses the createdAt and resolvedAt to calculate the * animation startTime. *Ideally*, we would use the createdAt time as t=0 * as the following frame would then be the first frame of the animation in * progress, which would feel snappier. * * However, if there's a delay (main thread work) between the creation of * the animation and the first commited frame, we prefer to use resolvedAt * to avoid a sudden jump into the animation. */ calcStartTime() { if (!this.resolvedAt) return this.createdAt; return this.resolvedAt - this.createdAt > MAX_RESOLVE_DELAY ? this.resolvedAt : this.createdAt; } /** * A getter for resolved data. If keyframes are not yet resolved, accessing * this.resolved will synchronously flush all pending keyframe resolvers. * This is a deoptimisation, but at its worst still batches read/writes. */ get resolved() { if (!this._resolved && !this.hasAttemptedResolve) { flushKeyframeResolvers(); } return this._resolved; } /** * A method to be called when the keyframes resolver completes. This method * will check if its possible to run the animation and, if not, skip it. * Otherwise, it will call initPlayback on the implementing class. */ onKeyframesResolved(keyframes2, finalKeyframe) { this.resolvedAt = time.now(); this.hasAttemptedResolve = true; const { name, type, velocity, delay: delay2, onComplete, onUpdate, isGenerator: isGenerator2 } = this.options; if (!isGenerator2 && !canAnimate(keyframes2, name, type, velocity)) { if (instantAnimationState.current || !delay2) { onUpdate && onUpdate(getFinalKeyframe(keyframes2, this.options, finalKeyframe)); onComplete && onComplete(); this.resolveFinishedPromise(); return; } else { this.options.duration = 0; } } const resolvedAnimation = this.initPlayback(keyframes2, finalKeyframe); if (resolvedAnimation === false) return; this._resolved = { keyframes: keyframes2, finalKeyframe, ...resolvedAnimation }; this.onPostResolved(); } onPostResolved() { } /** * Allows the returned animation to be awaited or promise-chained. Currently * resolves when the animation finishes at all but in a future update could/should * reject if its cancels. */ then(resolve, reject) { return this.currentFinishedPromise.then(resolve, reject); } flatten() { if (!this.options.allowFlatten) return; this.options.type = "keyframes"; this.options.ease = "linear"; } updateFinishedPromise() { this.currentFinishedPromise = new Promise((resolve) => { this.resolveFinishedPromise = resolve; }); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/complex.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/number.mjs init_injected_globals(); var mixNumber = (from, to, progress2) => { return from + (to - from) * progress2; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/color.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/hsla-to-rgba.mjs init_injected_globals(); function hueToRgb(p, q, t) { if (t < 0) t += 1; if (t > 1) t -= 1; if (t < 1 / 6) return p + (q - p) * 6 * t; if (t < 1 / 2) return q; if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6; return p; } function hslaToRgba({ hue, saturation, lightness, alpha: alpha2 }) { hue /= 360; saturation /= 100; lightness /= 100; let red = 0; let green = 0; let blue = 0; if (!saturation) { red = green = blue = lightness; } else { const q = lightness < 0.5 ? lightness * (1 + saturation) : lightness + saturation - lightness * saturation; const p = 2 * lightness - q; red = hueToRgb(p, q, hue + 1 / 3); green = hueToRgb(p, q, hue); blue = hueToRgb(p, q, hue - 1 / 3); } return { red: Math.round(red * 255), green: Math.round(green * 255), blue: Math.round(blue * 255), alpha: alpha2 }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/immediate.mjs init_injected_globals(); function mixImmediate(a, b) { return (p) => p > 0 ? b : a; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/color.mjs var mixLinearColor = (from, to, v) => { const fromExpo = from * from; const expo = v * (to * to - fromExpo) + fromExpo; return expo < 0 ? 0 : Math.sqrt(expo); }; var colorTypes = [hex, rgba, hsla]; var getColorType = (v) => colorTypes.find((type) => type.test(v)); function asRGBA(color2) { const type = getColorType(color2); warning(Boolean(type), `'${color2}' is not an animatable color. Use the equivalent color code instead.`); if (!Boolean(type)) return false; let model = type.parse(color2); if (type === hsla) { model = hslaToRgba(model); } return model; } var mixColor = (from, to) => { const fromRGBA = asRGBA(from); const toRGBA = asRGBA(to); if (!fromRGBA || !toRGBA) { return mixImmediate(from, to); } const blended = { ...fromRGBA }; return (v) => { blended.red = mixLinearColor(fromRGBA.red, toRGBA.red, v); blended.green = mixLinearColor(fromRGBA.green, toRGBA.green, v); blended.blue = mixLinearColor(fromRGBA.blue, toRGBA.blue, v); blended.alpha = mixNumber(fromRGBA.alpha, toRGBA.alpha, v); return rgba.transform(blended); }; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/pipe.mjs init_injected_globals(); var combineFunctions = (a, b) => (v) => b(a(v)); var pipe = (...transformers) => transformers.reduce(combineFunctions); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/visibility.mjs init_injected_globals(); var invisibleValues = /* @__PURE__ */ new Set(["none", "hidden"]); function mixVisibility(origin, target) { if (invisibleValues.has(origin)) { return (p) => p <= 0 ? origin : target; } else { return (p) => p >= 1 ? target : origin; } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/complex.mjs function mixNumber2(a, b) { return (p) => mixNumber(a, b, p); } function getMixer(a) { if (typeof a === "number") { return mixNumber2; } else if (typeof a === "string") { return isCSSVariableToken(a) ? mixImmediate : color.test(a) ? mixColor : mixComplex; } else if (Array.isArray(a)) { return mixArray; } else if (typeof a === "object") { return color.test(a) ? mixColor : mixObject; } return mixImmediate; } function mixArray(a, b) { const output = [...a]; const numValues = output.length; const blendValue = a.map((v, i) => getMixer(v)(v, b[i])); return (p) => { for (let i = 0; i < numValues; i++) { output[i] = blendValue[i](p); } return output; }; } function mixObject(a, b) { const output = { ...a, ...b }; const blendValue = {}; for (const key in output) { if (a[key] !== void 0 && b[key] !== void 0) { blendValue[key] = getMixer(a[key])(a[key], b[key]); } } return (v) => { for (const key in blendValue) { output[key] = blendValue[key](v); } return output; }; } function matchOrder(origin, target) { const orderedOrigin = []; const pointers = { color: 0, var: 0, number: 0 }; for (let i = 0; i < target.values.length; i++) { const type = target.types[i]; const originIndex = origin.indexes[type][pointers[type]]; const originValue = origin.values[originIndex] ?? 0; orderedOrigin[i] = originValue; pointers[type]++; } return orderedOrigin; } var mixComplex = (origin, target) => { const template = complex.createTransformer(target); const originStats = analyseComplexValue(origin); const targetStats = analyseComplexValue(target); const canInterpolate = originStats.indexes.var.length === targetStats.indexes.var.length && originStats.indexes.color.length === targetStats.indexes.color.length && originStats.indexes.number.length >= targetStats.indexes.number.length; if (canInterpolate) { if (invisibleValues.has(origin) && !targetStats.values.length || invisibleValues.has(target) && !originStats.values.length) { return mixVisibility(origin, target); } return pipe(mixArray(matchOrder(originStats, targetStats), targetStats.values), template); } else { warning(true, `Complex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`); return mixImmediate(origin, target); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/mix/index.mjs function mix(from, to, p) { if (typeof from === "number" && typeof to === "number" && typeof p === "number") { return mixNumber(from, to, p); } const mixer = getMixer(from); return mixer(from, to); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/inertia.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/spring/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/utils/velocity.mjs init_injected_globals(); var velocitySampleDuration = 5; function calcGeneratorVelocity(resolveValue, t, current) { const prevT = Math.max(t - velocitySampleDuration, 0); return velocityPerSecond(current - resolveValue(prevT), t - prevT); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/spring/defaults.mjs init_injected_globals(); var springDefaults = { // Default spring physics stiffness: 100, damping: 10, mass: 1, velocity: 0, // Default duration/bounce-based options duration: 800, // in ms bounce: 0.3, visualDuration: 0.3, // in seconds // Rest thresholds restSpeed: { granular: 0.01, default: 2 }, restDelta: { granular: 5e-3, default: 0.5 }, // Limits minDuration: 0.01, // in seconds maxDuration: 10, // in seconds minDamping: 0.05, maxDamping: 1 }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/spring/find.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-utils/dist/es/time-conversion.mjs init_injected_globals(); var secondsToMilliseconds = /* @__NO_SIDE_EFFECTS__ */ (seconds) => seconds * 1e3; var millisecondsToSeconds = /* @__NO_SIDE_EFFECTS__ */ (milliseconds) => milliseconds / 1e3; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/spring/find.mjs var safeMin = 1e-3; function findSpring({ duration = springDefaults.duration, bounce = springDefaults.bounce, velocity = springDefaults.velocity, mass = springDefaults.mass }) { let envelope; let derivative; warning(duration <= secondsToMilliseconds(springDefaults.maxDuration), "Spring duration must be 10 seconds or less"); let dampingRatio = 1 - bounce; dampingRatio = clamp(springDefaults.minDamping, springDefaults.maxDamping, dampingRatio); duration = clamp(springDefaults.minDuration, springDefaults.maxDuration, millisecondsToSeconds(duration)); if (dampingRatio < 1) { envelope = (undampedFreq2) => { const exponentialDecay = undampedFreq2 * dampingRatio; const delta = exponentialDecay * duration; const a = exponentialDecay - velocity; const b = calcAngularFreq(undampedFreq2, dampingRatio); const c = Math.exp(-delta); return safeMin - a / b * c; }; derivative = (undampedFreq2) => { const exponentialDecay = undampedFreq2 * dampingRatio; const delta = exponentialDecay * duration; const d = delta * velocity + velocity; const e = Math.pow(dampingRatio, 2) * Math.pow(undampedFreq2, 2) * duration; const f = Math.exp(-delta); const g = calcAngularFreq(Math.pow(undampedFreq2, 2), dampingRatio); const factor = -envelope(undampedFreq2) + safeMin > 0 ? -1 : 1; return factor * ((d - e) * f) / g; }; } else { envelope = (undampedFreq2) => { const a = Math.exp(-undampedFreq2 * duration); const b = (undampedFreq2 - velocity) * duration + 1; return -safeMin + a * b; }; derivative = (undampedFreq2) => { const a = Math.exp(-undampedFreq2 * duration); const b = (velocity - undampedFreq2) * (duration * duration); return a * b; }; } const initialGuess = 5 / duration; const undampedFreq = approximateRoot(envelope, derivative, initialGuess); duration = secondsToMilliseconds(duration); if (isNaN(undampedFreq)) { return { stiffness: springDefaults.stiffness, damping: springDefaults.damping, duration }; } else { const stiffness = Math.pow(undampedFreq, 2) * mass; return { stiffness, damping: dampingRatio * 2 * Math.sqrt(mass * stiffness), duration }; } } var rootIterations = 12; function approximateRoot(envelope, derivative, initialGuess) { let result = initialGuess; for (let i = 1; i < rootIterations; i++) { result = result - envelope(result) / derivative(result); } return result; } function calcAngularFreq(undampedFreq, dampingRatio) { return undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio); } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/generators/utils/calc-duration.mjs init_injected_globals(); var maxGeneratorDuration = 2e4; function calcGeneratorDuration(generator) { let duration = 0; const timeStep = 50; let state = generator.next(duration); while (!state.done && duration < maxGeneratorDuration) { duration += timeStep; state = generator.next(duration); } return duration >= maxGeneratorDuration ? Infinity : duration; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs function createGeneratorEasing(options, scale2 = 100, createGenerator) { const generator = createGenerator({ ...options, keyframes: [0, scale2] }); const duration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration); return { type: "keyframes", ease: (progress2) => { return generator.next(duration * progress2).value / scale2; }, duration: millisecondsToSeconds(duration) }; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/supports/linear-easing.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/supports/memo.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/supports/flags.mjs init_injected_globals(); var supportsFlags = {}; // ../../../node_modules/motion/dist/es/motion-utils/dist/es/memo.mjs init_injected_globals(); // @__NO_SIDE_EFFECTS__ function memo(callback) { let result; return () => { if (result === void 0) result = callback(); return result; }; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/supports/memo.mjs function memoSupports(callback, supportsFlag) { const memoized = memo(callback); return () => supportsFlags[supportsFlag] ?? memoized(); } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/supports/linear-easing.mjs var supportsLinearEasing = /* @__PURE__ */ memoSupports(() => { try { document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" }); } catch (e) { return false; } return true; }, "linearEasing"); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/utils/linear.mjs init_injected_globals(); var generateLinearEasing = (easing, duration, resolution = 10) => { let points = ""; const numPoints = Math.max(Math.round(duration / resolution), 2); for (let i = 0; i < numPoints; i++) { points += easing(i / (numPoints - 1)) + ", "; } return `linear(${points.substring(0, points.length - 2)})`; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/spring/index.mjs var durationKeys = ["duration", "bounce"]; var physicsKeys = ["stiffness", "damping", "mass"]; function isSpringType(options, keys) { return keys.some((key) => options[key] !== void 0); } function getSpringOptions(options) { let springOptions = { velocity: springDefaults.velocity, stiffness: springDefaults.stiffness, damping: springDefaults.damping, mass: springDefaults.mass, isResolvedFromDuration: false, ...options }; if (!isSpringType(options, physicsKeys) && isSpringType(options, durationKeys)) { if (options.visualDuration) { const visualDuration = options.visualDuration; const root = 2 * Math.PI / (visualDuration * 1.2); const stiffness = root * root; const damping = 2 * clamp(0.05, 1, 1 - (options.bounce || 0)) * Math.sqrt(stiffness); springOptions = { ...springOptions, mass: springDefaults.mass, stiffness, damping }; } else { const derived = findSpring(options); springOptions = { ...springOptions, ...derived, mass: springDefaults.mass }; springOptions.isResolvedFromDuration = true; } } return springOptions; } function spring(optionsOrVisualDuration = springDefaults.visualDuration, bounce = springDefaults.bounce) { const options = typeof optionsOrVisualDuration !== "object" ? { visualDuration: optionsOrVisualDuration, keyframes: [0, 1], bounce } : optionsOrVisualDuration; let { restSpeed, restDelta } = options; const origin = options.keyframes[0]; const target = options.keyframes[options.keyframes.length - 1]; const state = { done: false, value: origin }; const { stiffness, damping, mass, duration, velocity, isResolvedFromDuration } = getSpringOptions({ ...options, velocity: -millisecondsToSeconds(options.velocity || 0) }); const initialVelocity = velocity || 0; const dampingRatio = damping / (2 * Math.sqrt(stiffness * mass)); const initialDelta = target - origin; const undampedAngularFreq = millisecondsToSeconds(Math.sqrt(stiffness / mass)); const isGranularScale = Math.abs(initialDelta) < 5; restSpeed || (restSpeed = isGranularScale ? springDefaults.restSpeed.granular : springDefaults.restSpeed.default); restDelta || (restDelta = isGranularScale ? springDefaults.restDelta.granular : springDefaults.restDelta.default); let resolveSpring; if (dampingRatio < 1) { const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio); resolveSpring = (t) => { const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t); return target - envelope * ((initialVelocity + dampingRatio * undampedAngularFreq * initialDelta) / angularFreq * Math.sin(angularFreq * t) + initialDelta * Math.cos(angularFreq * t)); }; } else if (dampingRatio === 1) { resolveSpring = (t) => target - Math.exp(-undampedAngularFreq * t) * (initialDelta + (initialVelocity + undampedAngularFreq * initialDelta) * t); } else { const dampedAngularFreq = undampedAngularFreq * Math.sqrt(dampingRatio * dampingRatio - 1); resolveSpring = (t) => { const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t); const freqForT = Math.min(dampedAngularFreq * t, 300); return target - envelope * ((initialVelocity + dampingRatio * undampedAngularFreq * initialDelta) * Math.sinh(freqForT) + dampedAngularFreq * initialDelta * Math.cosh(freqForT)) / dampedAngularFreq; }; } const generator = { calculatedDuration: isResolvedFromDuration ? duration || null : null, next: (t) => { const current = resolveSpring(t); if (!isResolvedFromDuration) { let currentVelocity = 0; if (dampingRatio < 1) { currentVelocity = t === 0 ? secondsToMilliseconds(initialVelocity) : calcGeneratorVelocity(resolveSpring, t, current); } const isBelowVelocityThreshold = Math.abs(currentVelocity) <= restSpeed; const isBelowDisplacementThreshold = Math.abs(target - current) <= restDelta; state.done = isBelowVelocityThreshold && isBelowDisplacementThreshold; } else { state.done = t >= duration; } state.value = state.done ? target : current; return state; }, toString: () => { const calculatedDuration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration); const easing = generateLinearEasing((progress2) => generator.next(calculatedDuration * progress2).value, calculatedDuration, 30); return calculatedDuration + "ms " + easing; }, toTransition: () => { } }; return generator; } spring.applyToOptions = (options) => { const generatorOptions = createGeneratorEasing(options, 100, spring); options.ease = supportsLinearEasing() ? generatorOptions.ease : "easeOut"; options.duration = secondsToMilliseconds(generatorOptions.duration); options.type = "keyframes"; return options; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/inertia.mjs function inertia({ keyframes: keyframes2, velocity = 0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed }) { const origin = keyframes2[0]; const state = { done: false, value: origin }; const isOutOfBounds = (v) => min !== void 0 && v < min || max !== void 0 && v > max; const nearestBoundary = (v) => { if (min === void 0) return max; if (max === void 0) return min; return Math.abs(min - v) < Math.abs(max - v) ? min : max; }; let amplitude = power * velocity; const ideal = origin + amplitude; const target = modifyTarget === void 0 ? ideal : modifyTarget(ideal); if (target !== ideal) amplitude = target - origin; const calcDelta = (t) => -amplitude * Math.exp(-t / timeConstant); const calcLatest = (t) => target + calcDelta(t); const applyFriction = (t) => { const delta = calcDelta(t); const latest = calcLatest(t); state.done = Math.abs(delta) <= restDelta; state.value = state.done ? target : latest; }; let timeReachedBoundary; let spring$1; const checkCatchBoundary = (t) => { if (!isOutOfBounds(state.value)) return; timeReachedBoundary = t; spring$1 = spring({ keyframes: [state.value, nearestBoundary(state.value)], velocity: calcGeneratorVelocity(calcLatest, t, state.value), // TODO: This should be passing * 1000 damping: bounceDamping, stiffness: bounceStiffness, restDelta, restSpeed }); }; checkCatchBoundary(0); return { calculatedDuration: null, next: (t) => { let hasUpdatedFrame = false; if (!spring$1 && timeReachedBoundary === void 0) { hasUpdatedFrame = true; applyFriction(t); checkCatchBoundary(t); } if (timeReachedBoundary !== void 0 && t >= timeReachedBoundary) { return spring$1.next(t - timeReachedBoundary); } else { !hasUpdatedFrame && applyFriction(t); return state; } } }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/keyframes.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/ease.mjs init_injected_globals(); var easeIn = /* @__PURE__ */ cubicBezier(0.42, 0, 1, 1); var easeOut = /* @__PURE__ */ cubicBezier(0, 0, 0.58, 1); var easeInOut = /* @__PURE__ */ cubicBezier(0.42, 0, 0.58, 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/utils/is-easing-array.mjs init_injected_globals(); var isEasingArray = (ease2) => { return Array.isArray(ease2) && typeof ease2[0] !== "number"; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/utils/map.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/is-bezier-definition.mjs init_injected_globals(); var isBezierDefinition = (easing) => Array.isArray(easing) && typeof easing[0] === "number"; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/easing/utils/map.mjs var easingLookup = { linear: noop3, easeIn, easeInOut, easeOut, circIn, circInOut, circOut, backIn, backInOut, backOut, anticipate }; var easingDefinitionToFunction = (definition) => { if (isBezierDefinition(definition)) { invariant(definition.length === 4, `Cubic bezier arrays must contain four numerical values.`); const [x1, y1, x2, y2] = definition; return cubicBezier(x1, y1, x2, y2); } else if (typeof definition === "string") { invariant(easingLookup[definition] !== void 0, `Invalid easing type '${definition}'`); return easingLookup[definition]; } return definition; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/interpolate.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-utils/dist/es/progress.mjs init_injected_globals(); var progress = /* @__NO_SIDE_EFFECTS__ */ (from, to, value) => { const toFromDifference = to - from; return toFromDifference === 0 ? 1 : (value - from) / toFromDifference; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/interpolate.mjs function createMixers(output, ease2, customMixer) { const mixers = []; const mixerFactory = customMixer || mix; const numMixers = output.length - 1; for (let i = 0; i < numMixers; i++) { let mixer = mixerFactory(output[i], output[i + 1]); if (ease2) { const easingFunction = Array.isArray(ease2) ? ease2[i] || noop3 : ease2; mixer = pipe(easingFunction, mixer); } mixers.push(mixer); } return mixers; } function interpolate(input, output, { clamp: isClamp = true, ease: ease2, mixer } = {}) { const inputLength = input.length; invariant(inputLength === output.length, "Both input and output ranges must be the same length"); if (inputLength === 1) return () => output[0]; if (inputLength === 2 && output[0] === output[1]) return () => output[1]; const isZeroDeltaRange = input[0] === input[1]; if (input[0] > input[inputLength - 1]) { input = [...input].reverse(); output = [...output].reverse(); } const mixers = createMixers(output, ease2, mixer); const numMixers = mixers.length; const interpolator = (v) => { if (isZeroDeltaRange && v < input[0]) return output[0]; let i = 0; if (numMixers > 1) { for (; i < input.length - 2; i++) { if (v < input[i + 1]) break; } } const progressInRange = progress(input[i], input[i + 1], v); return mixers[i](progressInRange); }; return isClamp ? (v) => interpolator(clamp(input[0], input[inputLength - 1], v)) : interpolator; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/offsets/default.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/offsets/fill.mjs init_injected_globals(); function fillOffset(offset, remaining) { const min = offset[offset.length - 1]; for (let i = 1; i <= remaining; i++) { const offsetProgress = progress(0, remaining, i); offset.push(mixNumber(min, 1, offsetProgress)); } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/offsets/default.mjs function defaultOffset(arr) { const offset = [0]; fillOffset(offset, arr.length - 1); return offset; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/offsets/time.mjs init_injected_globals(); function convertOffsetToTimes(offset, duration) { return offset.map((o) => o * duration); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/generators/keyframes.mjs function defaultEasing(values, easing) { return values.map(() => easing || easeInOut).splice(0, values.length - 1); } function keyframes({ duration = 300, keyframes: keyframeValues, times, ease: ease2 = "easeInOut" }) { const easingFunctions = isEasingArray(ease2) ? ease2.map(easingDefinitionToFunction) : easingDefinitionToFunction(ease2); const state = { done: false, value: keyframeValues[0] }; const absoluteTimes = convertOffsetToTimes( // Only use the provided offsets if they're the correct length // TODO Maybe we should warn here if there's a length mismatch times && times.length === keyframeValues.length ? times : defaultOffset(keyframeValues), duration ); const mapTimeToKeyframe = interpolate(absoluteTimes, keyframeValues, { ease: Array.isArray(easingFunctions) ? easingFunctions : defaultEasing(keyframeValues, easingFunctions) }); return { calculatedDuration: duration, next: (t) => { state.value = mapTimeToKeyframe(t); state.done = t >= duration; return state; } }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/drivers/driver-frameloop.mjs init_injected_globals(); var frameloopDriver = (update) => { const passTimestamp = ({ timestamp }) => update(timestamp); return { start: () => frame.update(passTimestamp, true), stop: () => cancelFrame(passTimestamp), /** * If we're processing this frame we can use the * framelocked timestamp to keep things in sync. */ now: () => frameData.isProcessing ? frameData.timestamp : time.now() }; }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/stats/animation-count.mjs init_injected_globals(); var activeAnimations = { layout: 0, mainThread: 0, waapi: 0 }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs var generators = { decay: inertia, inertia, tween: keyframes, keyframes, spring }; var percentToProgress = (percent2) => percent2 / 100; var MainThreadAnimation = class extends BaseAnimation { constructor(options) { super(options); this.holdTime = null; this.cancelTime = null; this.currentTime = 0; this.playbackSpeed = 1; this.pendingPlayState = "running"; this.startTime = null; this.state = "idle"; this.stop = () => { this.resolver.cancel(); this.isStopped = true; if (this.state === "idle") return; this.teardown(); const { onStop } = this.options; onStop && onStop(); }; const { name, motionValue: motionValue2, element, keyframes: keyframes2 } = this.options; const KeyframeResolver$1 = element?.KeyframeResolver || KeyframeResolver; const onResolved = (resolvedKeyframes, finalKeyframe) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe); this.resolver = new KeyframeResolver$1(keyframes2, onResolved, name, motionValue2, element); this.resolver.scheduleResolve(); } flatten() { super.flatten(); if (this._resolved) { Object.assign(this._resolved, this.initPlayback(this._resolved.keyframes)); } } initPlayback(keyframes$1) { const { type = "keyframes", repeat = 0, repeatDelay = 0, repeatType, velocity = 0 } = this.options; const generatorFactory = isGenerator(type) ? type : generators[type] || keyframes; let mapPercentToKeyframes; let mirroredGenerator; if (false) { invariant(keyframes$1.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${keyframes$1}`); } if (generatorFactory !== keyframes && typeof keyframes$1[0] !== "number") { mapPercentToKeyframes = pipe(percentToProgress, mix(keyframes$1[0], keyframes$1[1])); keyframes$1 = [0, 100]; } const generator = generatorFactory({ ...this.options, keyframes: keyframes$1 }); if (repeatType === "mirror") { mirroredGenerator = generatorFactory({ ...this.options, keyframes: [...keyframes$1].reverse(), velocity: -velocity }); } if (generator.calculatedDuration === null) { generator.calculatedDuration = calcGeneratorDuration(generator); } const { calculatedDuration } = generator; const resolvedDuration = calculatedDuration + repeatDelay; const totalDuration = resolvedDuration * (repeat + 1) - repeatDelay; return { generator, mirroredGenerator, mapPercentToKeyframes, calculatedDuration, resolvedDuration, totalDuration }; } onPostResolved() { const { autoplay = true } = this.options; activeAnimations.mainThread++; this.play(); if (this.pendingPlayState === "paused" || !autoplay) { this.pause(); } else { this.state = this.pendingPlayState; } } tick(timestamp, sample = false) { const { resolved } = this; if (!resolved) { const { keyframes: keyframes3 } = this.options; return { done: true, value: keyframes3[keyframes3.length - 1] }; } const { finalKeyframe, generator, mirroredGenerator, mapPercentToKeyframes, keyframes: keyframes2, calculatedDuration, totalDuration, resolvedDuration } = resolved; if (this.startTime === null) return generator.next(0); const { delay: delay2, repeat, repeatType, repeatDelay, onUpdate } = this.options; if (this.speed > 0) { this.startTime = Math.min(this.startTime, timestamp); } else if (this.speed < 0) { this.startTime = Math.min(timestamp - totalDuration / this.speed, this.startTime); } if (sample) { this.currentTime = timestamp; } else if (this.holdTime !== null) { this.currentTime = this.holdTime; } else { this.currentTime = Math.round(timestamp - this.startTime) * this.speed; } const timeWithoutDelay = this.currentTime - delay2 * (this.speed >= 0 ? 1 : -1); const isInDelayPhase = this.speed >= 0 ? timeWithoutDelay < 0 : timeWithoutDelay > totalDuration; this.currentTime = Math.max(timeWithoutDelay, 0); if (this.state === "finished" && this.holdTime === null) { this.currentTime = totalDuration; } let elapsed = this.currentTime; let frameGenerator = generator; if (repeat) { const progress2 = Math.min(this.currentTime, totalDuration) / resolvedDuration; let currentIteration = Math.floor(progress2); let iterationProgress = progress2 % 1; if (!iterationProgress && progress2 >= 1) { iterationProgress = 1; } iterationProgress === 1 && currentIteration--; currentIteration = Math.min(currentIteration, repeat + 1); const isOddIteration = Boolean(currentIteration % 2); if (isOddIteration) { if (repeatType === "reverse") { iterationProgress = 1 - iterationProgress; if (repeatDelay) { iterationProgress -= repeatDelay / resolvedDuration; } } else if (repeatType === "mirror") { frameGenerator = mirroredGenerator; } } elapsed = clamp(0, 1, iterationProgress) * resolvedDuration; } const state = isInDelayPhase ? { done: false, value: keyframes2[0] } : frameGenerator.next(elapsed); if (mapPercentToKeyframes) { state.value = mapPercentToKeyframes(state.value); } let { done } = state; if (!isInDelayPhase && calculatedDuration !== null) { done = this.speed >= 0 ? this.currentTime >= totalDuration : this.currentTime <= 0; } const isAnimationFinished = this.holdTime === null && (this.state === "finished" || this.state === "running" && done); if (isAnimationFinished && finalKeyframe !== void 0) { state.value = getFinalKeyframe(keyframes2, this.options, finalKeyframe); } if (onUpdate) { onUpdate(state.value); } if (isAnimationFinished) { this.finish(); } return state; } get duration() { const { resolved } = this; return resolved ? millisecondsToSeconds(resolved.calculatedDuration) : 0; } get time() { return millisecondsToSeconds(this.currentTime); } set time(newTime) { newTime = secondsToMilliseconds(newTime); this.currentTime = newTime; if (this.holdTime !== null || this.speed === 0) { this.holdTime = newTime; } else if (this.driver) { this.startTime = this.driver.now() - newTime / this.speed; } } get speed() { return this.playbackSpeed; } set speed(newSpeed) { const hasChanged = this.playbackSpeed !== newSpeed; this.playbackSpeed = newSpeed; if (hasChanged) { this.time = millisecondsToSeconds(this.currentTime); } } play() { if (!this.resolver.isScheduled) { this.resolver.resume(); } if (!this._resolved) { this.pendingPlayState = "running"; return; } if (this.isStopped) return; const { driver = frameloopDriver, onPlay, startTime } = this.options; if (!this.driver) { this.driver = driver((timestamp) => this.tick(timestamp)); } onPlay && onPlay(); const now2 = this.driver.now(); if (this.holdTime !== null) { this.startTime = now2 - this.holdTime; } else if (!this.startTime) { this.startTime = startTime ?? this.calcStartTime(); } else if (this.state === "finished") { this.startTime = now2; } if (this.state === "finished") { this.updateFinishedPromise(); } this.cancelTime = this.startTime; this.holdTime = null; this.state = "running"; this.driver.start(); } pause() { if (!this._resolved) { this.pendingPlayState = "paused"; return; } this.state = "paused"; this.holdTime = this.currentTime ?? 0; } complete() { if (this.state !== "running") { this.play(); } this.pendingPlayState = this.state = "finished"; this.holdTime = null; } finish() { this.teardown(); this.state = "finished"; const { onComplete } = this.options; onComplete && onComplete(); } cancel() { if (this.cancelTime !== null) { this.tick(this.cancelTime); } this.teardown(); this.updateFinishedPromise(); } teardown() { this.state = "idle"; this.stopDriver(); this.resolveFinishedPromise(); this.updateFinishedPromise(); this.startTime = this.cancelTime = null; this.resolver.cancel(); activeAnimations.mainThread--; } stopDriver() { if (!this.driver) return; this.driver.stop(); this.driver = void 0; } sample(time2) { this.startTime = 0; return this.tick(time2, true); } get finished() { return this.currentFinishedPromise; } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/utils/accelerated-values.mjs init_injected_globals(); var acceleratedValues = /* @__PURE__ */ new Set([ "opacity", "clipPath", "filter", "transform" // TODO: Can be accelerated but currently disabled until https://issues.chromium.org/issues/41491098 is resolved // or until we implement support for linear() easing. // "background-color" ]); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/waapi/utils/supports-waapi.mjs init_injected_globals(); var supportsWaapi = /* @__PURE__ */ memo(() => Object.hasOwnProperty.call(Element.prototype, "animate")); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/start-waapi-animation.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/easing/cubic-bezier.mjs init_injected_globals(); var cubicBezierAsString = ([a, b, c, d]) => `cubic-bezier(${a}, ${b}, ${c}, ${d})`; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/easing/supported.mjs init_injected_globals(); var supportedWaapiEasing = { linear: "linear", ease: "ease", easeIn: "ease-in", easeOut: "ease-out", easeInOut: "ease-in-out", circIn: /* @__PURE__ */ cubicBezierAsString([0, 0.65, 0.55, 1]), circOut: /* @__PURE__ */ cubicBezierAsString([0.55, 0, 1, 0.45]), backIn: /* @__PURE__ */ cubicBezierAsString([0.31, 0.01, 0.66, -0.59]), backOut: /* @__PURE__ */ cubicBezierAsString([0.33, 1.53, 0.69, 0.99]) }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/easing/map-easing.mjs function mapEasingToNativeEasing(easing, duration) { if (!easing) { return void 0; } else if (typeof easing === "function" && supportsLinearEasing()) { return generateLinearEasing(easing, duration); } else if (isBezierDefinition(easing)) { return cubicBezierAsString(easing); } else if (Array.isArray(easing)) { return easing.map((segmentEasing) => mapEasingToNativeEasing(segmentEasing, duration) || supportedWaapiEasing.easeOut); } else { return supportedWaapiEasing[easing]; } } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/start-waapi-animation.mjs function startWaapiAnimation(element, valueName, keyframes2, { delay: delay2 = 0, duration = 300, repeat = 0, repeatType = "loop", ease: ease2 = "easeInOut", times } = {}, pseudoElement = void 0) { const keyframeOptions = { [valueName]: keyframes2 }; if (times) keyframeOptions.offset = times; const easing = mapEasingToNativeEasing(ease2, duration); if (Array.isArray(easing)) keyframeOptions.easing = easing; if (statsBuffer.value) { activeAnimations.waapi++; } const animation = element.animate(keyframeOptions, { delay: delay2, duration, easing: !Array.isArray(easing) ? easing : "linear", fill: "both", iterations: repeat + 1, direction: repeatType === "reverse" ? "alternate" : "normal", pseudoElement }); if (statsBuffer.value) { animation.finished.finally(() => { activeAnimations.waapi--; }); } return animation; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/utils/attach-timeline.mjs init_injected_globals(); function attachTimeline(animation, timeline) { animation.timeline = timeline; animation.onfinish = null; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/waapi/easing/is-supported.mjs init_injected_globals(); function isWaapiSupportedEasing(easing) { return Boolean(typeof easing === "function" && supportsLinearEasing() || !easing || typeof easing === "string" && (easing in supportedWaapiEasing || supportsLinearEasing()) || isBezierDefinition(easing) || Array.isArray(easing) && easing.every(isWaapiSupportedEasing)); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs var sampleDelta = 10; var maxDuration = 2e4; function requiresPregeneratedKeyframes(options) { return isGenerator(options.type) || options.type === "spring" || !isWaapiSupportedEasing(options.ease); } function pregenerateKeyframes(keyframes2, options) { const sampleAnimation = new MainThreadAnimation({ ...options, keyframes: keyframes2, repeat: 0, delay: 0, isGenerator: true }); let state = { done: false, value: keyframes2[0] }; const pregeneratedKeyframes = []; let t = 0; while (!state.done && t < maxDuration) { state = sampleAnimation.sample(t); pregeneratedKeyframes.push(state.value); t += sampleDelta; } return { times: void 0, keyframes: pregeneratedKeyframes, duration: t - sampleDelta, ease: "linear" }; } var unsupportedEasingFunctions = { anticipate, backInOut, circInOut }; function isUnsupportedEase(key) { return key in unsupportedEasingFunctions; } var AcceleratedAnimation = class extends BaseAnimation { constructor(options) { super(options); const { name, motionValue: motionValue2, element, keyframes: keyframes2 } = this.options; this.resolver = new DOMKeyframesResolver(keyframes2, (resolvedKeyframes, finalKeyframe) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe), name, motionValue2, element); this.resolver.scheduleResolve(); } initPlayback(keyframes2, finalKeyframe) { let { duration = 300, times, ease: ease2, type, motionValue: motionValue2, name, startTime } = this.options; if (!motionValue2.owner || !motionValue2.owner.current) { return false; } if (typeof ease2 === "string" && supportsLinearEasing() && isUnsupportedEase(ease2)) { ease2 = unsupportedEasingFunctions[ease2]; } if (requiresPregeneratedKeyframes(this.options)) { const { onComplete, onUpdate, motionValue: motionValue3, element, ...options } = this.options; const pregeneratedAnimation = pregenerateKeyframes(keyframes2, options); keyframes2 = pregeneratedAnimation.keyframes; if (keyframes2.length === 1) { keyframes2[1] = keyframes2[0]; } duration = pregeneratedAnimation.duration; times = pregeneratedAnimation.times; ease2 = pregeneratedAnimation.ease; type = "keyframes"; } const animation = startWaapiAnimation(motionValue2.owner.current, name, keyframes2, { ...this.options, duration, times, ease: ease2 }); animation.startTime = startTime ?? this.calcStartTime(); if (this.pendingTimeline) { attachTimeline(animation, this.pendingTimeline); this.pendingTimeline = void 0; } else { animation.onfinish = () => { const { onComplete } = this.options; motionValue2.set(getFinalKeyframe(keyframes2, this.options, finalKeyframe)); onComplete && onComplete(); this.cancel(); this.resolveFinishedPromise(); }; } return { animation, duration, times, type, ease: ease2, keyframes: keyframes2 }; } get duration() { const { resolved } = this; if (!resolved) return 0; const { duration } = resolved; return millisecondsToSeconds(duration); } get time() { const { resolved } = this; if (!resolved) return 0; const { animation } = resolved; return millisecondsToSeconds(animation.currentTime || 0); } set time(newTime) { const { resolved } = this; if (!resolved) return; const { animation } = resolved; animation.currentTime = secondsToMilliseconds(newTime); } get speed() { const { resolved } = this; if (!resolved) return 1; const { animation } = resolved; return animation.playbackRate; } get finished() { return this.resolved.animation.finished; } set speed(newSpeed) { const { resolved } = this; if (!resolved) return; const { animation } = resolved; animation.playbackRate = newSpeed; } get state() { const { resolved } = this; if (!resolved) return "idle"; const { animation } = resolved; return animation.playState; } get startTime() { const { resolved } = this; if (!resolved) return null; const { animation } = resolved; return animation.startTime; } /** * Replace the default DocumentTimeline with another AnimationTimeline. * Currently used for scroll animations. */ attachTimeline(timeline) { if (!this._resolved) { this.pendingTimeline = timeline; } else { const { resolved } = this; if (!resolved) return noop3; const { animation } = resolved; attachTimeline(animation, timeline); } return noop3; } play() { if (this.isStopped) return; const { resolved } = this; if (!resolved) return; const { animation } = resolved; if (animation.playState === "finished") { this.updateFinishedPromise(); } animation.play(); } pause() { const { resolved } = this; if (!resolved) return; const { animation } = resolved; animation.pause(); } stop() { this.resolver.cancel(); this.isStopped = true; if (this.state === "idle") return; this.resolveFinishedPromise(); this.updateFinishedPromise(); const { resolved } = this; if (!resolved) return; const { animation, keyframes: keyframes2, duration, type, ease: ease2, times } = resolved; if (animation.playState === "idle" || animation.playState === "finished") { return; } if (this.time) { const { motionValue: motionValue2, onUpdate, onComplete, element, ...options } = this.options; const sampleAnimation = new MainThreadAnimation({ ...options, keyframes: keyframes2, duration, type, ease: ease2, times, isGenerator: true }); const sampleTime = secondsToMilliseconds(this.time); motionValue2.setWithVelocity(sampleAnimation.sample(sampleTime - sampleDelta).value, sampleAnimation.sample(sampleTime).value, sampleDelta); } const { onStop } = this.options; onStop && onStop(); this.cancel(); } complete() { const { resolved } = this; if (!resolved) return; resolved.animation.finish(); } cancel() { const { resolved } = this; if (!resolved) return; resolved.animation.cancel(); } static supports(options) { const { motionValue: motionValue2, name, repeatDelay, repeatType, damping, type } = options; if (!motionValue2 || !motionValue2.owner || !(motionValue2.owner.current instanceof HTMLElement)) { return false; } const { onUpdate, transformTemplate } = motionValue2.owner.getProps(); return supportsWaapi() && name && acceleratedValues.has(name) && (name !== "transform" || !transformTemplate) && /** * If we're outputting values to onUpdate then we can't use WAAPI as there's * no way to read the value from WAAPI every frame. */ !onUpdate && !repeatDelay && repeatType !== "mirror" && damping !== 0 && type !== "inertia"; } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/default-transitions.mjs init_injected_globals(); var underDampedSpring = { type: "spring", stiffness: 500, damping: 25, restSpeed: 10 }; var criticallyDampedSpring = (target) => ({ type: "spring", stiffness: 550, damping: target === 0 ? 2 * Math.sqrt(550) : 30, restSpeed: 10 }); var keyframesTransition = { type: "keyframes", duration: 0.8 }; var ease = { type: "keyframes", ease: [0.25, 0.1, 0.35, 1], duration: 0.3 }; var getDefaultTransition = (valueKey, { keyframes: keyframes2 }) => { if (keyframes2.length > 2) { return keyframesTransition; } else if (transformProps.has(valueKey)) { return valueKey.startsWith("scale") ? criticallyDampedSpring(keyframes2[1]) : underDampedSpring; } return ease; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/utils/is-transition-defined.mjs init_injected_globals(); function isTransitionDefined({ when, delay: _delay, delayChildren, staggerChildren, staggerDirection, repeat, repeatType, repeatDelay, from, elapsed, ...transition }) { return !!Object.keys(transition).length; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/utils/get-value-transition.mjs init_injected_globals(); function getValueTransition(transition, key) { return transition?.[key] ?? transition?.["default"] ?? transition; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/GroupAnimation.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/utils/supports/scroll-timeline.mjs init_injected_globals(); var supportsScrollTimeline = /* @__PURE__ */ memo(() => window.ScrollTimeline !== void 0); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/GroupAnimation.mjs var GroupAnimation = class { constructor(animations2) { this.stop = () => this.runAll("stop"); this.animations = animations2.filter(Boolean); } get finished() { return Promise.all(this.animations.map((animation) => animation.finished)); } /** * TODO: Filter out cancelled or stopped animations before returning */ getAll(propName) { return this.animations[0][propName]; } setAll(propName, newValue) { for (let i = 0; i < this.animations.length; i++) { this.animations[i][propName] = newValue; } } attachTimeline(timeline, fallback) { const subscriptions = this.animations.map((animation) => { if (supportsScrollTimeline() && animation.attachTimeline) { return animation.attachTimeline(timeline); } else if (typeof fallback === "function") { return fallback(animation); } }); return () => { subscriptions.forEach((cancel, i) => { cancel && cancel(); this.animations[i].stop(); }); }; } get time() { return this.getAll("time"); } set time(time2) { this.setAll("time", time2); } get speed() { return this.getAll("speed"); } set speed(speed) { this.setAll("speed", speed); } get startTime() { return this.getAll("startTime"); } get duration() { let max = 0; for (let i = 0; i < this.animations.length; i++) { max = Math.max(max, this.animations[i].duration); } return max; } runAll(methodName) { this.animations.forEach((controls) => controls[methodName]()); } flatten() { this.runAll("flatten"); } play() { this.runAll("play"); } pause() { this.runAll("pause"); } cancel() { this.runAll("cancel"); } complete() { this.runAll("complete"); } }; // ../../../node_modules/motion/dist/es/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs var GroupAnimationWithThen = class extends GroupAnimation { then(onResolve, _onReject) { return this.finished.finally(onResolve).then(() => { }); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/motion-value.mjs var animateMotionValue = (name, value, target, transition = {}, element, isHandoff) => (onComplete) => { const valueTransition = getValueTransition(transition, name) || {}; const delay2 = valueTransition.delay || transition.delay || 0; let { elapsed = 0 } = transition; elapsed = elapsed - secondsToMilliseconds(delay2); let options = { keyframes: Array.isArray(target) ? target : [null, target], ease: "easeOut", velocity: value.getVelocity(), ...valueTransition, delay: -elapsed, onUpdate: (v) => { value.set(v); valueTransition.onUpdate && valueTransition.onUpdate(v); }, onComplete: () => { onComplete(); valueTransition.onComplete && valueTransition.onComplete(); }, name, motionValue: value, element: isHandoff ? void 0 : element }; if (!isTransitionDefined(valueTransition)) { options = { ...options, ...getDefaultTransition(name, options) }; } if (options.duration) { options.duration = secondsToMilliseconds(options.duration); } if (options.repeatDelay) { options.repeatDelay = secondsToMilliseconds(options.repeatDelay); } if (options.from !== void 0) { options.keyframes[0] = options.from; } let shouldSkip = false; if (options.type === false || options.duration === 0 && !options.repeatDelay) { options.duration = 0; if (options.delay === 0) { shouldSkip = true; } } if (instantAnimationState.current || MotionGlobalConfig.skipAnimations) { shouldSkip = true; options.duration = 0; options.delay = 0; } options.allowFlatten = !valueTransition.type && !valueTransition.ease; if (shouldSkip && !isHandoff && value.get() !== void 0) { const finalKeyframe = getFinalKeyframe(options.keyframes, valueTransition); if (finalKeyframe !== void 0) { frame.update(() => { options.onUpdate(finalKeyframe); options.onComplete(); }); return new GroupAnimationWithThen([]); } } if (!isHandoff && AcceleratedAnimation.supports(options)) { return new AcceleratedAnimation(options); } else { return new MainThreadAnimation(options); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) { const shouldBlock = protectedKeys.hasOwnProperty(key) && needsAnimating[key] !== true; needsAnimating[key] = false; return shouldBlock; } function animateTarget(visualElement, targetAndTransition, { delay: delay2 = 0, transitionOverride, type } = {}) { let { transition = visualElement.getDefaultTransition(), transitionEnd, ...target } = targetAndTransition; if (transitionOverride) transition = transitionOverride; const animations2 = []; const animationTypeState = type && visualElement.animationState && visualElement.animationState.getState()[type]; for (const key in target) { const value = visualElement.getValue(key, visualElement.latestValues[key] ?? null); const valueTarget = target[key]; if (valueTarget === void 0 || animationTypeState && shouldBlockAnimation(animationTypeState, key)) { continue; } const valueTransition = { delay: delay2, ...getValueTransition(transition || {}, key) }; let isHandoff = false; if (window.MotionHandoffAnimation) { const appearId = getOptimisedAppearId(visualElement); if (appearId) { const startTime = window.MotionHandoffAnimation(appearId, key, frame); if (startTime !== null) { valueTransition.startTime = startTime; isHandoff = true; } } } addValueToWillChange(visualElement, key); value.start(animateMotionValue(key, value, valueTarget, visualElement.shouldReduceMotion && positionalKeys.has(key) ? { type: false } : valueTransition, visualElement, isHandoff)); const animation = value.animation; if (animation) { animations2.push(animation); } } if (transitionEnd) { Promise.all(animations2).then(() => { frame.update(() => { transitionEnd && setTarget(visualElement, transitionEnd); }); }); } return animations2; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs init_injected_globals(); function animateVariant(visualElement, variant, options = {}) { const resolved = resolveVariant(visualElement, variant, options.type === "exit" ? visualElement.presenceContext?.custom : void 0); let { transition = visualElement.getDefaultTransition() || {} } = resolved || {}; if (options.transitionOverride) { transition = options.transitionOverride; } const getAnimation = resolved ? () => Promise.all(animateTarget(visualElement, resolved, options)) : () => Promise.resolve(); const getChildAnimations = visualElement.variantChildren && visualElement.variantChildren.size ? (forwardDelay = 0) => { const { delayChildren = 0, staggerChildren, staggerDirection } = transition; return animateChildren(visualElement, variant, delayChildren + forwardDelay, staggerChildren, staggerDirection, options); } : () => Promise.resolve(); const { when } = transition; if (when) { const [first, last] = when === "beforeChildren" ? [getAnimation, getChildAnimations] : [getChildAnimations, getAnimation]; return first().then(() => last()); } else { return Promise.all([getAnimation(), getChildAnimations(options.delay)]); } } function animateChildren(visualElement, variant, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) { const animations2 = []; const maxStaggerDuration = (visualElement.variantChildren.size - 1) * staggerChildren; const generateStaggerDuration = staggerDirection === 1 ? (i = 0) => i * staggerChildren : (i = 0) => maxStaggerDuration - i * staggerChildren; Array.from(visualElement.variantChildren).sort(sortByTreeOrder).forEach((child, i) => { child.notify("AnimationStart", variant); animations2.push(animateVariant(child, variant, { ...options, delay: delayChildren + generateStaggerDuration(i) }).then(() => child.notify("AnimationComplete", variant))); }); return Promise.all(animations2); } function sortByTreeOrder(a, b) { return a.sortNodePosition(b); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/interfaces/visual-element.mjs function animateVisualElement(visualElement, definition, options = {}) { visualElement.notify("AnimationStart", definition); let animation; if (Array.isArray(definition)) { const animations2 = definition.map((variant) => animateVariant(visualElement, variant, options)); animation = Promise.all(animations2); } else if (typeof definition === "string") { animation = animateVariant(visualElement, definition, options); } else { const resolvedDefinition = typeof definition === "function" ? resolveVariant(visualElement, definition, options.custom) : definition; animation = Promise.all(animateTarget(visualElement, resolvedDefinition, options)); } return animation.then(() => { visualElement.notify("AnimationComplete", definition); }); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/shallow-compare.mjs init_injected_globals(); function shallowCompare(next, prev) { if (!Array.isArray(prev)) return false; const prevLength = prev.length; if (prevLength !== next.length) return false; for (let i = 0; i < prevLength; i++) { if (prev[i] !== next[i]) return false; } return true; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/get-variant-context.mjs init_injected_globals(); var numVariantProps = variantProps.length; function getVariantContext(visualElement) { if (!visualElement) return void 0; if (!visualElement.isControllingVariants) { const context2 = visualElement.parent ? getVariantContext(visualElement.parent) || {} : {}; if (visualElement.props.initial !== void 0) { context2.initial = visualElement.props.initial; } return context2; } const context = {}; for (let i = 0; i < numVariantProps; i++) { const name = variantProps[i]; const prop = visualElement.props[name]; if (isVariantLabel(prop) || prop === false) { context[name] = prop; } } return context; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/animation-state.mjs var reversePriorityOrder = [...variantPriorityOrder].reverse(); var numAnimationTypes = variantPriorityOrder.length; function animateList(visualElement) { return (animations2) => Promise.all(animations2.map(({ animation, options }) => animateVisualElement(visualElement, animation, options))); } function createAnimationState(visualElement) { let animate = animateList(visualElement); let state = createState(); let isInitialRender = true; const buildResolvedTypeValues = (type) => (acc, definition) => { const resolved = resolveVariant(visualElement, definition, type === "exit" ? visualElement.presenceContext?.custom : void 0); if (resolved) { const { transition, transitionEnd, ...target } = resolved; acc = { ...acc, ...target, ...transitionEnd }; } return acc; }; function setAnimateFunction(makeAnimator) { animate = makeAnimator(visualElement); } function animateChanges(changedActiveType) { const { props } = visualElement; const context = getVariantContext(visualElement.parent) || {}; const animations2 = []; const removedKeys = /* @__PURE__ */ new Set(); let encounteredKeys = {}; let removedVariantIndex = Infinity; for (let i = 0; i < numAnimationTypes; i++) { const type = reversePriorityOrder[i]; const typeState = state[type]; const prop = props[type] !== void 0 ? props[type] : context[type]; const propIsVariant = isVariantLabel(prop); const activeDelta = type === changedActiveType ? typeState.isActive : null; if (activeDelta === false) removedVariantIndex = i; let isInherited = prop === context[type] && prop !== props[type] && propIsVariant; if (isInherited && isInitialRender && visualElement.manuallyAnimateOnMount) { isInherited = false; } typeState.protectedKeys = { ...encounteredKeys }; if ( // If it isn't active and hasn't *just* been set as inactive !typeState.isActive && activeDelta === null || // If we didn't and don't have any defined prop for this animation type !prop && !typeState.prevProp || // Or if the prop doesn't define an animation isAnimationControls(prop) || typeof prop === "boolean" ) { continue; } const variantDidChange = checkVariantsDidChange(typeState.prevProp, prop); let shouldAnimateType = variantDidChange || // If we're making this variant active, we want to always make it active type === changedActiveType && typeState.isActive && !isInherited && propIsVariant || // If we removed a higher-priority variant (i is in reverse order) i > removedVariantIndex && propIsVariant; let handledRemovedValues = false; const definitionList = Array.isArray(prop) ? prop : [prop]; let resolvedValues = definitionList.reduce(buildResolvedTypeValues(type), {}); if (activeDelta === false) resolvedValues = {}; const { prevResolvedValues = {} } = typeState; const allKeys = { ...prevResolvedValues, ...resolvedValues }; const markToAnimate = (key) => { shouldAnimateType = true; if (removedKeys.has(key)) { handledRemovedValues = true; removedKeys.delete(key); } typeState.needsAnimating[key] = true; const motionValue2 = visualElement.getValue(key); if (motionValue2) motionValue2.liveStyle = false; }; for (const key in allKeys) { const next = resolvedValues[key]; const prev = prevResolvedValues[key]; if (encounteredKeys.hasOwnProperty(key)) continue; let valueHasChanged = false; if (isKeyframesTarget(next) && isKeyframesTarget(prev)) { valueHasChanged = !shallowCompare(next, prev); } else { valueHasChanged = next !== prev; } if (valueHasChanged) { if (next !== void 0 && next !== null) { markToAnimate(key); } else { removedKeys.add(key); } } else if (next !== void 0 && removedKeys.has(key)) { markToAnimate(key); } else { typeState.protectedKeys[key] = true; } } typeState.prevProp = prop; typeState.prevResolvedValues = resolvedValues; if (typeState.isActive) { encounteredKeys = { ...encounteredKeys, ...resolvedValues }; } if (isInitialRender && visualElement.blockInitialAnimation) { shouldAnimateType = false; } const willAnimateViaParent = isInherited && variantDidChange; const needsAnimating = !willAnimateViaParent || handledRemovedValues; if (shouldAnimateType && needsAnimating) { animations2.push(...definitionList.map((animation) => ({ animation, options: { type } }))); } } if (removedKeys.size) { const fallbackAnimation = {}; if (typeof props.initial !== "boolean") { const initialTransition = resolveVariant(visualElement, Array.isArray(props.initial) ? props.initial[0] : props.initial); if (initialTransition && initialTransition.transition) { fallbackAnimation.transition = initialTransition.transition; } } removedKeys.forEach((key) => { const fallbackTarget = visualElement.getBaseTarget(key); const motionValue2 = visualElement.getValue(key); if (motionValue2) motionValue2.liveStyle = true; fallbackAnimation[key] = fallbackTarget ?? null; }); animations2.push({ animation: fallbackAnimation }); } let shouldAnimate = Boolean(animations2.length); if (isInitialRender && (props.initial === false || props.initial === props.animate) && !visualElement.manuallyAnimateOnMount) { shouldAnimate = false; } isInitialRender = false; return shouldAnimate ? animate(animations2) : Promise.resolve(); } function setActive(type, isActive) { if (state[type].isActive === isActive) return Promise.resolve(); visualElement.variantChildren?.forEach((child) => child.animationState?.setActive(type, isActive)); state[type].isActive = isActive; const animations2 = animateChanges(type); for (const key in state) { state[key].protectedKeys = {}; } return animations2; } return { animateChanges, setActive, setAnimateFunction, getState: () => state, reset: () => { state = createState(); isInitialRender = true; } }; } function checkVariantsDidChange(prev, next) { if (typeof next === "string") { return next !== prev; } else if (Array.isArray(next)) { return !shallowCompare(next, prev); } return false; } function createTypeState(isActive = false) { return { isActive, protectedKeys: {}, needsAnimating: {}, prevResolvedValues: {} }; } function createState() { return { animate: createTypeState(true), whileInView: createTypeState(), whileHover: createTypeState(), whileTap: createTypeState(), whileDrag: createTypeState(), whileFocus: createTypeState(), exit: createTypeState() }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/Feature.mjs init_injected_globals(); var Feature = class { constructor(node) { this.isMounted = false; this.node = node; } update() { } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/animation/index.mjs var AnimationFeature = class extends Feature { /** * We dynamically generate the AnimationState manager as it contains a reference * to the underlying animation library. We only want to load that if we load this, * so people can optionally code split it out using the `m` component. */ constructor(node) { super(node); node.animationState || (node.animationState = createAnimationState(node)); } updateAnimationControlsSubscription() { const { animate } = this.node.getProps(); if (isAnimationControls(animate)) { this.unmountControls = animate.subscribe(this.node); } } /** * Subscribe any provided AnimationControls to the component's VisualElement */ mount() { this.updateAnimationControlsSubscription(); } update() { const { animate } = this.node.getProps(); const { animate: prevAnimate } = this.node.prevProps || {}; if (animate !== prevAnimate) { this.updateAnimationControlsSubscription(); } } unmount() { this.node.animationState.reset(); this.unmountControls?.(); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/animation/exit.mjs init_injected_globals(); var id = 0; var ExitAnimationFeature = class extends Feature { constructor() { super(...arguments); this.id = id++; } update() { if (!this.node.presenceContext) return; const { isPresent, onExitComplete } = this.node.presenceContext; const { isPresent: prevIsPresent } = this.node.prevPresenceContext || {}; if (!this.node.animationState || isPresent === prevIsPresent) { return; } const exitAnimation = this.node.animationState.setActive("exit", !isPresent); if (onExitComplete && !isPresent) { exitAnimation.then(() => { onExitComplete(this.id); }); } } mount() { const { register, onExitComplete } = this.node.presenceContext || {}; if (onExitComplete) { onExitComplete(this.id); } if (register) { this.unmount = register(this.id); } } unmount() { } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/animations.mjs var animations = { animation: { Feature: AnimationFeature }, exit: { Feature: ExitAnimationFeature } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/drag.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/drag/index.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/events/add-dom-event.mjs init_injected_globals(); function addDomEvent(target, eventName, handler, options = { passive: true }) { target.addEventListener(eventName, handler, options); return () => target.removeEventListener(eventName, handler); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/events/add-pointer-event.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/events/event-info.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/gestures/utils/is-primary-pointer.mjs init_injected_globals(); var isPrimaryPointer = (event) => { if (event.pointerType === "mouse") { return typeof event.button !== "number" || event.button <= 0; } else { return event.isPrimary !== false; } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/events/event-info.mjs function extractEventInfo(event) { return { point: { x: event.pageX, y: event.pageY } }; } var addPointerInfo = (handler) => { return (event) => isPrimaryPointer(event) && handler(event, extractEventInfo(event)); }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/events/add-pointer-event.mjs function addPointerEvent(target, eventName, handler, options) { return addDomEvent(target, eventName, addPointerInfo(handler), options); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/conversion.mjs init_injected_globals(); function convertBoundingBoxToBox({ top, left, right, bottom }) { return { x: { min: left, max: right }, y: { min: top, max: bottom } }; } function convertBoxToBoundingBox({ x, y }) { return { top: y.min, right: x.max, bottom: y.max, left: x.min }; } function transformBoxPoints(point, transformPoint2) { if (!transformPoint2) return point; const topLeft = transformPoint2({ x: point.left, y: point.top }); const bottomRight = transformPoint2({ x: point.right, y: point.bottom }); return { top: topLeft.y, left: topLeft.x, bottom: bottomRight.y, right: bottomRight.x }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/delta-calc.mjs init_injected_globals(); var SCALE_PRECISION = 1e-4; var SCALE_MIN = 1 - SCALE_PRECISION; var SCALE_MAX = 1 + SCALE_PRECISION; var TRANSLATE_PRECISION = 0.01; var TRANSLATE_MIN = 0 - TRANSLATE_PRECISION; var TRANSLATE_MAX = 0 + TRANSLATE_PRECISION; function calcLength(axis) { return axis.max - axis.min; } function isNear(value, target, maxDistance) { return Math.abs(value - target) <= maxDistance; } function calcAxisDelta(delta, source, target, origin = 0.5) { delta.origin = origin; delta.originPoint = mixNumber(source.min, source.max, delta.origin); delta.scale = calcLength(target) / calcLength(source); delta.translate = mixNumber(target.min, target.max, delta.origin) - delta.originPoint; if (delta.scale >= SCALE_MIN && delta.scale <= SCALE_MAX || isNaN(delta.scale)) { delta.scale = 1; } if (delta.translate >= TRANSLATE_MIN && delta.translate <= TRANSLATE_MAX || isNaN(delta.translate)) { delta.translate = 0; } } function calcBoxDelta(delta, source, target, origin) { calcAxisDelta(delta.x, source.x, target.x, origin ? origin.originX : void 0); calcAxisDelta(delta.y, source.y, target.y, origin ? origin.originY : void 0); } function calcRelativeAxis(target, relative, parent) { target.min = parent.min + relative.min; target.max = target.min + calcLength(relative); } function calcRelativeBox(target, relative, parent) { calcRelativeAxis(target.x, relative.x, parent.x); calcRelativeAxis(target.y, relative.y, parent.y); } function calcRelativeAxisPosition(target, layout2, parent) { target.min = layout2.min - parent.min; target.max = target.min + calcLength(layout2); } function calcRelativePosition(target, layout2, parent) { calcRelativeAxisPosition(target.x, layout2.x, parent.x); calcRelativeAxisPosition(target.y, layout2.y, parent.y); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/models.mjs init_injected_globals(); var createAxisDelta = () => ({ translate: 0, scale: 1, origin: 0, originPoint: 0 }); var createDelta = () => ({ x: createAxisDelta(), y: createAxisDelta() }); var createAxis = () => ({ min: 0, max: 0 }); var createBox = () => ({ x: createAxis(), y: createAxis() }); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/utils/each-axis.mjs init_injected_globals(); function eachAxis(callback) { return [callback("x"), callback("y")]; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/utils/measure.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/delta-apply.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/utils/has-transform.mjs init_injected_globals(); function isIdentityScale(scale2) { return scale2 === void 0 || scale2 === 1; } function hasScale({ scale: scale2, scaleX: scaleX2, scaleY: scaleY2 }) { return !isIdentityScale(scale2) || !isIdentityScale(scaleX2) || !isIdentityScale(scaleY2); } function hasTransform(values) { return hasScale(values) || has2DTranslate(values) || values.z || values.rotate || values.rotateX || values.rotateY || values.skewX || values.skewY; } function has2DTranslate(values) { return is2DTranslate(values.x) || is2DTranslate(values.y); } function is2DTranslate(value) { return value && value !== "0%"; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/delta-apply.mjs function scalePoint(point, scale2, originPoint) { const distanceFromOrigin = point - originPoint; const scaled = scale2 * distanceFromOrigin; return originPoint + scaled; } function applyPointDelta(point, translate, scale2, originPoint, boxScale) { if (boxScale !== void 0) { point = scalePoint(point, boxScale, originPoint); } return scalePoint(point, scale2, originPoint) + translate; } function applyAxisDelta(axis, translate = 0, scale2 = 1, originPoint, boxScale) { axis.min = applyPointDelta(axis.min, translate, scale2, originPoint, boxScale); axis.max = applyPointDelta(axis.max, translate, scale2, originPoint, boxScale); } function applyBoxDelta(box, { x, y }) { applyAxisDelta(box.x, x.translate, x.scale, x.originPoint); applyAxisDelta(box.y, y.translate, y.scale, y.originPoint); } var TREE_SCALE_SNAP_MIN = 0.999999999999; var TREE_SCALE_SNAP_MAX = 1.0000000000001; function applyTreeDeltas(box, treeScale, treePath, isSharedTransition = false) { const treeLength = treePath.length; if (!treeLength) return; treeScale.x = treeScale.y = 1; let node; let delta; for (let i = 0; i < treeLength; i++) { node = treePath[i]; delta = node.projectionDelta; const { visualElement } = node.options; if (visualElement && visualElement.props.style && visualElement.props.style.display === "contents") { continue; } if (isSharedTransition && node.options.layoutScroll && node.scroll && node !== node.root) { transformBox(box, { x: -node.scroll.offset.x, y: -node.scroll.offset.y }); } if (delta) { treeScale.x *= delta.x.scale; treeScale.y *= delta.y.scale; applyBoxDelta(box, delta); } if (isSharedTransition && hasTransform(node.latestValues)) { transformBox(box, node.latestValues); } } if (treeScale.x < TREE_SCALE_SNAP_MAX && treeScale.x > TREE_SCALE_SNAP_MIN) { treeScale.x = 1; } if (treeScale.y < TREE_SCALE_SNAP_MAX && treeScale.y > TREE_SCALE_SNAP_MIN) { treeScale.y = 1; } } function translateAxis(axis, distance2) { axis.min = axis.min + distance2; axis.max = axis.max + distance2; } function transformAxis(axis, axisTranslate, axisScale, boxScale, axisOrigin = 0.5) { const originPoint = mixNumber(axis.min, axis.max, axisOrigin); applyAxisDelta(axis, axisTranslate, axisScale, originPoint, boxScale); } function transformBox(box, transform) { transformAxis(box.x, transform.x, transform.scaleX, transform.scale, transform.originX); transformAxis(box.y, transform.y, transform.scaleY, transform.scale, transform.originY); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/utils/measure.mjs function measureViewportBox(instance, transformPoint2) { return convertBoundingBoxToBox(transformBoxPoints(instance.getBoundingClientRect(), transformPoint2)); } function measurePageBox(element, rootProjectionNode2, transformPagePoint) { const viewportBox = measureViewportBox(element, transformPagePoint); const { scroll } = rootProjectionNode2; if (scroll) { translateAxis(viewportBox.x, scroll.offset.x); translateAxis(viewportBox.y, scroll.offset.y); } return viewportBox; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/get-context-window.mjs init_injected_globals(); var getContextWindow = ({ current }) => { return current ? current.ownerDocument.defaultView : null; }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/pan/PanSession.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/distance.mjs init_injected_globals(); var distance = (a, b) => Math.abs(a - b); function distance2D(a, b) { const xDelta = distance(a.x, b.x); const yDelta = distance(a.y, b.y); return Math.sqrt(xDelta ** 2 + yDelta ** 2); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/pan/PanSession.mjs var PanSession = class { constructor(event, handlers, { transformPagePoint, contextWindow, dragSnapToOrigin = false } = {}) { this.startEvent = null; this.lastMoveEvent = null; this.lastMoveEventInfo = null; this.handlers = {}; this.contextWindow = window; this.updatePoint = () => { if (!(this.lastMoveEvent && this.lastMoveEventInfo)) return; const info2 = getPanInfo(this.lastMoveEventInfo, this.history); const isPanStarted = this.startEvent !== null; const isDistancePastThreshold = distance2D(info2.offset, { x: 0, y: 0 }) >= 3; if (!isPanStarted && !isDistancePastThreshold) return; const { point: point2 } = info2; const { timestamp: timestamp2 } = frameData; this.history.push({ ...point2, timestamp: timestamp2 }); const { onStart, onMove } = this.handlers; if (!isPanStarted) { onStart && onStart(this.lastMoveEvent, info2); this.startEvent = this.lastMoveEvent; } onMove && onMove(this.lastMoveEvent, info2); }; this.handlePointerMove = (event2, info2) => { this.lastMoveEvent = event2; this.lastMoveEventInfo = transformPoint(info2, this.transformPagePoint); frame.update(this.updatePoint, true); }; this.handlePointerUp = (event2, info2) => { this.end(); const { onEnd, onSessionEnd, resumeAnimation } = this.handlers; if (this.dragSnapToOrigin) resumeAnimation && resumeAnimation(); if (!(this.lastMoveEvent && this.lastMoveEventInfo)) return; const panInfo = getPanInfo(event2.type === "pointercancel" ? this.lastMoveEventInfo : transformPoint(info2, this.transformPagePoint), this.history); if (this.startEvent && onEnd) { onEnd(event2, panInfo); } onSessionEnd && onSessionEnd(event2, panInfo); }; if (!isPrimaryPointer(event)) return; this.dragSnapToOrigin = dragSnapToOrigin; this.handlers = handlers; this.transformPagePoint = transformPagePoint; this.contextWindow = contextWindow || window; const info = extractEventInfo(event); const initialInfo = transformPoint(info, this.transformPagePoint); const { point } = initialInfo; const { timestamp } = frameData; this.history = [{ ...point, timestamp }]; const { onSessionStart } = handlers; onSessionStart && onSessionStart(event, getPanInfo(initialInfo, this.history)); this.removeListeners = pipe(addPointerEvent(this.contextWindow, "pointermove", this.handlePointerMove), addPointerEvent(this.contextWindow, "pointerup", this.handlePointerUp), addPointerEvent(this.contextWindow, "pointercancel", this.handlePointerUp)); } updateHandlers(handlers) { this.handlers = handlers; } end() { this.removeListeners && this.removeListeners(); cancelFrame(this.updatePoint); } }; function transformPoint(info, transformPagePoint) { return transformPagePoint ? { point: transformPagePoint(info.point) } : info; } function subtractPoint(a, b) { return { x: a.x - b.x, y: a.y - b.y }; } function getPanInfo({ point }, history) { return { point, delta: subtractPoint(point, lastDevicePoint(history)), offset: subtractPoint(point, startDevicePoint(history)), velocity: getVelocity(history, 0.1) }; } function startDevicePoint(history) { return history[0]; } function lastDevicePoint(history) { return history[history.length - 1]; } function getVelocity(history, timeDelta) { if (history.length < 2) { return { x: 0, y: 0 }; } let i = history.length - 1; let timestampedPoint = null; const lastPoint = lastDevicePoint(history); while (i >= 0) { timestampedPoint = history[i]; if (lastPoint.timestamp - timestampedPoint.timestamp > secondsToMilliseconds(timeDelta)) { break; } i--; } if (!timestampedPoint) { return { x: 0, y: 0 }; } const time2 = millisecondsToSeconds(lastPoint.timestamp - timestampedPoint.timestamp); if (time2 === 0) { return { x: 0, y: 0 }; } const currentVelocity = { x: (lastPoint.x - timestampedPoint.x) / time2, y: (lastPoint.y - timestampedPoint.y) / time2 }; if (currentVelocity.x === Infinity) { currentVelocity.x = 0; } if (currentVelocity.y === Infinity) { currentVelocity.y = 0; } return currentVelocity; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/drag/utils/constraints.mjs init_injected_globals(); function applyConstraints(point, { min, max }, elastic) { if (min !== void 0 && point < min) { point = elastic ? mixNumber(min, point, elastic.min) : Math.max(point, min); } else if (max !== void 0 && point > max) { point = elastic ? mixNumber(max, point, elastic.max) : Math.min(point, max); } return point; } function calcRelativeAxisConstraints(axis, min, max) { return { min: min !== void 0 ? axis.min + min : void 0, max: max !== void 0 ? axis.max + max - (axis.max - axis.min) : void 0 }; } function calcRelativeConstraints(layoutBox, { top, left, bottom, right }) { return { x: calcRelativeAxisConstraints(layoutBox.x, left, right), y: calcRelativeAxisConstraints(layoutBox.y, top, bottom) }; } function calcViewportAxisConstraints(layoutAxis, constraintsAxis) { let min = constraintsAxis.min - layoutAxis.min; let max = constraintsAxis.max - layoutAxis.max; if (constraintsAxis.max - constraintsAxis.min < layoutAxis.max - layoutAxis.min) { [min, max] = [max, min]; } return { min, max }; } function calcViewportConstraints(layoutBox, constraintsBox) { return { x: calcViewportAxisConstraints(layoutBox.x, constraintsBox.x), y: calcViewportAxisConstraints(layoutBox.y, constraintsBox.y) }; } function calcOrigin2(source, target) { let origin = 0.5; const sourceLength = calcLength(source); const targetLength = calcLength(target); if (targetLength > sourceLength) { origin = progress(target.min, target.max - sourceLength, source.min); } else if (sourceLength > targetLength) { origin = progress(source.min, source.max - targetLength, target.min); } return clamp(0, 1, origin); } function rebaseAxisConstraints(layout2, constraints) { const relativeConstraints = {}; if (constraints.min !== void 0) { relativeConstraints.min = constraints.min - layout2.min; } if (constraints.max !== void 0) { relativeConstraints.max = constraints.max - layout2.min; } return relativeConstraints; } var defaultElastic = 0.35; function resolveDragElastic(dragElastic = defaultElastic) { if (dragElastic === false) { dragElastic = 0; } else if (dragElastic === true) { dragElastic = defaultElastic; } return { x: resolveAxisElastic(dragElastic, "left", "right"), y: resolveAxisElastic(dragElastic, "top", "bottom") }; } function resolveAxisElastic(dragElastic, minLabel, maxLabel) { return { min: resolvePointElastic(dragElastic, minLabel), max: resolvePointElastic(dragElastic, maxLabel) }; } function resolvePointElastic(dragElastic, label) { return typeof dragElastic === "number" ? dragElastic : dragElastic[label] || 0; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/gestures/drag/state/set-active.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/motion-dom/dist/es/gestures/drag/state/is-active.mjs init_injected_globals(); var isDragging = { x: false, y: false }; function isDragActive() { return isDragging.x || isDragging.y; } // ../../../node_modules/motion/dist/es/motion-dom/dist/es/gestures/drag/state/set-active.mjs function setDragLock(axis) { if (axis === "x" || axis === "y") { if (isDragging[axis]) { return null; } else { isDragging[axis] = true; return () => { isDragging[axis] = false; }; } } else { if (isDragging.x || isDragging.y) { return null; } else { isDragging.x = isDragging.y = true; return () => { isDragging.x = isDragging.y = false; }; } } } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs var elementDragControls = /* @__PURE__ */ new WeakMap(); var VisualElementDragControls = class { constructor(visualElement) { this.openDragLock = null; this.isDragging = false; this.currentDirection = null; this.originPoint = { x: 0, y: 0 }; this.constraints = false; this.hasMutatedConstraints = false; this.elastic = createBox(); this.visualElement = visualElement; } start(originEvent, { snapToCursor = false } = {}) { const { presenceContext } = this.visualElement; if (presenceContext && presenceContext.isPresent === false) return; const onSessionStart = (event) => { const { dragSnapToOrigin: dragSnapToOrigin2 } = this.getProps(); dragSnapToOrigin2 ? this.pauseAnimation() : this.stopAnimation(); if (snapToCursor) { this.snapToCursor(extractEventInfo(event).point); } }; const onStart = (event, info) => { const { drag: drag2, dragPropagation, onDragStart } = this.getProps(); if (drag2 && !dragPropagation) { if (this.openDragLock) this.openDragLock(); this.openDragLock = setDragLock(drag2); if (!this.openDragLock) return; } this.isDragging = true; this.currentDirection = null; this.resolveConstraints(); if (this.visualElement.projection) { this.visualElement.projection.isAnimationBlocked = true; this.visualElement.projection.target = void 0; } eachAxis((axis) => { let current = this.getAxisMotionValue(axis).get() || 0; if (percent.test(current)) { const { projection } = this.visualElement; if (projection && projection.layout) { const measuredAxis = projection.layout.layoutBox[axis]; if (measuredAxis) { const length = calcLength(measuredAxis); current = length * (parseFloat(current) / 100); } } } this.originPoint[axis] = current; }); if (onDragStart) { frame.postRender(() => onDragStart(event, info)); } addValueToWillChange(this.visualElement, "transform"); const { animationState } = this.visualElement; animationState && animationState.setActive("whileDrag", true); }; const onMove = (event, info) => { const { dragPropagation, dragDirectionLock, onDirectionLock, onDrag } = this.getProps(); if (!dragPropagation && !this.openDragLock) return; const { offset } = info; if (dragDirectionLock && this.currentDirection === null) { this.currentDirection = getCurrentDirection(offset); if (this.currentDirection !== null) { onDirectionLock && onDirectionLock(this.currentDirection); } return; } this.updateAxis("x", info.point, offset); this.updateAxis("y", info.point, offset); this.visualElement.render(); onDrag && onDrag(event, info); }; const onSessionEnd = (event, info) => this.stop(event, info); const resumeAnimation = () => eachAxis((axis) => this.getAnimationState(axis) === "paused" && this.getAxisMotionValue(axis).animation?.play()); const { dragSnapToOrigin } = this.getProps(); this.panSession = new PanSession(originEvent, { onSessionStart, onStart, onMove, onSessionEnd, resumeAnimation }, { transformPagePoint: this.visualElement.getTransformPagePoint(), dragSnapToOrigin, contextWindow: getContextWindow(this.visualElement) }); } stop(event, info) { const isDragging2 = this.isDragging; this.cancel(); if (!isDragging2) return; const { velocity } = info; this.startAnimation(velocity); const { onDragEnd } = this.getProps(); if (onDragEnd) { frame.postRender(() => onDragEnd(event, info)); } } cancel() { this.isDragging = false; const { projection, animationState } = this.visualElement; if (projection) { projection.isAnimationBlocked = false; } this.panSession && this.panSession.end(); this.panSession = void 0; const { dragPropagation } = this.getProps(); if (!dragPropagation && this.openDragLock) { this.openDragLock(); this.openDragLock = null; } animationState && animationState.setActive("whileDrag", false); } updateAxis(axis, _point, offset) { const { drag: drag2 } = this.getProps(); if (!offset || !shouldDrag(axis, drag2, this.currentDirection)) return; const axisValue = this.getAxisMotionValue(axis); let next = this.originPoint[axis] + offset[axis]; if (this.constraints && this.constraints[axis]) { next = applyConstraints(next, this.constraints[axis], this.elastic[axis]); } axisValue.set(next); } resolveConstraints() { const { dragConstraints, dragElastic } = this.getProps(); const layout2 = this.visualElement.projection && !this.visualElement.projection.layout ? this.visualElement.projection.measure(false) : this.visualElement.projection?.layout; const prevConstraints = this.constraints; if (dragConstraints && isRefObject(dragConstraints)) { if (!this.constraints) { this.constraints = this.resolveRefConstraints(); } } else { if (dragConstraints && layout2) { this.constraints = calcRelativeConstraints(layout2.layoutBox, dragConstraints); } else { this.constraints = false; } } this.elastic = resolveDragElastic(dragElastic); if (prevConstraints !== this.constraints && layout2 && this.constraints && !this.hasMutatedConstraints) { eachAxis((axis) => { if (this.constraints !== false && this.getAxisMotionValue(axis)) { this.constraints[axis] = rebaseAxisConstraints(layout2.layoutBox[axis], this.constraints[axis]); } }); } } resolveRefConstraints() { const { dragConstraints: constraints, onMeasureDragConstraints } = this.getProps(); if (!constraints || !isRefObject(constraints)) return false; const constraintsElement = constraints.current; invariant(constraintsElement !== null, "If `dragConstraints` is set as a React ref, that ref must be passed to another component's `ref` prop."); const { projection } = this.visualElement; if (!projection || !projection.layout) return false; const constraintsBox = measurePageBox(constraintsElement, projection.root, this.visualElement.getTransformPagePoint()); let measuredConstraints = calcViewportConstraints(projection.layout.layoutBox, constraintsBox); if (onMeasureDragConstraints) { const userConstraints = onMeasureDragConstraints(convertBoxToBoundingBox(measuredConstraints)); this.hasMutatedConstraints = !!userConstraints; if (userConstraints) { measuredConstraints = convertBoundingBoxToBox(userConstraints); } } return measuredConstraints; } startAnimation(velocity) { const { drag: drag2, dragMomentum, dragElastic, dragTransition, dragSnapToOrigin, onDragTransitionEnd } = this.getProps(); const constraints = this.constraints || {}; const momentumAnimations = eachAxis((axis) => { if (!shouldDrag(axis, drag2, this.currentDirection)) { return; } let transition = constraints && constraints[axis] || {}; if (dragSnapToOrigin) transition = { min: 0, max: 0 }; const bounceStiffness = dragElastic ? 200 : 1e6; const bounceDamping = dragElastic ? 40 : 1e7; const inertia2 = { type: "inertia", velocity: dragMomentum ? velocity[axis] : 0, bounceStiffness, bounceDamping, timeConstant: 750, restDelta: 1, restSpeed: 10, ...dragTransition, ...transition }; return this.startAxisValueAnimation(axis, inertia2); }); return Promise.all(momentumAnimations).then(onDragTransitionEnd); } startAxisValueAnimation(axis, transition) { const axisValue = this.getAxisMotionValue(axis); addValueToWillChange(this.visualElement, axis); return axisValue.start(animateMotionValue(axis, axisValue, 0, transition, this.visualElement, false)); } stopAnimation() { eachAxis((axis) => this.getAxisMotionValue(axis).stop()); } pauseAnimation() { eachAxis((axis) => this.getAxisMotionValue(axis).animation?.pause()); } getAnimationState(axis) { return this.getAxisMotionValue(axis).animation?.state; } /** * Drag works differently depending on which props are provided. * * - If _dragX and _dragY are provided, we output the gesture delta directly to those motion values. * - Otherwise, we apply the delta to the x/y motion values. */ getAxisMotionValue(axis) { const dragKey = `_drag${axis.toUpperCase()}`; const props = this.visualElement.getProps(); const externalMotionValue = props[dragKey]; return externalMotionValue ? externalMotionValue : this.visualElement.getValue(axis, (props.initial ? props.initial[axis] : void 0) || 0); } snapToCursor(point) { eachAxis((axis) => { const { drag: drag2 } = this.getProps(); if (!shouldDrag(axis, drag2, this.currentDirection)) return; const { projection } = this.visualElement; const axisValue = this.getAxisMotionValue(axis); if (projection && projection.layout) { const { min, max } = projection.layout.layoutBox[axis]; axisValue.set(point[axis] - mixNumber(min, max, 0.5)); } }); } /** * When the viewport resizes we want to check if the measured constraints * have changed and, if so, reposition the element within those new constraints * relative to where it was before the resize. */ scalePositionWithinConstraints() { if (!this.visualElement.current) return; const { drag: drag2, dragConstraints } = this.getProps(); const { projection } = this.visualElement; if (!isRefObject(dragConstraints) || !projection || !this.constraints) return; this.stopAnimation(); const boxProgress = { x: 0, y: 0 }; eachAxis((axis) => { const axisValue = this.getAxisMotionValue(axis); if (axisValue && this.constraints !== false) { const latest = axisValue.get(); boxProgress[axis] = calcOrigin2({ min: latest, max: latest }, this.constraints[axis]); } }); const { transformTemplate } = this.visualElement.getProps(); this.visualElement.current.style.transform = transformTemplate ? transformTemplate({}, "") : "none"; projection.root && projection.root.updateScroll(); projection.updateLayout(); this.resolveConstraints(); eachAxis((axis) => { if (!shouldDrag(axis, drag2, null)) return; const axisValue = this.getAxisMotionValue(axis); const { min, max } = this.constraints[axis]; axisValue.set(mixNumber(min, max, boxProgress[axis])); }); } addListeners() { if (!this.visualElement.current) return; elementDragControls.set(this.visualElement, this); const element = this.visualElement.current; const stopPointerListener = addPointerEvent(element, "pointerdown", (event) => { const { drag: drag2, dragListener = true } = this.getProps(); drag2 && dragListener && this.start(event); }); const measureDragConstraints = () => { const { dragConstraints } = this.getProps(); if (isRefObject(dragConstraints) && dragConstraints.current) { this.constraints = this.resolveRefConstraints(); } }; const { projection } = this.visualElement; const stopMeasureLayoutListener = projection.addEventListener("measure", measureDragConstraints); if (projection && !projection.layout) { projection.root && projection.root.updateScroll(); projection.updateLayout(); } frame.read(measureDragConstraints); const stopResizeListener = addDomEvent(window, "resize", () => this.scalePositionWithinConstraints()); const stopLayoutUpdateListener = projection.addEventListener("didUpdate", (({ delta, hasLayoutChanged }) => { if (this.isDragging && hasLayoutChanged) { eachAxis((axis) => { const motionValue2 = this.getAxisMotionValue(axis); if (!motionValue2) return; this.originPoint[axis] += delta[axis].translate; motionValue2.set(motionValue2.get() + delta[axis].translate); }); this.visualElement.render(); } })); return () => { stopResizeListener(); stopPointerListener(); stopMeasureLayoutListener(); stopLayoutUpdateListener && stopLayoutUpdateListener(); }; } getProps() { const props = this.visualElement.getProps(); const { drag: drag2 = false, dragDirectionLock = false, dragPropagation = false, dragConstraints = false, dragElastic = defaultElastic, dragMomentum = true } = props; return { ...props, drag: drag2, dragDirectionLock, dragPropagation, dragConstraints, dragElastic, dragMomentum }; } }; function shouldDrag(direction, drag2, currentDirection) { return (drag2 === true || drag2 === direction) && (currentDirection === null || currentDirection === direction); } function getCurrentDirection(offset, lockThreshold = 10) { let direction = null; if (Math.abs(offset.y) > lockThreshold) { direction = "y"; } else if (Math.abs(offset.x) > lockThreshold) { direction = "x"; } return direction; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/drag/index.mjs var DragGesture = class extends Feature { constructor(node) { super(node); this.removeGroupControls = noop3; this.removeListeners = noop3; this.controls = new VisualElementDragControls(node); } mount() { const { dragControls } = this.node.getProps(); if (dragControls) { this.removeGroupControls = dragControls.subscribe(this.controls); } this.removeListeners = this.controls.addListeners() || noop3; } unmount() { this.removeGroupControls(); this.removeListeners(); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/gestures/pan/index.mjs init_injected_globals(); var asyncHandler = (handler) => (event, info) => { if (handler) { frame.postRender(() => handler(event, info)); } }; var PanGesture = class extends Feature { constructor() { super(...arguments); this.removePointerDownListener = noop3; } onPointerDown(pointerDownEvent) { this.session = new PanSession(pointerDownEvent, this.createPanHandlers(), { transformPagePoint: this.node.getTransformPagePoint(), contextWindow: getContextWindow(this.node) }); } createPanHandlers() { const { onPanSessionStart, onPanStart, onPan, onPanEnd } = this.node.getProps(); return { onSessionStart: asyncHandler(onPanSessionStart), onStart: asyncHandler(onPanStart), onMove: onPan, onEnd: (event, info) => { delete this.session; if (onPanEnd) { frame.postRender(() => onPanEnd(event, info)); } } }; } mount() { this.removePointerDownListener = addPointerEvent(this.node.current, "pointerdown", (event) => this.onPointerDown(event)); } update() { this.session && this.session.updateHandlers(this.createPanHandlers()); } unmount() { this.removePointerDownListener(); this.session && this.session.end(); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/layout/MeasureLayout.mjs init_injected_globals(); var import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1); var import_react70 = __toESM(require_react(), 1); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/node/state.mjs init_injected_globals(); var globalProjectionState = { /** * Global flag as to whether the tree has animated since the last time * we resized the window */ hasAnimatedSinceResize: true, /** * We set this to true once, on the first update. Any nodes added to the tree beyond that * update will be given a `data-projection-id` attribute. */ hasEverUpdated: false }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/styles/scale-border-radius.mjs init_injected_globals(); function pixelsToPercent(pixels, axis) { if (axis.max === axis.min) return 0; return pixels / (axis.max - axis.min) * 100; } var correctBorderRadius = { correct: (latest, node) => { if (!node.target) return latest; if (typeof latest === "string") { if (px.test(latest)) { latest = parseFloat(latest); } else { return latest; } } const x = pixelsToPercent(latest, node.target.x); const y = pixelsToPercent(latest, node.target.y); return `${x}% ${y}%`; } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/styles/scale-box-shadow.mjs init_injected_globals(); var correctBoxShadow = { correct: (latest, { treeScale, projectionDelta }) => { const original = latest; const shadow = complex.parse(latest); if (shadow.length > 5) return original; const template = complex.createTransformer(latest); const offset = typeof shadow[0] !== "number" ? 1 : 0; const xScale = projectionDelta.x.scale * treeScale.x; const yScale = projectionDelta.y.scale * treeScale.y; shadow[0 + offset] /= xScale; shadow[1 + offset] /= yScale; const averageScale = mixNumber(xScale, yScale, 0.5); if (typeof shadow[2 + offset] === "number") shadow[2 + offset] /= averageScale; if (typeof shadow[3 + offset] === "number") shadow[3 + offset] /= averageScale; return template(shadow); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/motion/features/layout/MeasureLayout.mjs var MeasureLayoutWithContext = class extends import_react70.Component { /** * This only mounts projection nodes for components that * need measuring, we might want to do it for all components * in order to incorporate transforms */ componentDidMount() { const { visualElement, layoutGroup, switchLayoutGroup, layoutId } = this.props; const { projection } = visualElement; addScaleCorrector(defaultScaleCorrectors); if (projection) { if (layoutGroup.group) layoutGroup.group.add(projection); if (switchLayoutGroup && switchLayoutGroup.register && layoutId) { switchLayoutGroup.register(projection); } projection.root.didUpdate(); projection.addEventListener("animationComplete", () => { this.safeToRemove(); }); projection.setOptions({ ...projection.options, onExitComplete: () => this.safeToRemove() }); } globalProjectionState.hasEverUpdated = true; } getSnapshotBeforeUpdate(prevProps) { const { layoutDependency, visualElement, drag: drag2, isPresent } = this.props; const projection = visualElement.projection; if (!projection) return null; projection.isPresent = isPresent; if (drag2 || prevProps.layoutDependency !== layoutDependency || layoutDependency === void 0 || prevProps.isPresent !== isPresent) { projection.willUpdate(); } else { this.safeToRemove(); } if (prevProps.isPresent !== isPresent) { if (isPresent) { projection.promote(); } else if (!projection.relegate()) { frame.postRender(() => { const stack = projection.getStack(); if (!stack || !stack.members.length) { this.safeToRemove(); } }); } } return null; } componentDidUpdate() { const { projection } = this.props.visualElement; if (projection) { projection.root.didUpdate(); microtask.postRender(() => { if (!projection.currentAnimation && projection.isLead()) { this.safeToRemove(); } }); } } componentWillUnmount() { const { visualElement, layoutGroup, switchLayoutGroup: promoteContext } = this.props; const { projection } = visualElement; if (projection) { projection.scheduleCheckAfterUnmount(); if (layoutGroup && layoutGroup.group) layoutGroup.group.remove(projection); if (promoteContext && promoteContext.deregister) promoteContext.deregister(projection); } } safeToRemove() { const { safeToRemove } = this.props; safeToRemove && safeToRemove(); } render() { return null; } }; function MeasureLayout(props) { const [isPresent, safeToRemove] = usePresence(); const layoutGroup = (0, import_react70.useContext)(LayoutGroupContext); return (0, import_jsx_runtime7.jsx)(MeasureLayoutWithContext, { ...props, layoutGroup, switchLayoutGroup: (0, import_react70.useContext)(SwitchLayoutGroupContext), isPresent, safeToRemove }); } var defaultScaleCorrectors = { borderRadius: { ...correctBorderRadius, applyTo: [ "borderTopLeftRadius", "borderTopRightRadius", "borderBottomLeftRadius", "borderBottomRightRadius" ] }, borderTopLeftRadius: correctBorderRadius, borderTopRightRadius: correctBorderRadius, borderBottomLeftRadius: correctBorderRadius, borderBottomRightRadius: correctBorderRadius, boxShadow: correctBoxShadow }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/node/HTMLProjectionNode.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/node/create-projection-node.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/animation/animate/single-value.mjs init_injected_globals(); function animateSingleValue(value, keyframes2, options) { const motionValue$1 = isMotionValue(value) ? value : motionValue(value); motionValue$1.start(animateMotionValue("", motionValue$1, keyframes2, options)); return motionValue$1.animation; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/dom/utils/is-svg-element.mjs init_injected_globals(); function isSVGElement(element) { return element instanceof SVGElement && element.tagName !== "svg"; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/flat-tree.mjs init_injected_globals(); // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/compare-by-depth.mjs init_injected_globals(); var compareByDepth = (a, b) => a.depth - b.depth; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/render/utils/flat-tree.mjs var FlatTree = class { constructor() { this.children = []; this.isDirty = false; } add(child) { addUniqueItem(this.children, child); this.isDirty = true; } remove(child) { removeItem(this.children, child); this.isDirty = true; } forEach(callback) { this.isDirty && this.children.sort(compareByDepth); this.isDirty = false; this.children.forEach(callback); } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/utils/delay.mjs init_injected_globals(); function delay(callback, timeout) { const start = time.now(); const checkElapsed = ({ timestamp }) => { const elapsed = timestamp - start; if (elapsed >= timeout) { cancelFrame(checkElapsed); callback(elapsed - timeout); } }; frame.read(checkElapsed, true); return () => cancelFrame(checkElapsed); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/animation/mix-values.mjs init_injected_globals(); var borders = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"]; var numBorders = borders.length; var asNumber = (value) => typeof value === "string" ? parseFloat(value) : value; var isPx = (value) => typeof value === "number" || px.test(value); function mixValues(target, follow, lead, progress2, shouldCrossfadeOpacity, isOnlyMember) { if (shouldCrossfadeOpacity) { target.opacity = mixNumber(0, lead.opacity ?? 1, easeCrossfadeIn(progress2)); target.opacityExit = mixNumber(follow.opacity ?? 1, 0, easeCrossfadeOut(progress2)); } else if (isOnlyMember) { target.opacity = mixNumber(follow.opacity ?? 1, lead.opacity ?? 1, progress2); } for (let i = 0; i < numBorders; i++) { const borderLabel = `border${borders[i]}Radius`; let followRadius = getRadius(follow, borderLabel); let leadRadius = getRadius(lead, borderLabel); if (followRadius === void 0 && leadRadius === void 0) continue; followRadius || (followRadius = 0); leadRadius || (leadRadius = 0); const canMix = followRadius === 0 || leadRadius === 0 || isPx(followRadius) === isPx(leadRadius); if (canMix) { target[borderLabel] = Math.max(mixNumber(asNumber(followRadius), asNumber(leadRadius), progress2), 0); if (percent.test(leadRadius) || percent.test(followRadius)) { target[borderLabel] += "%"; } } else { target[borderLabel] = leadRadius; } } if (follow.rotate || lead.rotate) { target.rotate = mixNumber(follow.rotate || 0, lead.rotate || 0, progress2); } } function getRadius(values, radiusName) { return values[radiusName] !== void 0 ? values[radiusName] : values.borderRadius; } var easeCrossfadeIn = /* @__PURE__ */ compress(0, 0.5, circOut); var easeCrossfadeOut = /* @__PURE__ */ compress(0.5, 0.95, noop3); function compress(min, max, easing) { return (p) => { if (p < min) return 0; if (p > max) return 1; return easing(progress(min, max, p)); }; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/copy.mjs init_injected_globals(); function copyAxisInto(axis, originAxis) { axis.min = originAxis.min; axis.max = originAxis.max; } function copyBoxInto(box, originBox) { copyAxisInto(box.x, originBox.x); copyAxisInto(box.y, originBox.y); } function copyAxisDeltaInto(delta, originDelta) { delta.translate = originDelta.translate; delta.scale = originDelta.scale; delta.originPoint = originDelta.originPoint; delta.origin = originDelta.origin; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/delta-remove.mjs init_injected_globals(); function removePointDelta(point, translate, scale2, originPoint, boxScale) { point -= translate; point = scalePoint(point, 1 / scale2, originPoint); if (boxScale !== void 0) { point = scalePoint(point, 1 / boxScale, originPoint); } return point; } function removeAxisDelta(axis, translate = 0, scale2 = 1, origin = 0.5, boxScale, originAxis = axis, sourceAxis = axis) { if (percent.test(translate)) { translate = parseFloat(translate); const relativeProgress = mixNumber(sourceAxis.min, sourceAxis.max, translate / 100); translate = relativeProgress - sourceAxis.min; } if (typeof translate !== "number") return; let originPoint = mixNumber(originAxis.min, originAxis.max, origin); if (axis === originAxis) originPoint -= translate; axis.min = removePointDelta(axis.min, translate, scale2, originPoint, boxScale); axis.max = removePointDelta(axis.max, translate, scale2, originPoint, boxScale); } function removeAxisTransforms(axis, transforms, [key, scaleKey, originKey], origin, sourceAxis) { removeAxisDelta(axis, transforms[key], transforms[scaleKey], transforms[originKey], transforms.scale, origin, sourceAxis); } var xKeys = ["x", "scaleX", "originX"]; var yKeys = ["y", "scaleY", "originY"]; function removeBoxTransforms(box, transforms, originBox, sourceBox) { removeAxisTransforms(box.x, transforms, xKeys, originBox ? originBox.x : void 0, sourceBox ? sourceBox.x : void 0); removeAxisTransforms(box.y, transforms, yKeys, originBox ? originBox.y : void 0, sourceBox ? sourceBox.y : void 0); } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/geometry/utils.mjs init_injected_globals(); function isAxisDeltaZero(delta) { return delta.translate === 0 && delta.scale === 1; } function isDeltaZero(delta) { return isAxisDeltaZero(delta.x) && isAxisDeltaZero(delta.y); } function axisEquals(a, b) { return a.min === b.min && a.max === b.max; } function boxEquals(a, b) { return axisEquals(a.x, b.x) && axisEquals(a.y, b.y); } function axisEqualsRounded(a, b) { return Math.round(a.min) === Math.round(b.min) && Math.round(a.max) === Math.round(b.max); } function boxEqualsRounded(a, b) { return axisEqualsRounded(a.x, b.x) && axisEqualsRounded(a.y, b.y); } function aspectRatio(box) { return calcLength(box.x) / calcLength(box.y); } function axisDeltaEquals(a, b) { return a.translate === b.translate && a.scale === b.scale && a.originPoint === b.originPoint; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/shared/stack.mjs init_injected_globals(); var NodeStack = class { constructor() { this.members = []; } add(node) { addUniqueItem(this.members, node); node.scheduleRender(); } remove(node) { removeItem(this.members, node); if (node === this.prevLead) { this.prevLead = void 0; } if (node === this.lead) { const prevLead = this.members[this.members.length - 1]; if (prevLead) { this.promote(prevLead); } } } relegate(node) { const indexOfNode = this.members.findIndex((member) => node === member); if (indexOfNode === 0) return false; let prevLead; for (let i = indexOfNode; i >= 0; i--) { const member = this.members[i]; if (member.isPresent !== false) { prevLead = member; break; } } if (prevLead) { this.promote(prevLead); return true; } else { return false; } } promote(node, preserveFollowOpacity) { const prevLead = this.lead; if (node === prevLead) return; this.prevLead = prevLead; this.lead = node; node.show(); if (prevLead) { prevLead.instance && prevLead.scheduleRender(); node.scheduleRender(); node.resumeFrom = prevLead; if (preserveFollowOpacity) { node.resumeFrom.preserveOpacity = true; } if (prevLead.snapshot) { node.snapshot = prevLead.snapshot; node.snapshot.latestValues = prevLead.animationValues || prevLead.latestValues; } if (node.root && node.root.isUpdating) { node.isLayoutDirty = true; } const { crossfade } = node.options; if (crossfade === false) { prevLead.hide(); } } } exitAnimationComplete() { this.members.forEach((node) => { const { options, resumingFrom } = node; options.onExitComplete && options.onExitComplete(); if (resumingFrom) { resumingFrom.options.onExitComplete && resumingFrom.options.onExitComplete(); } }); } scheduleRender() { this.members.forEach((node) => { node.instance && node.scheduleRender(false); }); } /** * Clear any leads that have been removed this render to prevent them from being * used in future animations and to prevent memory leaks */ removeLeadSnapshot() { if (this.lead && this.lead.snapshot) { this.lead.snapshot = void 0; } } }; // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/styles/transform.mjs init_injected_globals(); function buildProjectionTransform(delta, treeScale, latestTransform) { let transform = ""; const xTranslate = delta.x.translate / treeScale.x; const yTranslate = delta.y.translate / treeScale.y; const zTranslate = latestTransform?.z || 0; if (xTranslate || yTranslate || zTranslate) { transform = `translate3d(${xTranslate}px, ${yTranslate}px, ${zTranslate}px) `; } if (treeScale.x !== 1 || treeScale.y !== 1) { transform += `scale(${1 / treeScale.x}, ${1 / treeScale.y}) `; } if (latestTransform) { const { transformPerspective, rotate: rotate2, rotateX, rotateY, skewX, skewY } = latestTransform; if (transformPerspective) transform = `perspective(${transformPerspective}px) ${transform}`; if (rotate2) transform += `rotate(${rotate2}deg) `; if (rotateX) transform += `rotateX(${rotateX}deg) `; if (rotateY) transform += `rotateY(${rotateY}deg) `; if (skewX) transform += `skewX(${skewX}deg) `; if (skewY) transform += `skewY(${skewY}deg) `; } const elementScaleX = delta.x.scale * treeScale.x; const elementScaleY = delta.y.scale * treeScale.y; if (elementScaleX !== 1 || elementScaleY !== 1) { transform += `scale(${elementScaleX}, ${elementScaleY})`; } return transform || "none"; } // ../../../node_modules/motion/dist/es/framer-motion/dist/es/projection/node/create-projection-node.mjs var metrics = { nodes: 0, calculatedTargetDeltas: 0, calculatedProjections: 0 }; var transformAxes = ["", "X", "Y", "Z"]; var hiddenVisibility = { visibility: "hidden" }; var animationTarget = 1e3; var id2 = 0; function resetDistortingTransform(key, visualElement, values, sharedAnimationValues) { const { latestValues } = visualElement; if (latestValues[key]) { values[key] = latestValues[key]; visualElement.setStaticValue(key, 0); if (sharedAnimationValues) { sharedAnimationValues[key] = 0; } } } function cancelTreeOptimisedTransformAnimations(projectionNode) { projectionNode.hasCheckedOptimisedAppear = true; if (projectionNode.root === projectionNode) return; const { visualElement } = projectionNode.options; if (!visualElement) return; const appearId = getOptimisedAppearId(visualElement); if (window.MotionHasOptimisedAnimation(appearId, "transform")) { const { layout: layout2, layoutId } = projectionNode.options; window.MotionCancelOptimisedAnimation(appearId, "transform", frame, !(layout2 || layoutId)); } const { parent } = projectionNode; if (parent && !parent.hasCheckedOptimisedAppear) { cancelTreeOptimisedTransformAnimations(parent); } } function createProjectionNode2({ attachResizeListener, defaultParent, measureScroll, checkIsScrollRoot, resetTransform }) { return class ProjectionNode { constructor(latestValues = {}, parent = defaultParent?.()) { this.id = id2++; this.animationId = 0; this.children = /* @__PURE__ */ new Set(); this.options = {}; this.isTreeAnimating = false; this.isAnimationBlocked = false; this.isLayoutDirty = false; this.isProjectionDirty = false; this.isSharedProjectionDirty = false; this.isTransformDirty = false; this.updateManuallyBlocked = false; this.updateBlockedByResize = false; this.isUpdating = false; this.isSVG = false; this.needsReset = false; this.shouldResetTransform = false; this.hasCheckedOptimisedAppear = false; this.treeScale = { x: 1, y: 1 }; this.eventHandlers = /* @__PURE__ */ new Map(); this.hasTreeAnimated = false; this.updateScheduled = false; this.scheduleUpdate = () => this.update(); this.projectionUpdateScheduled = false; this.checkUpdateFailed = () => { if (this.isUpdating) { this.isUpdating = false; this.clearAllSnapshots(); } }; this.updateProjection = () => { this.projectionUpdateScheduled = false; if (statsBuffer.value) { metrics.nodes = metrics.calculatedTargetDeltas = metrics.calculatedProjections = 0; } this.nodes.forEach(propagateDirtyNodes); this.nodes.forEach(resolveTargetDelta); this.nodes.forEach(calcProjection); this.nodes.forEach(cleanDirtyNodes); if (statsBuffer.addProjectionMetrics) { statsBuffer.addProjectionMetrics(metrics); } }; this.resolvedRelativeTargetAt = 0; this.hasProjected = false; this.isVisible = true; this.animationProgress = 0; this.sharedNodes = /* @__PURE__ */ new Map(); this.latestValues = latestValues; this.root = parent ? parent.root || parent : this; this.path = parent ? [...parent.path, parent] : []; this.parent = parent; this.depth = parent ? parent.depth + 1 : 0; for (let i = 0; i < this.path.length; i++) { this.path[i].shouldResetTransform = true; } if (this.root === this) this.nodes = new FlatTree(); } addEventListener(name, handler) { if (!this.eventHandlers.has(name)) { this.eventHandlers.set(name, new SubscriptionManager()); } return this.eventHandlers.get(name).add(handler); } notifyListeners(name, ...args) { const subscriptionManager = this.eventHandlers.get(name); subscriptionManager && subscriptionManager.notify(...args); } hasListeners(name) { return this.eventHandlers.has(name); } /** * Lifecycles */ mount(instance, isLayoutDirty = this.root.hasTreeAnimated) { if (this.instance) return; this.isSVG = isSVGElement(instance); this.instance = instance; const { layoutId, layout: layout2, visualElement } = this.options; if (visualElement && !visualElement.current) { visualElement.mount(instance); } this.root.nodes.add(this); this.parent && this.parent.children.add(this); if (isLayoutDirty && (layout2 || layoutId)) { this.isLayoutDirty = true; } if (attachResizeListener) { let cancelDelay; const resizeUnblockUpdate = () => this.root.updateBlockedByResize = false; attachResizeListener(instance, () => { this.root.updateBlockedByResize = true; cancelDelay && cancelDelay(); cancelDelay = delay(resizeUnblockUpdate, 250); if (globalProjectionState.hasAnimatedSinceResize) { globalProjectionState.hasAnimatedSinceResize = false; this.nodes.forEach(finishAnimation); } }); } if (layoutId) { this.root.registerSharedNode(layoutId, this); } if (this.options.animate !== false && visualElement && (layoutId || layout2)) { this.addEventListener("didUpdate", ({ delta, hasLayoutChanged, hasRelativeLayoutChanged, layout: newLayout }) => { if (this.isTreeAnimationBlocked()) { this.target = void 0; this.relativeTarget = void 0; return; } const layoutTransition = this.options.transition || visualElement.getDefaultTransition() || defaultLayoutTransition; const { onLayoutAnimationStart, onLayoutAnimationComplete } = visualElement.getProps(); const hasTargetChanged = !this.targetLayout || !boxEqualsRounded(this.targetLayout, newLayout); const hasOnlyRelativeTargetChanged = !hasLayoutChanged && hasRelativeLayoutChanged; if (this.options.layoutRoot || this.resumeFrom || hasOnlyRelativeTargetChanged || hasLayoutChanged && (hasTargetChanged || !this.currentAnimation)) { if (this.resumeFrom) { this.resumingFrom = this.resumeFrom; this.resumingFrom.resumingFrom = void 0; } this.setAnimationOrigin(delta, hasOnlyRelativeTargetChanged); const animationOptions = { ...getValueTransition(layoutTransition, "layout"), onPlay: onLayoutAnimationStart, onComplete: onLayoutAnimationComplete }; if (visualElement.shouldReduceMotion || this.options.layoutRoot) { animationOptions.delay = 0; animationOptions.type = false; } this.startAnimation(animationOptions); } else { if (!hasLayoutChanged) { finishAnimation(this); } if (this.isLead() && this.options.onExitComplete) { this.options.onExitComplete(); } } this.targetLayout = newLayout; }); } } unmount() { this.options.layoutId && this.willUpdate(); this.root.nodes.remove(this); const stack = this.getStack(); stack && stack.remove(this); this.parent && this.parent.children.delete(this); this.instance = void 0; cancelFrame(this.updateProjection); } // only on the root blockUpdate() { this.updateManuallyBlocked = true; } unblockUpdate() { this.updateManuallyBlocked = false; } isUpdateBlocked() { return this.upd

Home

Next appointment