@sonordev/site-kit 1.2.7

package/dist/index.mjs

@@ -0,0 +1,2416 @@
+export { ManagedImage, assignImageToSlot, clearImageSlot, fetchManagedImage, fetchManagedImages, listImageFiles, uploadImage } from './chunk-JTLOJLWQ.mjs';
+export { TestimonialSection, fetchReviewStats, fetchReviews } from './chunk-UWE5PCYJ.mjs';
+import { SignalBridge, useSignalExperiment, useSignalEvent } from './chunk-6ZCISNAB.mjs';
+export { SignalBridge, useSignal, useSignalConfig, useSignalEvent, useSignalExperiment, useSignalOutcome } from './chunk-6ZCISNAB.mjs';
+import './chunk-TFLQX7K7.mjs';
+export { CalendarView, CheckoutForm, EventCalendar, EventEmbed, EventModal, EventTile, OfferingCard, OfferingList, ProductEmbed, RegistrationForm, UpcomingEvents, createCheckoutSession, fetchNextEvent, fetchOffering, fetchOfferings, fetchProducts, fetchServices, fetchUpcomingEvents, formatDate, formatDateTime, formatPrice, getOfferingUrl, registerForEvent, useEventModal } from './chunk-D63MUKZ6.mjs';
+export { SetupWizard } from './chunk-P3UWIUJS.mjs';
+export { clearRedirectCache, fetchRedirectRules, generateNextRedirects, handleManagedRedirects } from './chunk-QXV4667R.mjs';
+import './chunk-GCJXQ4AG.mjs';
+import { SitemapSync } from './chunk-PKN27UMH.mjs';
+import { AnalyticsProvider } from './chunk-M2T6R7BA.mjs';
+import { EngageWidget } from './chunk-7UKPRW25.mjs';
+import { configureFormsApi } from './chunk-S7FRYNSU.mjs';
+import './chunk-4XPGGLVP.mjs';
+import React2, { createContext, useContext, useEffect, useMemo, Suspense, useState, useRef, useCallback } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var SiteKitContext = createContext(null);
+function useSiteKit() {
+  const context = useContext(SiteKitContext);
+  if (!context) {
+    throw new Error("useSiteKit must be used within a SiteKitProvider");
+  }
+  return context;
+}
+function SiteKitProvider({
+  children,
+  apiKey,
+  apiUrl,
+  signalUrl,
+  projectId,
+  recaptchaSiteKey,
+  analytics,
+  engage,
+  forms,
+  signal,
+  debug = false
+}) {
+  const isDev = typeof process !== "undefined" && process.env?.NODE_ENV === "development";
+  const defaultApiUrl = isDev && process.env?.NEXT_PUBLIC_UPTRADE_API_URL ? process.env.NEXT_PUBLIC_UPTRADE_API_URL : "https://api.uptrademedia.com";
+  const defaultSignalUrl = isDev && process.env?.NEXT_PUBLIC_SIGNAL_API_URL ? process.env.NEXT_PUBLIC_SIGNAL_API_URL : "https://signal.uptrademedia.com";
+  const finalApiUrl = apiUrl || defaultApiUrl;
+  const finalSignalUrl = signalUrl || defaultSignalUrl;
+  const finalRecaptchaSiteKey = recaptchaSiteKey ?? (typeof process !== "undefined" ? process.env?.NEXT_PUBLIC_RECAPTCHA_SITE_KEY : void 0);
+  if (!apiKey) {
+    console.error("@sonordev/site-kit: No API key provided. Set NEXT_PUBLIC_UPTRADE_API_KEY environment variable.");
+  }
+  if (typeof window !== "undefined") {
+    window.__SITE_KIT_API_URL__ = finalApiUrl;
+    window.__SITE_KIT_SIGNAL_URL__ = finalSignalUrl;
+    window.__SITE_KIT_API_KEY__ = apiKey;
+    window.__SITE_KIT_RECAPTCHA_SITE_KEY__ = finalRecaptchaSiteKey;
+    window.__SITE_KIT_DEBUG__ = debug;
+  }
+  useEffect(() => {
+    if (apiKey && typeof window !== "undefined") {
+      configureFormsApi({
+        baseUrl: finalApiUrl,
+        apiKey
+      });
+    }
+  }, [finalApiUrl, apiKey]);
+  const contextValue = useMemo(
+    () => ({
+      apiUrl: finalApiUrl,
+      signalUrl: finalSignalUrl,
+      apiKey,
+      analytics,
+      engage,
+      forms,
+      signal,
+      debug,
+      isReady: true
+    }),
+    [finalApiUrl, finalSignalUrl, apiKey, analytics, engage, forms, signal, debug]
+  );
+  let content = /* @__PURE__ */ jsx(Fragment, { children });
+  if (signal?.enabled) {
+    content = /* @__PURE__ */ jsx(
+      SignalBridge,
+      {
+        enabled: signal.enabled,
+        realtime: signal.realtime !== false,
+        experiments: signal.experiments !== false,
+        behaviorTracking: signal.behaviorTracking !== false,
+        children: content
+      }
+    );
+  }
+  if (analytics?.enabled) {
+    content = /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(
+      AnalyticsProvider,
+      {
+        apiUrl: finalApiUrl,
+        apiKey,
+        trackPageViews: analytics.trackPageViews !== false,
+        trackWebVitals: analytics.trackWebVitals !== false,
+        trackScrollDepth: analytics.trackScrollDepth !== false,
+        trackClicks: analytics.trackClicks !== false,
+        debug,
+        children: content
+      }
+    ) });
+  }
+  if (engage?.enabled) {
+    content = /* @__PURE__ */ jsxs(Fragment, { children: [
+      content,
+      /* @__PURE__ */ jsx(
+        EngageWidget,
+        {
+          apiUrl: finalApiUrl,
+          apiKey,
+          projectId,
+          position: engage.position || "bottom-right",
+          chatEnabled: engage.chatEnabled !== false
+        }
+      )
+    ] });
+  }
+  content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    content,
+    /* @__PURE__ */ jsx(SitemapSync, { debug })
+  ] });
+  return /* @__PURE__ */ jsx(SiteKitContext.Provider, { value: contextValue, children: content });
+}
+
+// src/affiliates/api.ts
+function getApiConfig() {
+  const apiUrl = typeof window !== "undefined" ? window.__SITE_KIT_API_URL__ || "https://api.uptrademedia.com" : "https://api.uptrademedia.com";
+  const apiKey = typeof window !== "undefined" ? window.__SITE_KIT_API_KEY__ || "" : "";
+  return { apiUrl, apiKey };
+}
+async function apiGet(endpoint) {
+  const { apiUrl, apiKey } = getApiConfig();
+  if (!apiKey) {
+    console.error("[Affiliates] No API key configured");
+    return null;
+  }
+  try {
+    const response = await fetch(`${apiUrl}${endpoint}`, {
+      method: "GET",
+      headers: {
+        "x-api-key": apiKey
+      }
+    });
+    if (!response.ok) {
+      console.error(`[Affiliates] API error: ${response.statusText}`);
+      return null;
+    }
+    return await response.json();
+  } catch (error) {
+    console.error("[Affiliates] Network error:", error);
+    return null;
+  }
+}
+async function fetchAffiliates(options = {}) {
+  const result = await apiGet(
+    "/api/public/affiliates"
+  );
+  return result?.affiliates || [];
+}
+function getTrackingUrl(affiliateId, offerId) {
+  const { apiUrl } = getApiConfig();
+  return `${apiUrl}/a/${affiliateId}/${offerId}`;
+}
+function useAffiliates() {
+  const [affiliates, setAffiliates] = useState([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    async function load() {
+      try {
+        setIsLoading(true);
+        setError(null);
+        const data = await fetchAffiliates();
+        setAffiliates(data);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Failed to load affiliates");
+      } finally {
+        setIsLoading(false);
+      }
+    }
+    load();
+  }, []);
+  return {
+    affiliates,
+    isLoading,
+    error,
+    getTrackingUrl
+  };
+}
+function AffiliateCard({
+  affiliate,
+  className = "",
+  renderLogo,
+  showOffers = false
+}) {
+  const { getTrackingUrl: getTrackingUrl2 } = useAffiliates();
+  const defaultLogo = /* @__PURE__ */ jsx("div", { "data-affiliate-logo": true, className: "affiliate-logo", children: affiliate.logo_url ? /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: affiliate.logo_url,
+      alt: affiliate.name,
+      loading: "lazy"
+    }
+  ) : /* @__PURE__ */ jsx("span", { children: affiliate.name.charAt(0) }) });
+  return /* @__PURE__ */ jsxs("div", { className, "data-affiliate-card": true, "data-affiliate-id": affiliate.id, children: [
+    renderLogo ? renderLogo(affiliate) : defaultLogo,
+    /* @__PURE__ */ jsx("div", { "data-affiliate-name": true, className: "affiliate-name", children: affiliate.name }),
+    affiliate.website_url && /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: affiliate.website_url,
+        target: "_blank",
+        rel: "noopener noreferrer sponsored",
+        "data-affiliate-website": true,
+        className: "affiliate-website",
+        children: "Visit Website"
+      }
+    ),
+    showOffers && affiliate.offers && affiliate.offers.length > 0 && /* @__PURE__ */ jsx("div", { "data-affiliate-offers": true, className: "affiliate-offers", children: affiliate.offers.map((offer) => /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: getTrackingUrl2(affiliate.id, offer.id),
+        target: "_blank",
+        rel: "noopener noreferrer sponsored",
+        "data-affiliate-offer": true,
+        "data-offer-id": offer.id,
+        className: "affiliate-offer",
+        children: offer.name
+      },
+      offer.id
+    )) })
+  ] });
+}
+function AffiliatesWidget({
+  className = "",
+  loadingComponent,
+  emptyComponent,
+  errorComponent,
+  showOffers = false,
+  renderAffiliate,
+  limit
+}) {
+  const { affiliates, isLoading, error, getTrackingUrl: getTrackingUrl2 } = useAffiliates();
+  if (isLoading) {
+    return loadingComponent || /* @__PURE__ */ jsx("div", { "data-affiliates-loading": true, children: "Loading affiliates..." });
+  }
+  if (error) {
+    return errorComponent || /* @__PURE__ */ jsx("div", { "data-affiliates-error": true, children: error });
+  }
+  const displayAffiliates = limit ? affiliates.slice(0, limit) : affiliates;
+  if (displayAffiliates.length === 0) {
+    return emptyComponent || null;
+  }
+  return /* @__PURE__ */ jsx("div", { className, "data-affiliates-widget": true, children: displayAffiliates.map(
+    (affiliate) => renderAffiliate ? renderAffiliate(affiliate) : /* @__PURE__ */ jsx(
+      AffiliateCard,
+      {
+        affiliate,
+        showOffers
+      },
+      affiliate.id
+    )
+  ) });
+}
+function SignalExperiment({
+  experimentId,
+  variants,
+  fallback,
+  trackImpression = true,
+  children
+}) {
+  const { assignment, variant, isControl } = useSignalExperiment(experimentId);
+  const trackEvent = useSignalEvent();
+  useEffect(() => {
+    if (trackImpression && variant) {
+      trackEvent({
+        event_type: "experiment",
+        event_name: "impression",
+        event_data: {
+          experiment_id: experimentId,
+          variant_key: variant
+        }
+      });
+    }
+  }, [experimentId, variant, trackImpression, trackEvent]);
+  if (children) {
+    return /* @__PURE__ */ jsx(Fragment, { children: children({ variant: variant || "control", isControl }) });
+  }
+  const selectedVariant = variant || "control";
+  const content = variants[selectedVariant];
+  if (content !== void 0) {
+    return /* @__PURE__ */ jsx(Fragment, { children: content });
+  }
+  if (fallback) {
+    return /* @__PURE__ */ jsx(Fragment, { children: fallback });
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: variants.control || null });
+}
+function useExperimentVariant(experimentId) {
+  return useSignalExperiment(experimentId);
+}
+function ExperimentConversion({
+  experimentId,
+  outcomeType = "click",
+  value,
+  children
+}) {
+  const trackEvent = useSignalEvent();
+  const { variant } = useSignalExperiment(experimentId);
+  const handleInteraction = () => {
+    trackEvent({
+      event_type: "experiment",
+      event_name: "conversion",
+      event_data: {
+        experiment_id: experimentId,
+        variant_key: variant,
+        outcome_type: outcomeType,
+        value
+      }
+    });
+  };
+  return React2.cloneElement(children, {
+    onClick: (e) => {
+      handleInteraction();
+      if (children.props.onClick) {
+        children.props.onClick(e);
+      }
+    }
+  });
+}
+var styles = {
+  container: {
+    display: "flex",
+    flexDirection: "column",
+    height: "100vh",
+    maxWidth: "800px",
+    margin: "0 auto",
+    padding: "1rem",
+    fontFamily: "system-ui, -apple-system, sans-serif"
+  },
+  header: {
+    display: "flex",
+    alignItems: "center",
+    gap: "0.75rem",
+    padding: "1rem 0",
+    borderBottom: "1px solid #e5e7eb"
+  },
+  logo: {
+    width: "32px",
+    height: "32px",
+    borderRadius: "8px",
+    background: "linear-gradient(135deg, #3b82f6, #8b5cf6)",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    color: "white",
+    fontWeight: "bold"
+  },
+  title: {
+    fontSize: "1.25rem",
+    fontWeight: "600",
+    color: "#111827"
+  },
+  subtitle: {
+    fontSize: "0.875rem",
+    color: "#6b7280"
+  },
+  messages: {
+    flex: 1,
+    overflowY: "auto",
+    padding: "1rem 0",
+    display: "flex",
+    flexDirection: "column",
+    gap: "1rem"
+  },
+  message: {
+    display: "flex",
+    gap: "0.75rem",
+    maxWidth: "85%"
+  },
+  messageAssistant: {
+    alignSelf: "flex-start"
+  },
+  messageUser: {
+    alignSelf: "flex-end",
+    flexDirection: "row-reverse"
+  },
+  avatar: {
+    width: "32px",
+    height: "32px",
+    borderRadius: "50%",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    fontSize: "0.875rem",
+    flexShrink: 0
+  },
+  avatarAssistant: {
+    background: "linear-gradient(135deg, #3b82f6, #8b5cf6)",
+    color: "white"
+  },
+  avatarUser: {
+    background: "#e5e7eb",
+    color: "#374151"
+  },
+  bubble: {
+    padding: "0.75rem 1rem",
+    borderRadius: "1rem",
+    fontSize: "0.9375rem",
+    lineHeight: "1.5"
+  },
+  bubbleAssistant: {
+    background: "#f3f4f6",
+    color: "#111827",
+    borderTopLeftRadius: "4px"
+  },
+  bubbleUser: {
+    background: "#3b82f6",
+    color: "white",
+    borderTopRightRadius: "4px"
+  },
+  actions: {
+    display: "flex",
+    flexWrap: "wrap",
+    gap: "0.5rem",
+    marginTop: "0.75rem"
+  },
+  actionButton: {
+    padding: "0.5rem 1rem",
+    borderRadius: "0.5rem",
+    fontSize: "0.875rem",
+    fontWeight: "500",
+    cursor: "pointer",
+    border: "none",
+    transition: "all 0.15s"
+  },
+  actionPrimary: {
+    background: "#3b82f6",
+    color: "white"
+  },
+  actionSecondary: {
+    background: "#e5e7eb",
+    color: "#374151"
+  },
+  actionOutline: {
+    background: "transparent",
+    color: "#3b82f6",
+    border: "1px solid #3b82f6"
+  },
+  inputContainer: {
+    display: "flex",
+    gap: "0.5rem",
+    padding: "1rem 0",
+    borderTop: "1px solid #e5e7eb"
+  },
+  input: {
+    flex: 1,
+    padding: "0.75rem 1rem",
+    borderRadius: "0.75rem",
+    border: "1px solid #d1d5db",
+    fontSize: "0.9375rem",
+    outline: "none"
+  },
+  sendButton: {
+    padding: "0.75rem 1.5rem",
+    borderRadius: "0.75rem",
+    background: "#3b82f6",
+    color: "white",
+    border: "none",
+    fontWeight: "500",
+    cursor: "pointer"
+  },
+  typing: {
+    display: "flex",
+    gap: "4px",
+    padding: "0.75rem 1rem",
+    background: "#f3f4f6",
+    borderRadius: "1rem",
+    width: "fit-content"
+  },
+  typingDot: {
+    width: "8px",
+    height: "8px",
+    borderRadius: "50%",
+    background: "#9ca3af",
+    animation: "typing 1.4s infinite"
+  },
+  moduleCard: {
+    display: "flex",
+    alignItems: "center",
+    gap: "0.75rem",
+    padding: "0.75rem",
+    background: "white",
+    border: "1px solid #e5e7eb",
+    borderRadius: "0.5rem",
+    cursor: "pointer",
+    transition: "all 0.15s"
+  },
+  moduleCardSelected: {
+    borderColor: "#3b82f6",
+    background: "#eff6ff"
+  },
+  moduleIcon: {
+    fontSize: "1.5rem"
+  },
+  moduleInfo: {
+    flex: 1
+  },
+  moduleName: {
+    fontWeight: "500",
+    color: "#111827"
+  },
+  moduleDesc: {
+    fontSize: "0.75rem",
+    color: "#6b7280"
+  },
+  checkbox: {
+    width: "20px",
+    height: "20px",
+    accentColor: "#3b82f6"
+  }
+};
+var MODULES = [
+  { id: "analytics", name: "Analytics", icon: "\u{1F4CA}", description: "Page views, events, sessions, web vitals", recommended: true },
+  { id: "seo", name: "SEO", icon: "\u{1F50D}", description: "Managed FAQs, meta tags, schema markup", recommended: true },
+  { id: "forms", name: "Forms", icon: "\u{1F4DD}", description: "Sonor-managed forms with submissions", recommended: true },
+  { id: "engage", name: "Engage", icon: "\u{1F4AC}", description: "Live chat, popups, nudges, banners", recommended: false },
+  { id: "commerce", name: "Commerce", icon: "\u{1F6D2}", description: "Products, services, checkout", recommended: false },
+  { id: "signal", name: "Signal AI", icon: "\u{1F916}", description: "Autonomous optimization & A/B testing", recommended: false }
+];
+function SetupAssistant({
+  apiUrl = "https://api.uptrademedia.com",
+  signalUrl = "https://signal.uptrademedia.com",
+  supabaseUrl,
+  supabaseKey,
+  projectId,
+  orgId,
+  authToken,
+  onComplete,
+  welcomeMessage
+}) {
+  const [messages, setMessages] = useState([]);
+  const [input, setInput] = useState("");
+  const [isTyping, setIsTyping] = useState(false);
+  const [isExtracting, setIsExtracting] = useState(false);
+  const [state, setState] = useState({
+    step: "welcome",
+    isAuthenticated: !!authToken,
+    selectedModules: ["analytics", "seo", "forms"],
+    config: {},
+    errors: [],
+    context: {
+      flow: null,
+      step: "welcome",
+      project_id: projectId,
+      org_id: orgId
+    }
+  });
+  const messagesEndRef = useRef(null);
+  const inputRef = useRef(null);
+  const streamingMessageRef = useRef(null);
+  const sendToSignalStreaming = useCallback(async (message, context, onToken, onComplete2) => {
+    try {
+      const response = await fetch(`${signalUrl}/api/skills/setup/chat/stream`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...authToken ? { Authorization: `Bearer ${authToken}` } : {}
+        },
+        body: JSON.stringify({
+          message,
+          context,
+          project_id: projectId,
+          org_id: orgId
+        })
+      });
+      if (!response.ok) {
+        throw new Error("Signal API error");
+      }
+      const reader = response.body?.getReader();
+      if (!reader) throw new Error("No response body");
+      const decoder = new TextDecoder();
+      let buffer = "";
+      let actions = [];
+      let updatedContext = {};
+      while (true) {
+        const { done, value } = await reader.read();
+        if (done) break;
+        buffer += decoder.decode(value, { stream: true });
+        const lines = buffer.split("\n");
+        buffer = lines.pop() || "";
+        for (const line of lines) {
+          if (line.startsWith("data: ")) {
+            const data = line.slice(6);
+            if (data === "[DONE]") continue;
+            try {
+              const event = JSON.parse(data);
+              if (event.type === "token") {
+                onToken(event.content);
+              } else if (event.type === "actions") {
+                actions = event.actions;
+              } else if (event.type === "context") {
+                updatedContext = event.context;
+              }
+            } catch {
+              onToken(data);
+            }
+          }
+        }
+      }
+      onComplete2({ actions, updated_context: updatedContext });
+    } catch (error) {
+      console.error("Signal streaming error:", error);
+      const result = await sendToSignal(message, context);
+      onToken(result.response);
+      onComplete2({ actions: result.actions, updated_context: result.updated_context });
+    }
+  }, [signalUrl, authToken, projectId, orgId]);
+  const sendToSignal = useCallback(async (message, context) => {
+    try {
+      const response = await fetch(`${signalUrl}/api/skills/setup/chat`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...authToken ? { Authorization: `Bearer ${authToken}` } : {}
+        },
+        body: JSON.stringify({
+          message,
+          context,
+          project_id: projectId,
+          org_id: orgId
+        })
+      });
+      if (!response.ok) {
+        throw new Error("Signal API error");
+      }
+      return await response.json();
+    } catch (error) {
+      console.error("Signal API error:", error);
+      return {
+        response: "I had trouble connecting to Signal. Let me help you locally.",
+        actions: [
+          { id: "1", label: "Continue", action: "continue_local", variant: "primary" }
+        ]
+      };
+    }
+  }, [signalUrl, authToken, projectId, orgId]);
+  const extractBrandFromDomain = useCallback(async (domain) => {
+    setIsExtracting(true);
+    try {
+      const response = await fetch(`${apiUrl}/site-scrape/brand-only`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...authToken ? { Authorization: `Bearer ${authToken}` } : {}
+        },
+        body: JSON.stringify({ domain })
+      });
+      if (!response.ok) {
+        throw new Error("Brand extraction failed");
+      }
+      const data = await response.json();
+      return {
+        business_name: data.business_name,
+        tagline: data.tagline,
+        primary_color: data.primary_color,
+        secondary_color: data.secondary_color,
+        logo_url: data.logo_url,
+        phone_numbers: data.phone_numbers,
+        email_addresses: data.email_addresses,
+        social_profiles: data.social_profiles
+      };
+    } catch (error) {
+      console.error("Brand extraction error:", error);
+      return null;
+    } finally {
+      setIsExtracting(false);
+    }
+  }, [apiUrl, authToken]);
+  const addMessage = useCallback((message) => {
+    const newMessage = {
+      ...message,
+      id: crypto.randomUUID(),
+      timestamp: /* @__PURE__ */ new Date()
+    };
+    setMessages((prev) => [...prev, newMessage]);
+    return newMessage;
+  }, []);
+  useCallback((id, update) => {
+    setMessages((prev) => prev.map(
+      (m) => m.id === id ? { ...m, ...update } : m
+    ));
+  }, []);
+  const addStreamingMessage = useCallback(() => {
+    const id = crypto.randomUUID();
+    const newMessage = {
+      id,
+      role: "assistant",
+      content: "",
+      timestamp: /* @__PURE__ */ new Date(),
+      isStreaming: true
+    };
+    setMessages((prev) => [...prev, newMessage]);
+    streamingMessageRef.current = id;
+    return id;
+  }, []);
+  const appendToStreamingMessage = useCallback((token) => {
+    const id = streamingMessageRef.current;
+    if (!id) return;
+    setMessages((prev) => prev.map(
+      (m) => m.id === id ? { ...m, content: m.content + token } : m
+    ));
+  }, []);
+  const finalizeStreamingMessage = useCallback((actions) => {
+    const id = streamingMessageRef.current;
+    if (!id) return;
+    setMessages((prev) => prev.map(
+      (m) => m.id === id ? { ...m, isStreaming: false, actions } : m
+    ));
+    streamingMessageRef.current = null;
+  }, []);
+  const addAssistantMessage = useCallback((content, actions, component) => {
+    setIsTyping(true);
+    setTimeout(() => {
+      setIsTyping(false);
+      addMessage({ role: "assistant", content, actions, component });
+    }, 500 + Math.random() * 500);
+  }, [addMessage]);
+  const scrollToBottom = useCallback(() => {
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, []);
+  useEffect(() => {
+    scrollToBottom();
+  }, [messages, isTyping, scrollToBottom]);
+  useEffect(() => {
+    const welcome = welcomeMessage || `Hey! \u{1F44B} I'm Signal, your AI setup assistant.
+
+I'll help you integrate Uptrade Site-Kit into your project. What are we working with today?`;
+    setTimeout(() => {
+      addAssistantMessage(welcome, [
+        { id: "1", label: "\u{1F195} New Site", action: "set_flow_new", variant: "primary" },
+        { id: "2", label: "\u{1F4C1} Existing Project", action: "set_flow_existing", variant: "secondary" },
+        { id: "3", label: "\u{1F504} Rebuild from Live Site", action: "set_flow_rebuild", variant: "outline" }
+      ]);
+    }, 500);
+  }, []);
+  const handleAction = useCallback(async (action, data) => {
+    switch (action) {
+      case "start":
+        addMessage({ role: "user", content: "Let's do it!" });
+        setState((prev) => ({ ...prev, step: "auth" }));
+        addAssistantMessage(
+          `Great! First, let's connect to your Sonor account.
+
+You can sign in with your existing Sonor credentials:`,
+          [
+            { id: "1", label: "Sign in with Email", action: "auth_email", variant: "primary" },
+            { id: "2", label: "Sign in with Google", action: "auth_google", variant: "secondary" },
+            { id: "3", label: "I don't have an account", action: "auth_signup", variant: "outline" }
+          ]
+        );
+        break;
+      case "explain":
+        addMessage({ role: "user", content: "Tell me more first" });
+        addAssistantMessage(
+          `Uptrade Site-Kit is a lightweight package that connects your site to Sonor.
+
+Here's what you can enable:
+
+\u{1F4CA} **Analytics** - Track page views, events, and Core Web Vitals
+\u{1F50D} **SEO** - Managed meta tags, FAQs, and schema markup
+\u{1F4DD} **Forms** - Sonor-managed forms with spam protection
+\u{1F4AC} **Engage** - Live chat, popups, and nudges
+\u{1F6D2} **Commerce** - Products, services, and checkout
+\u{1F916} **Signal AI** - Autonomous optimization and A/B testing
+
+You only pay for what you use, and everything is managed from your Sonor dashboard.`,
+          [
+            { id: "1", label: "Sounds good, let's set it up", action: "start", variant: "primary" }
+          ]
+        );
+        break;
+      case "auth_email":
+        addMessage({ role: "user", content: "Sign in with Email" });
+        addAssistantMessage(
+          `What's your Sonor email address?`
+        );
+        setState((prev) => ({ ...prev, step: "auth" }));
+        setTimeout(() => inputRef.current?.focus(), 600);
+        break;
+      case "auth_google":
+        addMessage({ role: "user", content: "Sign in with Google" });
+        addAssistantMessage(
+          `Opening Google sign-in... (In a real implementation, this would trigger OAuth)`
+        );
+        setTimeout(() => {
+          setState((prev) => ({
+            ...prev,
+            step: "project",
+            isAuthenticated: true,
+            userEmail: "user@example.com"
+          }));
+          handleAuthSuccess("user@example.com");
+        }, 1500);
+        break;
+      case "select_project":
+        addMessage({ role: "user", content: `Selected: ${data?.name}` });
+        setState((prev) => ({
+          ...prev,
+          step: "modules",
+          selectedProject: data
+        }));
+        showModuleSelection();
+        break;
+      case "confirm_modules":
+        addMessage({ role: "user", content: `Selected ${state.selectedModules.length} modules` });
+        setState((prev) => ({ ...prev, step: "config" }));
+        showConfigGeneration();
+        break;
+      case "copy_code":
+        addMessage({ role: "user", content: "Copy integration code" });
+        addAssistantMessage(
+          `\u2705 Code copied to clipboard!
+
+Paste this in your root layout file (e.g., \`app/layout.tsx\` or \`pages/_app.tsx\`).
+
+Want me to help you verify the integration?`,
+          [
+            { id: "1", label: "Yes, verify my setup", action: "verify", variant: "primary" },
+            { id: "2", label: "I'm all set, thanks!", action: "complete", variant: "outline" }
+          ]
+        );
+        break;
+      case "verify":
+        addMessage({ role: "user", content: "Verify my setup" });
+        setState((prev) => ({ ...prev, step: "verify" }));
+        addAssistantMessage(
+          `To verify your setup, start your dev server and visit any page.
+
+I'll check for:
+\u2022 \u2713 SiteKitProvider is loading
+\u2022 \u2713 API key is valid
+\u2022 \u2713 Analytics events are sending
+\u2022 \u2713 Modules are initializing
+
+Run \`npm run dev\` and let me know when you're ready:`,
+          [
+            { id: "1", label: "My dev server is running", action: "check_connection", variant: "primary" }
+          ]
+        );
+        break;
+      case "check_connection":
+        addMessage({ role: "user", content: "My dev server is running" });
+        setIsTyping(true);
+        setTimeout(() => {
+          setIsTyping(false);
+          addAssistantMessage(
+            `\u{1F389} **Everything looks great!**
+
+I detected your site at \`localhost:3000\` and verified:
+
+\u2705 SiteKitProvider initialized
+\u2705 API key authenticated
+\u2705 Analytics tracking active
+\u2705 SEO components ready
+
+You're all set! Your data will start appearing in your Sonor dashboard within a few minutes.`,
+            [
+              { id: "1", label: "Open Sonor Dashboard", action: "open_dashboard", variant: "primary" },
+              { id: "2", label: "Enable Signal AI", action: "enable_signal", variant: "secondary" }
+            ]
+          );
+          setState((prev) => ({ ...prev, step: "complete" }));
+        }, 2e3);
+        break;
+      case "complete":
+        addMessage({ role: "user", content: "I'm all set, thanks!" });
+        addAssistantMessage(
+          `Awesome! \u{1F680}
+
+Your site-kit integration is ready. Here's what happens next:
+
+\u2022 Analytics data will appear in Sonor within ~5 minutes
+\u2022 You can manage SEO, forms, and engage from the dashboard
+\u2022 If you enabled Signal, it'll start learning from your traffic
+
+Need help anytime? Just come back to \`/_uptrade/setup\` or ping us in Sonor.
+
+Happy building! \u{1F3A8}`
+        );
+        onComplete?.(state);
+        break;
+      case "enable_signal":
+        addMessage({ role: "user", content: "Enable Signal AI" });
+        addAssistantMessage(
+          `Great choice! \u{1F916}
+
+Signal AI will:
+\u2022 Monitor your site for SEO issues
+\u2022 Run A/B tests on CTAs and content
+\u2022 Optimize popups and engagement timing
+\u2022 Learn from user behavior to improve conversions
+
+To enable Signal, add \`signal={{ enabled: true }}\` to your SiteKitProvider:
+
+\`\`\`tsx
+<SiteKitProvider
+  apiKey={process.env.NEXT_PUBLIC_UPTRADE_API_KEY!}
+  analytics={{ enabled: true }}
+  signal={{ enabled: true }}  // Add this
+>
+\`\`\`
+
+Signal requires the Business plan. Want me to check your plan?`,
+          [
+            { id: "1", label: "Check my plan", action: "check_plan", variant: "primary" },
+            { id: "2", label: "I'll do this later", action: "complete", variant: "outline" }
+          ]
+        );
+        break;
+      case "confirm_brand":
+        addMessage({ role: "user", content: "Brand info confirmed" });
+        setState((prev) => ({ ...prev, step: "modules" }));
+        showModuleSelectionWithRecommendations();
+        break;
+      case "edit_brand":
+        addMessage({ role: "user", content: "Edit brand info" });
+        addAssistantMessage(
+          `No problem! Let me know what to change:
+
+\u2022 Business name
+\u2022 Primary color (hex like #3b82f6)
+\u2022 Tagline
+
+Just type what you'd like to update.`
+        );
+        break;
+      case "manual_brand":
+        addMessage({ role: "user", content: "Enter brand manually" });
+        addAssistantMessage(
+          `Sure! What's your business name?`
+        );
+        setState((prev) => ({
+          ...prev,
+          context: { ...prev.context, step: "brand_manual" }
+        }));
+        break;
+      case "skip_brand":
+        addMessage({ role: "user", content: "Skip brand for now" });
+        setState((prev) => ({ ...prev, step: "modules" }));
+        showModuleSelection();
+        break;
+      case "extract_brand":
+        addMessage({ role: "user", content: "Extract from website" });
+        addAssistantMessage(
+          `What's the website URL? I'll extract the brand colors, name, and logo.`
+        );
+        break;
+      case "set_flow_new":
+        addMessage({ role: "user", content: "New Site" });
+        setState((prev) => ({
+          ...prev,
+          context: { ...prev.context, flow: "new", step: "brand" }
+        }));
+        addAssistantMessage(
+          `Great! For a new site, I'll help you:
+
+1. Set up your brand (colors, name)
+2. Choose which modules to enable
+3. Generate integration code
+
+Do you have an existing website I can extract brand info from? Or would you prefer to enter it manually?`,
+          [
+            { id: "1", label: "Extract from website", action: "extract_brand", variant: "primary" },
+            { id: "2", label: "Enter manually", action: "manual_brand", variant: "outline" },
+            { id: "3", label: "Skip for now", action: "skip_brand", variant: "outline" }
+          ]
+        );
+        break;
+      case "set_flow_existing":
+        addMessage({ role: "user", content: "Existing Project" });
+        setState((prev) => ({
+          ...prev,
+          context: { ...prev.context, flow: "existing", step: "scan" }
+        }));
+        addAssistantMessage(
+          `For an existing project, I can scan your codebase to find:
+
+\u2022 Forms to migrate (contact forms, newsletter signups)
+\u2022 Chat widgets to replace (Intercom, Crisp, etc.)
+\u2022 Metadata patterns to enhance
+\u2022 Sitemap configuration
+
+Run this in your project root:
+
+\`\`\`bash
+npx @sonordev/site-kit scan
+\`\`\`
+
+Then paste the output here, or tell me about your project.`,
+          [
+            { id: "1", label: "I ran the scan", action: "show_scan_results", variant: "primary" },
+            { id: "2", label: "Skip scan", action: "skip_scan", variant: "outline" }
+          ]
+        );
+        break;
+      case "set_flow_rebuild":
+        addMessage({ role: "user", content: "Rebuild from Live Site" });
+        setState((prev) => ({
+          ...prev,
+          context: { ...prev.context, flow: "rebuild", step: "scrape" }
+        }));
+        addAssistantMessage(
+          `I'll help you rebuild with site-kit. Enter the live site URL and I'll:
+
+\u2022 Extract brand colors and business info
+\u2022 Import FAQs with schema markup
+\u2022 Suggest redirect mappings
+\u2022 Generate copilot-instructions.md
+
+What's the website URL?`
+        );
+        break;
+      case "show_scan_results":
+        addMessage({ role: "user", content: "I ran the scan" });
+        addAssistantMessage(
+          `Great! Paste the scan output here, or describe what you found.
+
+I'll analyze the results and recommend a migration plan.`
+        );
+        break;
+      case "skip_scan":
+        addMessage({ role: "user", content: "Skip scan" });
+        setState((prev) => ({ ...prev, step: "modules" }));
+        showModuleSelection();
+        break;
+      case "generate_redirects":
+        addMessage({ role: "user", content: "Generate redirects" });
+        if (state.context.scrape_results?.routes) {
+          addStreamingMessage();
+          await sendToSignalStreaming(
+            `Generate SEO-optimized redirects for these routes: ${JSON.stringify(state.context.scrape_results.routes)}`,
+            state.context,
+            (token) => appendToStreamingMessage(token),
+            (result) => finalizeStreamingMessage(result.actions)
+          );
+        } else {
+          addAssistantMessage(
+            `I need a list of routes to generate redirects. Would you like to:
+
+1. Scrape a website for routes
+2. Paste a list of URLs
+
+What's easier?`,
+            [
+              { id: "1", label: "Scrape website", action: "set_flow_rebuild", variant: "primary" },
+              { id: "2", label: "Paste URLs", action: "paste_urls", variant: "outline" }
+            ]
+          );
+        }
+        break;
+      case "generate_copilot_instructions":
+        addMessage({ role: "user", content: "Generate Copilot instructions" });
+        addStreamingMessage();
+        await sendToSignalStreaming(
+          `Generate copilot-instructions.md for project with modules: ${state.selectedModules.join(", ")} and brand: ${state.context.brand?.business_name || "Unknown"}`,
+          state.context,
+          (token) => appendToStreamingMessage(token),
+          (result) => {
+            finalizeStreamingMessage([
+              { id: "1", label: "\u{1F4CB} Copy to clipboard", action: "copy_copilot_instructions", variant: "primary" },
+              { id: "2", label: "Continue", action: "complete", variant: "outline" }
+            ]);
+          }
+        );
+        break;
+      case "verify_now":
+        addMessage({ role: "user", content: "Verify integration" });
+        verifyIntegration();
+        break;
+    }
+  }, [addMessage, addAssistantMessage, addStreamingMessage, appendToStreamingMessage, finalizeStreamingMessage, sendToSignalStreaming, state, onComplete]);
+  const handleAuthSuccess = useCallback((email) => {
+    addAssistantMessage(
+      `Welcome back, ${email.split("@")[0]}! \u{1F44B}
+
+I found these projects in your account. Which one are we setting up?`,
+      [
+        { id: "1", label: "MyCompany.com", action: "select_project", variant: "secondary", data: { id: "1", name: "MyCompany.com", domain: "mycompany.com" } },
+        { id: "2", label: "Blog Project", action: "select_project", variant: "secondary", data: { id: "2", name: "Blog Project", domain: "blog.mycompany.com" } },
+        { id: "3", label: "+ Create new project", action: "create_project", variant: "outline" }
+      ]
+    );
+  }, [addAssistantMessage]);
+  const verifyIntegration = useCallback(async () => {
+    setState((prev) => ({ ...prev, step: "verify" }));
+    setIsTyping(true);
+    try {
+      const response = await fetch(`${signalUrl}/api/skills/setup/verify`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...authToken ? { Authorization: `Bearer ${authToken}` } : {}
+        },
+        body: JSON.stringify({
+          project_id: projectId || state.context.project_id,
+          dev_url: "http://localhost:3000"
+        })
+      });
+      setIsTyping(false);
+      if (!response.ok) {
+        throw new Error("Verification failed");
+      }
+      const result = await response.json();
+      if (result.overall_status === "success") {
+        const checkList = result.checks.map(
+          (c) => `${c.passed ? "\u2705" : "\u274C"} ${c.check.replace(/_/g, " ")}`
+        ).join("\n");
+        addAssistantMessage(
+          `\u{1F389} **Integration Verified!**
+
+${checkList}
+
+Your site-kit integration is working perfectly. Data will start appearing in Sonor shortly.`,
+          [
+            { id: "1", label: "Open Sonor Dashboard", action: "open_dashboard", variant: "primary" },
+            { id: "2", label: "Generate Copilot Instructions", action: "generate_copilot_instructions", variant: "secondary" }
+          ]
+        );
+        setState((prev) => ({ ...prev, step: "complete" }));
+      } else {
+        const issues = result.issues?.join("\n\u2022 ") || "Unknown issue";
+        addAssistantMessage(
+          `\u26A0\uFE0F **Verification Found Issues**
+
+\u2022 ${issues}
+
+Would you like help troubleshooting?`,
+          [
+            { id: "1", label: "Help me fix this", action: "troubleshoot", variant: "primary" },
+            { id: "2", label: "Skip for now", action: "complete", variant: "outline" }
+          ]
+        );
+      }
+    } catch (error) {
+      setIsTyping(false);
+      addAssistantMessage(
+        `I couldn't verify the integration automatically. Make sure your dev server is running.
+
+You can manually verify by:
+1. Opening your site in the browser
+2. Checking the Network tab for requests to api.uptrademedia.com
+3. Looking for analytics events in your Sonor dashboard`,
+        [
+          { id: "1", label: "Try again", action: "verify_now", variant: "primary" },
+          { id: "2", label: "Continue anyway", action: "complete", variant: "outline" }
+        ]
+      );
+    }
+  }, [signalUrl, authToken, projectId, state.context.project_id, addAssistantMessage]);
+  const showModuleSelectionWithRecommendations = useCallback(async () => {
+    const { brand, business_type, scan_results } = state.context;
+    if (brand || business_type) {
+      try {
+        const result = await sendToSignal(
+          `Recommend modules for: ${brand?.business_name || "Unknown"}, type: ${business_type || "general"}`,
+          { ...state.context, step: "recommend_modules" }
+        );
+        addAssistantMessage(
+          result.response,
+          void 0,
+          /* @__PURE__ */ jsx(
+            ModuleSelector,
+            {
+              modules: MODULES,
+              selected: state.selectedModules,
+              onChange: (modules) => setState((prev) => ({ ...prev, selectedModules: modules })),
+              onConfirm: () => handleAction("confirm_modules")
+            }
+          )
+        );
+        return;
+      } catch (error) {
+      }
+    }
+    showModuleSelection();
+  }, [state.context, state.selectedModules, sendToSignal, handleAction]);
+  const showModuleSelection = useCallback(() => {
+    addAssistantMessage(
+      `Perfect! Now let's choose which features to enable.
+
+I've pre-selected the essentials, but you can customize:`,
+      void 0,
+      /* @__PURE__ */ jsx(
+        ModuleSelector,
+        {
+          modules: MODULES,
+          selected: state.selectedModules,
+          onChange: (modules) => setState((prev) => ({ ...prev, selectedModules: modules })),
+          onConfirm: () => handleAction("confirm_modules")
+        }
+      )
+    );
+  }, [addAssistantMessage, state.selectedModules, handleAction]);
+  const showConfigGeneration = useCallback(() => {
+    const code = generateIntegrationCode(state);
+    addAssistantMessage(
+      `Here's your integration code! \u{1F389}
+
+Add this to your root layout:`,
+      [
+        { id: "1", label: "\u{1F4CB} Copy Code", action: "copy_code", variant: "primary" }
+      ],
+      /* @__PURE__ */ jsx(CodeBlock, { code })
+    );
+  }, [addAssistantMessage, state]);
+  const handleSubmit = useCallback(async (e) => {
+    e.preventDefault();
+    if (!input.trim()) return;
+    const userInput = input.trim();
+    setInput("");
+    addMessage({ role: "user", content: userInput });
+    if (state.step === "auth" && userInput.includes("@")) {
+      setState((prev) => ({
+        ...prev,
+        isAuthenticated: true,
+        userEmail: userInput,
+        step: "project"
+      }));
+      addAssistantMessage(
+        `Sending magic link to ${userInput}...
+
+(In production, you'd receive an email. For now, I'll simulate a successful login.)`
+      );
+      setTimeout(() => handleAuthSuccess(userInput), 1500);
+    } else if (userInput.toLowerCase().includes("http") || userInput.match(/^[\w.-]+\.[a-z]{2,}$/i)) {
+      const domain = userInput.replace(/^https?:\/\//, "").split("/")[0];
+      setIsTyping(true);
+      addAssistantMessage(`Analyzing ${domain} to extract brand information...`);
+      const brand = await extractBrandFromDomain(domain);
+      setIsTyping(false);
+      if (brand) {
+        setState((prev) => ({
+          ...prev,
+          context: { ...prev.context, brand, domain }
+        }));
+        const brandSummary = [
+          brand.business_name && `**Business:** ${brand.business_name}`,
+          brand.tagline && `**Tagline:** ${brand.tagline}`,
+          brand.primary_color && `**Primary Color:** ${brand.primary_color}`,
+          brand.phone_numbers?.length && `**Phone:** ${brand.phone_numbers[0]}`
+        ].filter(Boolean).join("\n");
+        addAssistantMessage(
+          `Found brand information:
+
+${brandSummary}
+
+Does this look right?`,
+          [
+            { id: "1", label: "Yes, looks good!", action: "confirm_brand", variant: "primary" },
+            { id: "2", label: "Edit brand info", action: "edit_brand", variant: "outline" }
+          ]
+        );
+      } else {
+        addAssistantMessage(
+          `I couldn't extract brand info from ${domain}. You can enter it manually, or we can continue without it.`,
+          [
+            { id: "1", label: "Enter manually", action: "manual_brand", variant: "primary" },
+            { id: "2", label: "Skip for now", action: "skip_brand", variant: "outline" }
+          ]
+        );
+      }
+    } else {
+      addStreamingMessage();
+      try {
+        await sendToSignalStreaming(
+          userInput,
+          state.context,
+          (token) => appendToStreamingMessage(token),
+          (result) => {
+            if (result.updated_context) {
+              setState((prev) => ({
+                ...prev,
+                context: { ...prev.context, ...result.updated_context }
+              }));
+            }
+            finalizeStreamingMessage(result.actions);
+          }
+        );
+      } catch (error) {
+        finalizeStreamingMessage();
+        addAssistantMessage(
+          `I understand you said: "${userInput}"
+
+Let me help you with that. What would you like to do?`,
+          [
+            { id: "1", label: "Continue setup", action: "start", variant: "primary" },
+            { id: "2", label: "Ask a question", action: "help", variant: "outline" }
+          ]
+        );
+      }
+    }
+  }, [input, state.step, state.context, addMessage, addAssistantMessage, handleAuthSuccess, sendToSignalStreaming, appendToStreamingMessage, finalizeStreamingMessage, addStreamingMessage, extractBrandFromDomain]);
+  return /* @__PURE__ */ jsxs("div", { style: styles.container, children: [
+    /* @__PURE__ */ jsxs("div", { style: styles.header, children: [
+      /* @__PURE__ */ jsx("div", { style: styles.logo, children: "U" }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("div", { style: styles.title, children: "Uptrade Setup" }),
+        /* @__PURE__ */ jsx("div", { style: styles.subtitle, children: "Site-Kit Integration Wizard" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: styles.messages, children: [
+      messages.map((message) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          style: {
+            ...styles.message,
+            ...message.role === "assistant" ? styles.messageAssistant : styles.messageUser
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  ...styles.avatar,
+                  ...message.role === "assistant" ? styles.avatarAssistant : styles.avatarUser
+                },
+                children: message.role === "assistant" ? "\u2728" : "\u{1F464}"
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    ...styles.bubble,
+                    ...message.role === "assistant" ? styles.bubbleAssistant : styles.bubbleUser
+                  },
+                  children: message.content.split("\n").map((line, i) => /* @__PURE__ */ jsxs(React2.Fragment, { children: [
+                    line,
+                    i < message.content.split("\n").length - 1 && /* @__PURE__ */ jsx("br", {})
+                  ] }, i))
+                }
+              ),
+              message.component,
+              message.actions && /* @__PURE__ */ jsx("div", { style: styles.actions, children: message.actions.map((action) => /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: () => handleAction(action.action, action.data),
+                  style: {
+                    ...styles.actionButton,
+                    ...action.variant === "primary" ? styles.actionPrimary : action.variant === "outline" ? styles.actionOutline : styles.actionSecondary
+                  },
+                  children: action.label
+                },
+                action.id
+              )) })
+            ] })
+          ]
+        },
+        message.id
+      )),
+      isTyping && /* @__PURE__ */ jsxs("div", { style: { ...styles.message, ...styles.messageAssistant }, children: [
+        /* @__PURE__ */ jsx("div", { style: { ...styles.avatar, ...styles.avatarAssistant }, children: "\u2728" }),
+        /* @__PURE__ */ jsxs("div", { style: styles.typing, children: [
+          /* @__PURE__ */ jsx("div", { style: { ...styles.typingDot, animationDelay: "0s" } }),
+          /* @__PURE__ */ jsx("div", { style: { ...styles.typingDot, animationDelay: "0.2s" } }),
+          /* @__PURE__ */ jsx("div", { style: { ...styles.typingDot, animationDelay: "0.4s" } })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { ref: messagesEndRef })
+    ] }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, style: styles.inputContainer, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: inputRef,
+          type: "text",
+          value: input,
+          onChange: (e) => setInput(e.target.value),
+          placeholder: "Type a message...",
+          style: styles.input
+        }
+      ),
+      /* @__PURE__ */ jsx("button", { type: "submit", style: styles.sendButton, children: "Send" })
+    ] }),
+    /* @__PURE__ */ jsx("style", { children: `
+        @keyframes typing {
+          0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
+          30% { transform: translateY(-4px); opacity: 1; }
+        }
+      ` })
+  ] });
+}
+function ModuleSelector({
+  modules,
+  selected,
+  onChange,
+  onConfirm
+}) {
+  const toggle = (id) => {
+    onChange(
+      selected.includes(id) ? selected.filter((m) => m !== id) : [...selected, id]
+    );
+  };
+  return /* @__PURE__ */ jsxs("div", { style: { marginTop: "0.75rem", display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
+    modules.map((module) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        onClick: () => toggle(module.id),
+        style: {
+          ...styles.moduleCard,
+          ...selected.includes(module.id) ? styles.moduleCardSelected : {}
+        },
+        children: [
+          /* @__PURE__ */ jsx("span", { style: styles.moduleIcon, children: module.icon }),
+          /* @__PURE__ */ jsxs("div", { style: styles.moduleInfo, children: [
+            /* @__PURE__ */ jsxs("div", { style: styles.moduleName, children: [
+              module.name,
+              module.recommended && /* @__PURE__ */ jsx("span", { style: { marginLeft: "0.5rem", fontSize: "0.625rem", background: "#dbeafe", color: "#1d4ed8", padding: "2px 6px", borderRadius: "4px" }, children: "Recommended" })
+            ] }),
+            /* @__PURE__ */ jsx("div", { style: styles.moduleDesc, children: module.description })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "checkbox",
+              checked: selected.includes(module.id),
+              onChange: () => toggle(module.id),
+              style: styles.checkbox
+            }
+          )
+        ]
+      },
+      module.id
+    )),
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        onClick: onConfirm,
+        style: { ...styles.actionButton, ...styles.actionPrimary, marginTop: "0.5rem" },
+        children: [
+          "Continue with ",
+          selected.length,
+          " modules"
+        ]
+      }
+    )
+  ] });
+}
+function CodeBlock({ code }) {
+  return /* @__PURE__ */ jsx("pre", { style: {
+    marginTop: "0.75rem",
+    padding: "1rem",
+    background: "#1f2937",
+    color: "#e5e7eb",
+    borderRadius: "0.5rem",
+    fontSize: "0.8125rem",
+    overflowX: "auto",
+    fontFamily: "monospace"
+  }, children: code });
+}
+function generateIntegrationCode(state) {
+  const { selectedModules } = state;
+  const moduleConfigs = [];
+  if (selectedModules.includes("analytics")) {
+    moduleConfigs.push(`  analytics={{ enabled: true }}`);
+  }
+  if (selectedModules.includes("engage")) {
+    moduleConfigs.push(`  engage={{ enabled: true }}`);
+  }
+  if (selectedModules.includes("forms")) {
+    moduleConfigs.push(`  forms={{ enabled: true }}`);
+  }
+  if (selectedModules.includes("signal")) {
+    moduleConfigs.push(`  signal={{ enabled: true, realtime: true }}`);
+  }
+  return `// app/layout.tsx (or pages/_app.tsx)
+import { SiteKitProvider } from '@sonordev/site-kit'
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        <SiteKitProvider
+          apiKey={process.env.NEXT_PUBLIC_UPTRADE_API_KEY!}
+${moduleConfigs.join("\n")}
+        >
+          {children}
+        </SiteKitProvider>
+      </body>
+    </html>
+  )
+}`;
+}
+
+// src/sync/api.ts
+var DEFAULT_API_URL = "https://api.uptrademedia.com";
+function getApiConfig2() {
+  const apiUrl = typeof window !== "undefined" ? window.__SITE_KIT_API_URL__ || DEFAULT_API_URL : DEFAULT_API_URL;
+  const apiKey = typeof window !== "undefined" ? window.__SITE_KIT_API_KEY__ : void 0;
+  return { apiUrl, apiKey };
+}
+function buildHeaders(apiKey, isPost = false) {
+  const headers = {};
+  if (isPost) headers["Content-Type"] = "application/json";
+  if (apiKey) headers["x-api-key"] = apiKey;
+  return headers;
+}
+async function fetchBookingTypes(orgSlug, apiUrl, apiKey) {
+  const cfg = getApiConfig2();
+  const url = apiUrl || cfg.apiUrl;
+  const key = apiKey || cfg.apiKey;
+  const endpoint = key ? `${url}/sync/widget/types` : `${url}/sync/public/${orgSlug}/types`;
+  const response = await fetch(endpoint, { headers: buildHeaders(key) });
+  if (!response.ok) {
+    const msg = await response.json().catch(() => ({ message: response.statusText }));
+    const detail = msg && typeof msg.message === "string" ? msg.message : response.statusText;
+    throw new Error(`Failed to fetch booking types: ${response.status} ${detail}`);
+  }
+  const data = await response.json();
+  return data.types || [];
+}
+async function fetchBookingTypeDetails(typeSlug, orgSlug, apiUrl, apiKey) {
+  const cfg = getApiConfig2();
+  const url = apiUrl || cfg.apiUrl;
+  const key = apiKey || cfg.apiKey;
+  const endpoint = key ? `${url}/sync/widget/types/${typeSlug}` : `${url}/sync/public/${orgSlug}/types/${typeSlug}`;
+  const response = await fetch(endpoint, { headers: buildHeaders(key) });
+  if (!response.ok) {
+    const msg = await response.json().catch(() => ({ message: response.statusText }));
+    const detail = msg && typeof msg.message === "string" ? msg.message : response.statusText;
+    throw new Error(`Failed to fetch booking type: ${response.status} ${detail}`);
+  }
+  return response.json();
+}
+async function fetchAvailability(typeSlug, date, orgSlug, apiUrl, apiKey, timezone, hostId) {
+  const cfg = getApiConfig2();
+  const url = apiUrl || cfg.apiUrl;
+  const key = apiKey || cfg.apiKey;
+  const params = new URLSearchParams({ date });
+  if (timezone) params.append("timezone", timezone);
+  if (hostId) params.append("hostId", hostId);
+  const endpoint = key ? `${url}/sync/widget/availability/${typeSlug}?${params}` : `${url}/sync/public/${orgSlug}/availability/${typeSlug}?${params}`;
+  const response = await fetch(endpoint, { headers: buildHeaders(key) });
+  if (!response.ok) {
+    const msg = await response.json().catch(() => ({ message: response.statusText }));
+    let detail = msg && typeof msg.message === "string" ? String(msg.message).trim() : (response.statusText || "").trim();
+    if (detail === String(response.status) || /^\d+$/.test(detail)) detail = "";
+    const rest = detail ? `${response.status} ${detail}` : String(response.status);
+    const fallback = response.status === 404 && !detail ? "No times available. In the Portal, check Sync \u2192 Booking Types (Schedule a Tour) has a host assigned and the project API key is set for this site." : null;
+    throw new Error(fallback || `Failed to fetch availability: ${rest}`.trim());
+  }
+  const data = await response.json();
+  const raw = data.slots || [];
+  return raw.map((slot) => ({
+    start: slot.startTime ?? slot.start,
+    end: slot.endTime ?? slot.end,
+    hostId: slot.hostId,
+    available: slot.available !== false
+  }));
+}
+async function createSlotHold(holdData, apiUrl, apiKey) {
+  const cfg = getApiConfig2();
+  const url = apiUrl || cfg.apiUrl;
+  const key = apiKey || cfg.apiKey;
+  const endpoint = key ? `${url}/sync/widget/hold` : `${url}/sync/public/hold`;
+  const response = await fetch(endpoint, {
+    method: "POST",
+    headers: buildHeaders(key, true),
+    body: JSON.stringify(holdData)
+  });
+  if (!response.ok) {
+    throw new Error(`Failed to hold slot: ${response.statusText}`);
+  }
+  return response.json();
+}
+async function releaseSlotHold(holdId, apiUrl, apiKey) {
+  const cfg = getApiConfig2();
+  const url = apiUrl || cfg.apiUrl;
+  const key = apiKey || cfg.apiKey;
+  const endpoint = key ? `${url}/sync/widget/hold/${holdId}` : `${url}/sync/public/hold/${holdId}`;
+  await fetch(endpoint, {
+    method: "DELETE",
+    headers: buildHeaders(key)
+  });
+}
+async function createBooking(bookingData, apiUrl, apiKey) {
+  const cfg = getApiConfig2();
+  const url = apiUrl || cfg.apiUrl;
+  const key = apiKey || cfg.apiKey;
+  const endpoint = key ? `${url}/sync/widget/booking` : `${url}/sync/public/booking`;
+  const response = await fetch(endpoint, {
+    method: "POST",
+    headers: buildHeaders(key, true),
+    body: JSON.stringify(bookingData)
+  });
+  if (!response.ok) {
+    const errorData = await response.json().catch(() => ({}));
+    throw new Error(errorData.message || `Failed to create booking: ${response.statusText}`);
+  }
+  return response.json();
+}
+async function fetchAvailableDates(typeSlug, startDate, endDate, orgSlug, apiUrl, apiKey, timezone) {
+  const availableDates = [];
+  const start = new Date(startDate);
+  const end = new Date(endDate);
+  const current = new Date(start);
+  while (current <= end) {
+    const dateStr = current.toISOString().split("T")[0];
+    try {
+      const slots = await fetchAvailability(typeSlug, dateStr, orgSlug, apiUrl, apiKey, timezone);
+      if (slots.some((s) => s.available)) {
+        availableDates.push(dateStr);
+      }
+    } catch {
+    }
+    current.setDate(current.getDate() + 1);
+  }
+  return availableDates;
+}
+function detectTimezone() {
+  try {
+    return Intl.DateTimeFormat().resolvedOptions().timeZone;
+  } catch {
+    return "America/New_York";
+  }
+}
+function formatTime(isoString, timezone) {
+  const date = new Date(isoString);
+  return date.toLocaleTimeString("en-US", {
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true,
+    timeZone: timezone
+  });
+}
+function formatDate2(isoString, timezone) {
+  const date = new Date(isoString);
+  return date.toLocaleDateString("en-US", {
+    weekday: "long",
+    month: "long",
+    day: "numeric",
+    year: "numeric",
+    timeZone: timezone
+  });
+}
+function formatDuration(minutes) {
+  if (minutes < 60) {
+    return `${minutes} min`;
+  }
+  const hours = Math.floor(minutes / 60);
+  const mins = minutes % 60;
+  if (mins === 0) {
+    return `${hours} hour${hours > 1 ? "s" : ""}`;
+  }
+  return `${hours}h ${mins}m`;
+}
+var DEFAULT_API_URL2 = "https://api.uptrademedia.com";
+var DAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+var MONTHS = [
+  "January",
+  "February",
+  "March",
+  "April",
+  "May",
+  "June",
+  "July",
+  "August",
+  "September",
+  "October",
+  "November",
+  "December"
+];
+function isSameDay(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+}
+function isBeforeDay(a, b) {
+  const ac = new Date(a.getFullYear(), a.getMonth(), a.getDate());
+  const bc = new Date(b.getFullYear(), b.getMonth(), b.getDate());
+  return ac < bc;
+}
+function calendarDays(year, month) {
+  const first = new Date(year, month, 1);
+  const last = new Date(year, month + 1, 0);
+  const cells = [];
+  for (let i = 0; i < first.getDay(); i++) cells.push(null);
+  for (let d = 1; d <= last.getDate(); d++) cells.push(new Date(year, month, d));
+  return cells;
+}
+function ChevronLeft() {
+  return /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M12.5 15L7.5 10L12.5 5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function ChevronRight() {
+  return /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M7.5 5L12.5 10L7.5 15", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function ClockIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", strokeWidth: "1.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 4.5V8L10 10", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" })
+  ] });
+}
+function GlobeIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", strokeWidth: "1.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M1.5 8H14.5", stroke: "currentColor", strokeWidth: "1.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 1.5C9.66 3.34 10.61 5.62 10.61 8C10.61 10.38 9.66 12.66 8 14.5C6.34 12.66 5.39 10.38 5.39 8C5.39 5.62 6.34 3.34 8 1.5Z", stroke: "currentColor", strokeWidth: "1.2" })
+  ] });
+}
+function CheckCircleIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "56", height: "56", viewBox: "0 0 56 56", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "28", cy: "28", r: "28", fill: "var(--bw-primary)" }),
+    /* @__PURE__ */ jsx("path", { d: "M18 28.5L24.5 35L38 21.5", stroke: "white", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round" })
+  ] });
+}
+function CalendarPlusIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsx("rect", { x: "1.5", y: "2.5", width: "13", height: "12", rx: "1.5", stroke: "currentColor", strokeWidth: "1.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M1.5 6.5H14.5", stroke: "currentColor", strokeWidth: "1.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M5 1V4M11 1V4", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 9V12M6.5 10.5H9.5", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round" })
+  ] });
+}
+function ArrowLeftIcon() {
+  return /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M10 3L5 8L10 13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function SpinnerIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "bw-spinner", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeDasharray: "50.265", strokeDashoffset: "25", opacity: "0.3" }),
+    /* @__PURE__ */ jsx("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeDasharray: "50.265", strokeDashoffset: "37.7" })
+  ] });
+}
+function BookingWidget({
+  orgSlug,
+  apiKey: propApiKey,
+  apiUrl: propApiUrl,
+  bookingTypeSlug,
+  timezone: propTimezone,
+  className = "",
+  daysToShow = 60,
+  onBookingComplete,
+  onError,
+  hideTypeSelector = false,
+  styles: styles2 = {}
+}) {
+  const apiKey = propApiKey || (typeof window !== "undefined" ? window.__SITE_KIT_API_KEY__ : void 0);
+  const apiUrl = propApiUrl || (typeof window !== "undefined" ? window.__SITE_KIT_API_URL__ : void 0) || DEFAULT_API_URL2;
+  const [step, setStep] = useState(bookingTypeSlug ? "datetime" : "type");
+  const [loading, setLoading] = useState(false);
+  const [slotsLoading, setSlotsLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [bookingTypes, setBookingTypes] = useState([]);
+  const [selectedType, setSelectedType] = useState(null);
+  const [viewMonth, setViewMonth] = useState(() => /* @__PURE__ */ new Date());
+  const [selectedDate, setSelectedDate] = useState(null);
+  const [slots, setSlots] = useState([]);
+  const [selectedSlot, setSelectedSlot] = useState(null);
+  const [confirmedSlot, setConfirmedSlot] = useState(false);
+  const [hold, setHold] = useState(null);
+  const [guestInfo, setGuestInfo] = useState({ name: "", email: "" });
+  const [bookingResult, setBookingResult] = useState(null);
+  const [submitting, setSubmitting] = useState(false);
+  const slotsRef = useRef(null);
+  const today = useMemo(() => {
+    const d = /* @__PURE__ */ new Date();
+    d.setHours(0, 0, 0, 0);
+    return d;
+  }, []);
+  const timezone = useMemo(() => propTimezone || detectTimezone(), [propTimezone]);
+  const shortTz = useMemo(() => {
+    try {
+      const parts = Intl.DateTimeFormat("en-US", { timeZone: timezone, timeZoneName: "short" }).formatToParts(/* @__PURE__ */ new Date());
+      return parts.find((p) => p.type === "timeZoneName")?.value || timezone;
+    } catch {
+      return timezone;
+    }
+  }, [timezone]);
+  const days = useMemo(() => calendarDays(viewMonth.getFullYear(), viewMonth.getMonth()), [viewMonth]);
+  const maxDate = useMemo(() => {
+    const d = new Date(today);
+    d.setDate(d.getDate() + daysToShow);
+    return d;
+  }, [today, daysToShow]);
+  useEffect(() => {
+    if (bookingTypeSlug) {
+      setLoading(true);
+      fetchBookingTypeDetails(bookingTypeSlug, orgSlug, apiUrl, apiKey).then((type) => {
+        setSelectedType(type);
+        setStep("datetime");
+      }).catch((err) => {
+        setError(err.message);
+        onError?.(err);
+      }).finally(() => setLoading(false));
+    } else {
+      setLoading(true);
+      fetchBookingTypes(orgSlug, apiUrl, apiKey).then((types) => setBookingTypes(types.filter((t) => t.is_active))).catch((err) => {
+        setError(err.message);
+        onError?.(err);
+      }).finally(() => setLoading(false));
+    }
+  }, [orgSlug, apiKey, bookingTypeSlug, apiUrl, onError]);
+  useEffect(() => {
+    if (!selectedDate || !selectedType) return;
+    const dateStr = selectedDate.toISOString().split("T")[0];
+    setSlotsLoading(true);
+    setSlots([]);
+    setSelectedSlot(null);
+    setConfirmedSlot(false);
+    fetchAvailability(selectedType.slug, dateStr, orgSlug, apiUrl, apiKey, timezone).then((s) => setSlots(s.filter((slot) => slot.available))).catch((err) => {
+      setError(err.message);
+      onError?.(err);
+    }).finally(() => setSlotsLoading(false));
+  }, [selectedDate, selectedType, orgSlug, apiKey, apiUrl, timezone, onError]);
+  const handleSlotSelect = useCallback((slot) => {
+    setSelectedSlot(slot);
+    setConfirmedSlot(false);
+  }, []);
+  const handleSlotConfirm = useCallback(async () => {
+    if (!selectedType || !selectedSlot) return;
+    if (hold) await releaseSlotHold(hold.holdId, apiUrl, apiKey).catch(() => {
+    });
+    setLoading(true);
+    try {
+      const newHold = await createSlotHold(
+        {
+          bookingType: selectedType.slug,
+          slotStart: selectedSlot.start,
+          slotEnd: selectedSlot.end,
+          hostId: selectedSlot.hostId || "",
+          sessionId: `bw-${Date.now()}`
+        },
+        apiUrl,
+        apiKey
+      );
+      setHold(newHold);
+      setConfirmedSlot(true);
+      setStep("form");
+    } catch (err) {
+      setError(err.message);
+      onError?.(err);
+    } finally {
+      setLoading(false);
+    }
+  }, [selectedType, selectedSlot, hold, timezone, apiUrl, apiKey, onError]);
+  const handleBookingSubmit = useCallback(async (e) => {
+    e.preventDefault();
+    if (!selectedType || !selectedSlot) return;
+    setSubmitting(true);
+    setError(null);
+    try {
+      const result = await createBooking(
+        {
+          bookingType: selectedType.slug,
+          scheduledAt: selectedSlot.start,
+          hostId: selectedSlot.hostId || "",
+          name: guestInfo.name,
+          email: guestInfo.email,
+          phone: guestInfo.phone,
+          message: guestInfo.notes,
+          source: "main-site",
+          timezone,
+          holdId: hold?.holdId,
+          sessionId: `bw-${Date.now()}`,
+          sourceUrl: typeof window !== "undefined" ? window.location.href : void 0
+        },
+        apiUrl,
+        apiKey
+      );
+      setBookingResult(result);
+      setStep("success");
+      onBookingComplete?.(result);
+    } catch (err) {
+      setError(err.message);
+      onError?.(err);
+    } finally {
+      setSubmitting(false);
+    }
+  }, [selectedType, selectedSlot, guestInfo, timezone, hold, apiUrl, apiKey, onBookingComplete, onError]);
+  useEffect(() => {
+    return () => {
+      if (hold) releaseSlotHold(hold.holdId, apiUrl, apiKey).catch(() => {
+      });
+    };
+  }, [hold, apiUrl, apiKey]);
+  const canGoPrev = viewMonth.getFullYear() > today.getFullYear() || viewMonth.getMonth() > today.getMonth();
+  const canGoNext = viewMonth < maxDate;
+  const goMonth = (dir) => {
+    setViewMonth((prev) => new Date(prev.getFullYear(), prev.getMonth() + dir, 1));
+  };
+  const groupedSlots = useMemo(() => {
+    const morning = [];
+    const afternoon = [];
+    const evening = [];
+    for (const s of slots) {
+      const h = new Date(s.start).getHours();
+      if (h < 12) morning.push(s);
+      else if (h < 17) afternoon.push(s);
+      else evening.push(s);
+    }
+    return { morning, afternoon, evening };
+  }, [slots]);
+  const cssVars = {
+    "--bw-primary": styles2.primaryColor || "#0069ff",
+    "--bw-primary-light": styles2.primaryColor ? `color-mix(in srgb, ${styles2.primaryColor} 12%, white)` : "#e8f1ff",
+    "--bw-primary-hover": styles2.primaryColor ? `color-mix(in srgb, ${styles2.primaryColor} 90%, black)` : "#0055d4",
+    "--bw-radius": styles2.borderRadius || "8px",
+    "--bw-font": styles2.fontFamily || "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif"
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `bw-root ${className}`, style: cssVars, children: [
+    error && /* @__PURE__ */ jsxs("div", { className: "bw-error", role: "alert", children: [
+      /* @__PURE__ */ jsx("span", { children: error }),
+      /* @__PURE__ */ jsx("button", { onClick: () => setError(null), "aria-label": "Dismiss error", children: "\xD7" })
+    ] }),
+    step === "type" && !hideTypeSelector && /* @__PURE__ */ jsxs("div", { className: "bw-step bw-fade-in", children: [
+      /* @__PURE__ */ jsx("h2", { className: "bw-heading", children: "Select a Service" }),
+      loading ? /* @__PURE__ */ jsxs("div", { className: "bw-loading", children: [
+        /* @__PURE__ */ jsx(SpinnerIcon, {}),
+        " Loading services..."
+      ] }) : /* @__PURE__ */ jsx("div", { className: "bw-type-list", children: bookingTypes.map((type) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          className: "bw-type-card",
+          onClick: () => {
+            setSelectedType(type);
+            setStep("datetime");
+          },
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "bw-type-name", children: type.name }),
+            type.description && /* @__PURE__ */ jsx("span", { className: "bw-type-desc", children: type.description }),
+            /* @__PURE__ */ jsxs("span", { className: "bw-type-meta", children: [
+              /* @__PURE__ */ jsx(ClockIcon, {}),
+              " ",
+              formatDuration(type.duration_minutes),
+              type.price_cents ? ` \xB7 $${(type.price_cents / 100).toFixed(2)}` : " \xB7 Free"
+            ] })
+          ]
+        },
+        type.id
+      )) })
+    ] }),
+    step === "datetime" && selectedType && /* @__PURE__ */ jsxs("div", { className: "bw-step bw-fade-in", children: [
+      /* @__PURE__ */ jsxs("div", { className: "bw-info-header", children: [
+        !bookingTypeSlug && /* @__PURE__ */ jsx("button", { className: "bw-back", onClick: () => {
+          setSelectedType(null);
+          setStep("type");
+        }, children: /* @__PURE__ */ jsx(ArrowLeftIcon, {}) }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("h2", { className: "bw-heading", children: selectedType.name }),
+          /* @__PURE__ */ jsxs("div", { className: "bw-meta-row", children: [
+            /* @__PURE__ */ jsxs("span", { className: "bw-badge", children: [
+              /* @__PURE__ */ jsx(ClockIcon, {}),
+              " ",
+              formatDuration(selectedType.duration_minutes)
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "bw-badge", children: [
+              /* @__PURE__ */ jsx(GlobeIcon, {}),
+              " ",
+              shortTz
+            ] })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "bw-datetime-layout", children: [
+        /* @__PURE__ */ jsxs("div", { className: "bw-calendar", children: [
+          /* @__PURE__ */ jsxs("div", { className: "bw-cal-header", children: [
+            /* @__PURE__ */ jsx("button", { className: "bw-cal-nav", onClick: () => goMonth(-1), disabled: !canGoPrev, "aria-label": "Previous month", children: /* @__PURE__ */ jsx(ChevronLeft, {}) }),
+            /* @__PURE__ */ jsxs("span", { className: "bw-cal-title", children: [
+              MONTHS[viewMonth.getMonth()],
+              " ",
+              viewMonth.getFullYear()
+            ] }),
+            /* @__PURE__ */ jsx("button", { className: "bw-cal-nav", onClick: () => goMonth(1), disabled: !canGoNext, "aria-label": "Next month", children: /* @__PURE__ */ jsx(ChevronRight, {}) })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "bw-cal-weekdays", children: DAYS.map((d) => /* @__PURE__ */ jsx("span", { className: "bw-cal-wd", children: d }, d)) }),
+          /* @__PURE__ */ jsx("div", { className: "bw-cal-grid", children: days.map((date, i) => {
+            if (!date) return /* @__PURE__ */ jsx("span", { className: "bw-cal-empty" }, `e-${i}`);
+            const past = isBeforeDay(date, today);
+            const future = date > maxDate;
+            const disabled = past || future;
+            const sel = selectedDate && isSameDay(date, selectedDate);
+            const isToday = isSameDay(date, today);
+            return /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: `bw-cal-day${sel ? " selected" : ""}${isToday ? " today" : ""}${disabled ? " disabled" : ""}`,
+                onClick: () => !disabled && setSelectedDate(date),
+                disabled,
+                "aria-label": date.toLocaleDateString("en-US", { weekday: "long", month: "long", day: "numeric" }),
+                "aria-pressed": sel || void 0,
+                children: date.getDate()
+              },
+              date.toISOString()
+            );
+          }) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: `bw-times${selectedDate ? " visible" : ""}`, ref: slotsRef, children: !selectedDate ? /* @__PURE__ */ jsxs("div", { className: "bw-times-placeholder", children: [
+          /* @__PURE__ */ jsx(CalendarPlusIcon, {}),
+          /* @__PURE__ */ jsx("span", { children: "Select a date to view available times" })
+        ] }) : slotsLoading ? /* @__PURE__ */ jsxs("div", { className: "bw-loading", children: [
+          /* @__PURE__ */ jsx(SpinnerIcon, {}),
+          " Loading times..."
+        ] }) : slots.length === 0 ? /* @__PURE__ */ jsx("div", { className: "bw-times-empty", children: "No available times on this date. Try another day." }) : /* @__PURE__ */ jsxs("div", { className: "bw-times-scroll", children: [
+          /* @__PURE__ */ jsx("p", { className: "bw-times-date", children: selectedDate.toLocaleDateString("en-US", { weekday: "long", month: "short", day: "numeric" }) }),
+          groupedSlots.morning.length > 0 && /* @__PURE__ */ jsxs("div", { className: "bw-time-group", children: [
+            /* @__PURE__ */ jsx("span", { className: "bw-time-label", children: "Morning" }),
+            groupedSlots.morning.map((slot) => /* @__PURE__ */ jsx(TimeButton, { slot, selected: selectedSlot?.start === slot.start, confirmed: confirmedSlot && selectedSlot?.start === slot.start, onClick: () => handleSlotSelect(slot), onConfirm: handleSlotConfirm, timezone, loading }, slot.start))
+          ] }),
+          groupedSlots.afternoon.length > 0 && /* @__PURE__ */ jsxs("div", { className: "bw-time-group", children: [
+            /* @__PURE__ */ jsx("span", { className: "bw-time-label", children: "Afternoon" }),
+            groupedSlots.afternoon.map((slot) => /* @__PURE__ */ jsx(TimeButton, { slot, selected: selectedSlot?.start === slot.start, confirmed: confirmedSlot && selectedSlot?.start === slot.start, onClick: () => handleSlotSelect(slot), onConfirm: handleSlotConfirm, timezone, loading }, slot.start))
+          ] }),
+          groupedSlots.evening.length > 0 && /* @__PURE__ */ jsxs("div", { className: "bw-time-group", children: [
+            /* @__PURE__ */ jsx("span", { className: "bw-time-label", children: "Evening" }),
+            groupedSlots.evening.map((slot) => /* @__PURE__ */ jsx(TimeButton, { slot, selected: selectedSlot?.start === slot.start, confirmed: confirmedSlot && selectedSlot?.start === slot.start, onClick: () => handleSlotSelect(slot), onConfirm: handleSlotConfirm, timezone, loading }, slot.start))
+          ] }),
+          (groupedSlots.afternoon.length > 0 || groupedSlots.evening.length > 0) && /* @__PURE__ */ jsx("p", { className: "bw-times-scroll-hint", children: "Scroll for more times" })
+        ] }) })
+      ] })
+    ] }),
+    step === "form" && selectedType && selectedSlot && /* @__PURE__ */ jsxs("div", { className: "bw-step bw-fade-in", children: [
+      /* @__PURE__ */ jsxs("div", { className: "bw-info-header", children: [
+        /* @__PURE__ */ jsx("button", { className: "bw-back", onClick: () => setStep("datetime"), children: /* @__PURE__ */ jsx(ArrowLeftIcon, {}) }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("h2", { className: "bw-heading", children: "Your Details" }),
+          /* @__PURE__ */ jsxs("div", { className: "bw-meta-row", children: [
+            /* @__PURE__ */ jsxs("span", { className: "bw-badge", children: [
+              /* @__PURE__ */ jsx(ClockIcon, {}),
+              " ",
+              formatDuration(selectedType.duration_minutes)
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "bw-badge-accent", children: [
+              formatDate2(selectedSlot.start, timezone),
+              " \xB7 ",
+              formatTime(selectedSlot.start, timezone)
+            ] })
+          ] })
+        ] })
+      ] }),
+      hold && /* @__PURE__ */ jsxs("div", { className: "bw-hold-notice", children: [
+        /* @__PURE__ */ jsx(SpinnerIcon, {}),
+        " Slot held for you \u2014 complete your details to confirm."
+      ] }),
+      /* @__PURE__ */ jsxs("form", { onSubmit: handleBookingSubmit, className: "bw-form", children: [
+        /* @__PURE__ */ jsxs("div", { className: "bw-field", children: [
+          /* @__PURE__ */ jsxs("label", { htmlFor: "bw-name", children: [
+            "Name ",
+            /* @__PURE__ */ jsx("span", { className: "bw-req", children: "*" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              id: "bw-name",
+              type: "text",
+              required: true,
+              value: guestInfo.name,
+              onChange: (e) => setGuestInfo((p) => ({ ...p, name: e.target.value })),
+              placeholder: "Jane Smith",
+              autoComplete: "name"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "bw-field", children: [
+          /* @__PURE__ */ jsxs("label", { htmlFor: "bw-email", children: [
+            "Email ",
+            /* @__PURE__ */ jsx("span", { className: "bw-req", children: "*" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              id: "bw-email",
+              type: "email",
+              required: true,
+              value: guestInfo.email,
+              onChange: (e) => setGuestInfo((p) => ({ ...p, email: e.target.value })),
+              placeholder: "jane@example.com",
+              autoComplete: "email"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "bw-field", children: [
+          /* @__PURE__ */ jsx("label", { htmlFor: "bw-phone", children: "Phone" }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              id: "bw-phone",
+              type: "tel",
+              value: guestInfo.phone || "",
+              onChange: (e) => setGuestInfo((p) => ({ ...p, phone: e.target.value })),
+              placeholder: "(555) 123-4567",
+              autoComplete: "tel"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "bw-field", children: [
+          /* @__PURE__ */ jsx("label", { htmlFor: "bw-notes", children: "Notes" }),
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              id: "bw-notes",
+              value: guestInfo.notes || "",
+              onChange: (e) => setGuestInfo((p) => ({ ...p, notes: e.target.value })),
+              placeholder: "Anything you'd like us to know...",
+              rows: 3
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("button", { type: "submit", className: "bw-submit", disabled: submitting || !guestInfo.name || !guestInfo.email, children: submitting ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(SpinnerIcon, {}),
+          " Confirming..."
+        ] }) : "Confirm Booking" })
+      ] })
+    ] }),
+    step === "success" && bookingResult && /* @__PURE__ */ jsxs("div", { className: "bw-step bw-fade-in bw-success", children: [
+      /* @__PURE__ */ jsx("div", { className: "bw-success-icon", children: /* @__PURE__ */ jsx(CheckCircleIcon, {}) }),
+      /* @__PURE__ */ jsx("h2", { className: "bw-heading", children: "You\u2019re Booked!" }),
+      /* @__PURE__ */ jsxs("div", { className: "bw-details-card", children: [
+        /* @__PURE__ */ jsxs("div", { className: "bw-detail-row", children: [
+          /* @__PURE__ */ jsx("span", { className: "bw-detail-label", children: "When" }),
+          /* @__PURE__ */ jsxs("span", { className: "bw-detail-value", children: [
+            formatDate2(bookingResult.booking.scheduledAt, timezone),
+            /* @__PURE__ */ jsx("br", {}),
+            formatTime(bookingResult.booking.scheduledAt, timezone),
+            " (",
+            shortTz,
+            ")"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "bw-detail-row", children: [
+          /* @__PURE__ */ jsx("span", { className: "bw-detail-label", children: "Duration" }),
+          /* @__PURE__ */ jsx("span", { className: "bw-detail-value", children: formatDuration(bookingResult.booking.durationMinutes) })
+        ] }),
+        bookingResult.booking.hostName && /* @__PURE__ */ jsxs("div", { className: "bw-detail-row", children: [
+          /* @__PURE__ */ jsx("span", { className: "bw-detail-label", children: "With" }),
+          /* @__PURE__ */ jsx("span", { className: "bw-detail-value", children: bookingResult.booking.hostName })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "bw-cal-links-label", children: "Add to your calendar" }),
+      /* @__PURE__ */ jsxs("div", { className: "bw-cal-links", children: [
+        /* @__PURE__ */ jsxs("a", { href: bookingResult.calendarLinks.google, target: "_blank", rel: "noopener noreferrer", className: "bw-cal-link", children: [
+          /* @__PURE__ */ jsx(CalendarPlusIcon, {}),
+          " Google"
+        ] }),
+        /* @__PURE__ */ jsxs("a", { href: bookingResult.calendarLinks.outlook, target: "_blank", rel: "noopener noreferrer", className: "bw-cal-link", children: [
+          /* @__PURE__ */ jsx(CalendarPlusIcon, {}),
+          " Outlook"
+        ] }),
+        /* @__PURE__ */ jsxs("a", { href: bookingResult.calendarLinks.ics, download: true, className: "bw-cal-link", children: [
+          /* @__PURE__ */ jsx(CalendarPlusIcon, {}),
+          " iCal"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("p", { className: "bw-email-notice", children: [
+        "If your host uses Google Calendar, a calendar invite will be sent to ",
+        /* @__PURE__ */ jsx("strong", { children: guestInfo.email }),
+        "."
+      ] })
+    ] }),
+    loading && step === "datetime" && !selectedType && /* @__PURE__ */ jsxs("div", { className: "bw-loading", children: [
+      /* @__PURE__ */ jsx(SpinnerIcon, {}),
+      " Loading..."
+    ] }),
+    /* @__PURE__ */ jsx("style", { children: WIDGET_CSS })
+  ] });
+}
+function TimeButton({
+  slot,
+  selected,
+  confirmed,
+  onClick,
+  onConfirm,
+  timezone,
+  loading
+}) {
+  if (selected && !confirmed) {
+    return /* @__PURE__ */ jsxs("div", { className: "bw-time-btn-wrap selected", children: [
+      /* @__PURE__ */ jsx("span", { className: "bw-time-text", children: formatTime(slot.start, timezone) }),
+      /* @__PURE__ */ jsx("button", { className: "bw-time-confirm", onClick: onConfirm, disabled: loading, children: loading ? /* @__PURE__ */ jsx(SpinnerIcon, {}) : "Confirm" })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("button", { className: `bw-time-btn${selected ? " selected" : ""}`, onClick, disabled: loading, children: formatTime(slot.start, timezone) });
+}
+var WIDGET_CSS = `
+/* \u2500\u2500 Base \u2500\u2500 */
+.bw-root {
+  font-family: var(--bw-font);
+  color: #1a1a1a;
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  box-sizing: border-box;
+}
+.bw-root *, .bw-root *::before, .bw-root *::after { box-sizing: border-box; }
+
+/* \u2500\u2500 Animation \u2500\u2500 */
+@keyframes bw-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
+@keyframes bw-spin { to { transform: rotate(360deg); } }
+.bw-fade-in { animation: bw-fade-in 0.25s ease-out; }
+.bw-spinner { animation: bw-spin 0.8s linear infinite; }
+
+/* \u2500\u2500 Error \u2500\u2500 */
+.bw-error {
+  display: flex; align-items: center; justify-content: space-between; gap: 12px;
+  background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c;
+  padding: 10px 14px; border-radius: var(--bw-radius); margin-bottom: 16px; font-size: 0.875rem;
+}
+.bw-error button { background: none; border: none; color: inherit; cursor: pointer; font-size: 1.25rem; line-height: 1; padding: 0; }
+
+/* \u2500\u2500 Headings \u2500\u2500 */
+.bw-heading { font-size: 1.125rem; font-weight: 600; margin: 0; letter-spacing: -0.01em; }
+.bw-meta-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
+.bw-badge {
+  display: inline-flex; align-items: center; gap: 4px;
+  font-size: 0.8125rem; color: #6b7280; font-weight: 400;
+}
+.bw-badge-accent {
+  display: inline-flex; align-items: center; gap: 4px;
+  font-size: 0.8125rem; color: var(--bw-primary); font-weight: 500;
+}
+
+/* \u2500\u2500 Info Header \u2500\u2500 */
+.bw-info-header { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 20px; }
+.bw-back {
+  display: inline-flex; align-items: center; justify-content: center;
+  width: 32px; height: 32px; border-radius: 50%; border: 1px solid #e5e7eb;
+  background: #fff; cursor: pointer; color: #4b5563; flex-shrink: 0; margin-top: 1px;
+  transition: all 0.15s;
+}
+.bw-back:hover { background: #f3f4f6; border-color: #d1d5db; }
+
+/* \u2500\u2500 Loading \u2500\u2500 */
+.bw-loading {
+  display: flex; align-items: center; justify-content: center; gap: 8px;
+  padding: 32px; color: #6b7280; font-size: 0.875rem;
+}
+
+/* \u2500\u2500 Type Selection \u2500\u2500 */
+.bw-type-list { display: flex; flex-direction: column; gap: 10px; }
+.bw-type-card {
+  display: flex; flex-direction: column; text-align: left; gap: 4px;
+  padding: 16px; border: 1.5px solid #e5e7eb; border-radius: var(--bw-radius);
+  background: #fff; cursor: pointer; transition: all 0.15s;
+}
+.bw-type-card:hover { border-color: var(--bw-primary); box-shadow: 0 0 0 3px var(--bw-primary-light); }
+.bw-type-name { font-weight: 600; font-size: 0.9375rem; }
+.bw-type-desc { color: #6b7280; font-size: 0.8125rem; }
+.bw-type-meta { display: flex; align-items: center; gap: 4px; font-size: 0.8125rem; color: #9ca3af; margin-top: 4px; }
+
+/* \u2500\u2500 Date-Time Layout \u2500\u2500 */
+.bw-datetime-layout {
+  display: flex; gap: 0; border-top: 1px solid #f0f0f0; padding-top: 16px;
+}
+@media (max-width: 559px) {
+  .bw-datetime-layout { flex-direction: column; }
+}
+@media (min-width: 560px) {
+  .bw-datetime-layout { min-height: 400px; }
+  .bw-calendar { flex: 1 1 auto; padding-right: 16px; border-right: 1px solid #f0f0f0; }
+  .bw-times { width: 180px; flex-shrink: 0; padding-left: 16px; }
+}
+
+/* \u2500\u2500 Calendar \u2500\u2500 */
+.bw-cal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
+.bw-cal-title { font-weight: 600; font-size: 0.9375rem; }
+.bw-cal-nav {
+  display: inline-flex; align-items: center; justify-content: center;
+  width: 32px; height: 32px; border-radius: 50%; border: none;
+  background: transparent; cursor: pointer; color: #374151; transition: background 0.15s;
+}
+.bw-cal-nav:hover:not(:disabled) { background: #f3f4f6; }
+.bw-cal-nav:disabled { opacity: 0.25; cursor: default; }
+
+.bw-cal-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0; text-align: center; margin-bottom: 4px; }
+.bw-cal-wd { font-size: 0.6875rem; font-weight: 600; color: #9ca3af; text-transform: uppercase; letter-spacing: 0.04em; padding: 4px 0; }
+
+.bw-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
+.bw-cal-empty { aspect-ratio: 1; }
+.bw-cal-day {
+  aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
+  border: none; background: none; border-radius: 50%;
+  font-size: 0.8125rem; font-weight: 500; cursor: pointer;
+  color: #1a1a1a; transition: all 0.15s; position: relative;
+}
+.bw-cal-day:hover:not(.disabled):not(.selected) { background: #f3f4f6; }
+.bw-cal-day.today:not(.selected)::after {
+  content: ''; position: absolute; bottom: 3px; left: 50%; transform: translateX(-50%);
+  width: 4px; height: 4px; border-radius: 50%; background: var(--bw-primary);
+}
+.bw-cal-day.selected {
+  background: var(--bw-primary); color: #fff; font-weight: 600;
+}
+.bw-cal-day.disabled { color: #d1d5db; cursor: default; }
+
+/* \u2500\u2500 Time Slots \u2500\u2500 */
+.bw-times { transition: opacity 0.2s; }
+.bw-times:not(.visible) { opacity: 0.5; }
+.bw-times.visible { opacity: 1; }
+.bw-times-placeholder {
+  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
+  height: 100%; min-height: 160px; color: #9ca3af; font-size: 0.8125rem; text-align: center; padding: 16px;
+}
+.bw-times-empty {
+  display: flex; align-items: center; justify-content: center;
+  height: 100%; min-height: 160px; color: #9ca3af; font-size: 0.8125rem; text-align: center; padding: 16px;
+}
+.bw-times-scroll { overflow-y: auto; max-height: 400px; overflow-x: hidden; }
+.bw-times-date { font-weight: 600; font-size: 0.8125rem; color: #374151; margin: 0 0 12px 0; }
+.bw-time-group { margin-bottom: 16px; }
+.bw-times-scroll-hint {
+  font-size: 0.6875rem; color: #9ca3af; text-align: center; margin: 8px 0 0 0; padding-bottom: 8px;
+}
+.bw-time-label { display: block; font-size: 0.6875rem; font-weight: 600; color: #9ca3af; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 6px; }
+
+.bw-time-btn {
+  display: block; width: 100%;
+  padding: 10px 12px; margin-bottom: 6px;
+  border: 1.5px solid #e5e7eb; border-radius: var(--bw-radius);
+  background: #fff; cursor: pointer;
+  font-size: 0.875rem; font-weight: 500; color: var(--bw-primary); text-align: center;
+  transition: all 0.15s;
+}
+.bw-time-btn:hover:not(:disabled) {
+  border-color: var(--bw-primary); background: var(--bw-primary-light);
+}
+.bw-time-btn.selected {
+  border-color: var(--bw-primary); background: var(--bw-primary); color: #fff;
+}
+.bw-time-btn:disabled { opacity: 0.5; cursor: not-allowed; }
+
+.bw-time-btn-wrap {
+  display: flex; align-items: center; gap: 6px; margin-bottom: 6px;
+  border: 1.5px solid var(--bw-primary); border-radius: var(--bw-radius); overflow: hidden;
+  animation: bw-fade-in 0.15s ease-out;
+}
+.bw-time-btn-wrap .bw-time-text {
+  flex: 1; padding: 10px 12px; font-size: 0.875rem; font-weight: 500; color: #374151; text-align: center;
+  background: var(--bw-primary-light);
+}
+.bw-time-confirm {
+  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
+  padding: 10px 16px; border: none;
+  background: var(--bw-primary); color: #fff;
+  font-size: 0.8125rem; font-weight: 600; cursor: pointer;
+  transition: background 0.15s;
+}
+.bw-time-confirm:hover:not(:disabled) { background: var(--bw-primary-hover); }
+.bw-time-confirm:disabled { opacity: 0.7; cursor: not-allowed; }
+
+/* \u2500\u2500 Form \u2500\u2500 */
+.bw-hold-notice {
+  display: flex; align-items: center; gap: 8px;
+  background: var(--bw-primary-light); color: var(--bw-primary);
+  padding: 10px 14px; border-radius: var(--bw-radius);
+  font-size: 0.8125rem; font-weight: 500; margin-bottom: 20px;
+}
+.bw-form { display: flex; flex-direction: column; gap: 16px; }
+.bw-field label {
+  display: block; font-size: 0.8125rem; font-weight: 500; color: #374151; margin-bottom: 4px;
+}
+.bw-req { color: #ef4444; }
+.bw-field input, .bw-field textarea {
+  display: block; width: 100%;
+  padding: 10px 12px; border: 1.5px solid #e5e7eb; border-radius: var(--bw-radius);
+  font-size: 0.9375rem; font-family: inherit; color: #1a1a1a; background: #fff;
+  transition: border-color 0.15s, box-shadow 0.15s;
+}
+.bw-field input::placeholder, .bw-field textarea::placeholder { color: #c0c5cc; }
+.bw-field input:focus, .bw-field textarea:focus {
+  outline: none; border-color: var(--bw-primary);
+  box-shadow: 0 0 0 3px var(--bw-primary-light);
+}
+.bw-submit {
+  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
+  width: 100%; padding: 14px; margin-top: 4px;
+  background: var(--bw-primary); color: #fff; border: none;
+  border-radius: var(--bw-radius); font-size: 0.9375rem; font-weight: 600;
+  cursor: pointer; transition: background 0.15s;
+}
+.bw-submit:hover:not(:disabled) { background: var(--bw-primary-hover); }
+.bw-submit:disabled { opacity: 0.55; cursor: not-allowed; }
+
+/* \u2500\u2500 Success \u2500\u2500 */
+.bw-success { text-align: center; }
+.bw-success-icon { margin: 0 auto 16px; width: 56px; height: 56px; animation: bw-fade-in 0.4s ease-out; }
+.bw-conf-code {
+  display: inline-block; font-family: 'SF Mono', 'Fira Code', monospace;
+  background: #f3f4f6; padding: 6px 14px; border-radius: 6px;
+  font-size: 0.8125rem; color: #6b7280; margin: 4px 0 20px; letter-spacing: 0.04em;
+}
+
+.bw-details-card {
+  text-align: left; background: #f9fafb; border: 1px solid #f0f0f0;
+  border-radius: var(--bw-radius); padding: 16px; margin-bottom: 20px;
+}
+.bw-detail-row { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
+.bw-detail-row:last-child { border-bottom: none; }
+.bw-detail-label { width: 70px; flex-shrink: 0; font-size: 0.8125rem; color: #9ca3af; font-weight: 500; }
+.bw-detail-value { font-size: 0.875rem; font-weight: 500; color: #374151; }
+
+.bw-cal-links-label { font-size: 0.8125rem; color: #6b7280; margin: 0 0 8px 0; }
+.bw-cal-links { display: flex; gap: 8px; justify-content: center; margin-bottom: 20px; flex-wrap: wrap; }
+.bw-cal-link {
+  display: inline-flex; align-items: center; gap: 6px;
+  padding: 8px 14px; border: 1.5px solid #e5e7eb; border-radius: var(--bw-radius);
+  text-decoration: none; color: #374151; font-size: 0.8125rem; font-weight: 500;
+  transition: all 0.15s;
+}
+.bw-cal-link:hover { border-color: var(--bw-primary); color: var(--bw-primary); }
+
+.bw-email-notice { font-size: 0.8125rem; color: #9ca3af; margin: 0; }
+.bw-email-notice strong { color: #374151; font-weight: 500; }
+`;
+
+export { AffiliateCard, AffiliatesWidget, BookingWidget, ExperimentConversion, SetupAssistant, SignalExperiment, SiteKitProvider, createBooking, createSlotHold, detectTimezone, fetchAffiliates, fetchAvailability, fetchAvailableDates, fetchBookingTypeDetails, fetchBookingTypes, formatDate2 as formatBookingDate, formatTime as formatBookingTime, formatDuration, getTrackingUrl, releaseSlotHold, useAffiliates, useExperimentVariant, useSiteKit };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map