@cohiva/support-widget 1.0.0

package/dist/index.js

@@ -0,0 +1,1008 @@
+// src/components/SupportWidget.tsx
+import { useCallback, useEffect as useEffect2, useMemo, useState } from "react";
+
+// src/adapters/centralApi.ts
+function createCentralFeedbackClient(options) {
+  const endpointPath = options.endpointPath || "/api/feedback";
+  const fetchImpl = options.fetchImpl || fetch;
+  return async function submitFeedback(payload) {
+    const token = options.getAuthToken?.();
+    const response = await fetchImpl(`${options.apiBaseUrl}${endpointPath}`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        ...token ? { Authorization: `Bearer ${token}` } : {}
+      },
+      body: JSON.stringify(payload)
+    });
+    const contentType = response.headers.get("content-type") || "";
+    const responseBody = contentType.includes("application/json") ? await response.json() : void 0;
+    if (!response.ok) {
+      const detail = responseBody?.detail || `Request failed with status ${response.status}`;
+      throw new Error(String(detail));
+    }
+    return responseBody || {};
+  };
+}
+
+// src/adapters/githubIssueProxy.ts
+function createGitHubIssueProxyClient(options) {
+  const endpointPath = options.endpointPath || "/api/feedback/github-issue";
+  const fetchImpl = options.fetchImpl || fetch;
+  return async function submitFeedbackAsIssue(payload) {
+    const token = options.getAuthToken?.();
+    const response = await fetchImpl(`${options.apiBaseUrl}${endpointPath}`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        ...token ? { Authorization: `Bearer ${token}` } : {}
+      },
+      body: JSON.stringify(payload)
+    });
+    const contentType = response.headers.get("content-type") || "";
+    const responseBody = contentType.includes("application/json") ? await response.json() : void 0;
+    if (!response.ok) {
+      const detail = responseBody?.detail || `Request failed with status ${response.status}`;
+      throw new Error(String(detail));
+    }
+    return responseBody || {};
+  };
+}
+
+// src/diagnostics/index.ts
+var STORAGE_KEY = "cohiva_feedback_diagnostics_v1";
+var MAX_RECENT_ACTIONS = 20;
+var MAX_CONSOLE_ERRORS = 15;
+var MAX_MESSAGE_LENGTH = 500;
+var DEFAULT_CONFIG = {
+  enabled: true,
+  captureClicks: true,
+  captureFormSubmits: true,
+  captureConsoleWarnings: true,
+  captureConsoleErrors: true,
+  captureUnhandledRejections: true,
+  captureWindowErrors: true,
+  clearPolicy: "on_success"
+};
+var cleanupRef = null;
+function truncate(message) {
+  return message.slice(0, MAX_MESSAGE_LENGTH);
+}
+function readStoredDiagnostics() {
+  if (typeof window === "undefined") {
+    return { recent_actions: [], recent_console_errors: [] };
+  }
+  try {
+    const parsed = JSON.parse(window.sessionStorage.getItem(STORAGE_KEY) || "{}");
+    return {
+      recent_actions: Array.isArray(parsed.recent_actions) ? parsed.recent_actions : [],
+      recent_console_errors: Array.isArray(parsed.recent_console_errors) ? parsed.recent_console_errors : []
+    };
+  } catch {
+    return { recent_actions: [], recent_console_errors: [] };
+  }
+}
+function writeStoredDiagnostics(payload) {
+  if (typeof window === "undefined") {
+    return;
+  }
+  window.sessionStorage.setItem(STORAGE_KEY, JSON.stringify(payload));
+}
+function pushItem(key, entry, config) {
+  const redacted = config.redact ? config.redact(entry) : entry;
+  if (!redacted) {
+    return;
+  }
+  const stored = readStoredDiagnostics();
+  const nextItem = {
+    timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+    type: redacted.type,
+    message: truncate(redacted.message)
+  };
+  if (key === "recent_actions") {
+    stored.recent_actions = [nextItem, ...stored.recent_actions].slice(0, MAX_RECENT_ACTIONS);
+  } else {
+    stored.recent_console_errors = [nextItem, ...stored.recent_console_errors].slice(0, MAX_CONSOLE_ERRORS);
+  }
+  writeStoredDiagnostics(stored);
+}
+function elementLabel(element) {
+  return (element.getAttribute("aria-label") || element.getAttribute("data-testid") || element.getAttribute("name") || element.getAttribute("title") || element.textContent || element.tagName).trim().slice(0, 120);
+}
+function normalizeConfig(config) {
+  return {
+    ...DEFAULT_CONFIG,
+    ...config || {}
+  };
+}
+function installFeedbackDiagnostics(config) {
+  if (typeof window === "undefined") {
+    return () => void 0;
+  }
+  const normalized = normalizeConfig(config);
+  if (!normalized.enabled) {
+    return () => void 0;
+  }
+  if (cleanupRef) {
+    return cleanupRef;
+  }
+  const clickHandler = (event) => {
+    if (!normalized.captureClicks) {
+      return;
+    }
+    const target = event.target;
+    if (!target) {
+      return;
+    }
+    const label = elementLabel(target);
+    const type = target.tagName.toLowerCase();
+    pushItem("recent_actions", { type: "click", message: `Interacted with ${type}: ${label}` }, normalized);
+  };
+  const submitHandler = (event) => {
+    if (!normalized.captureFormSubmits) {
+      return;
+    }
+    const target = event.target;
+    if (!target) {
+      return;
+    }
+    const label = elementLabel(target);
+    pushItem("recent_actions", { type: "submit", message: `Submitted form: ${label}` }, normalized);
+  };
+  const errorHandler = (event) => {
+    if (!normalized.captureWindowErrors) {
+      return;
+    }
+    pushItem("recent_console_errors", {
+      type: "window_error",
+      message: event.message || "Unhandled window error"
+    }, normalized);
+  };
+  const rejectionHandler = (event) => {
+    if (!normalized.captureUnhandledRejections) {
+      return;
+    }
+    pushItem("recent_console_errors", {
+      type: "unhandled_rejection",
+      message: String(event.reason || "Unhandled promise rejection")
+    }, normalized);
+  };
+  const originalConsoleError = console.error;
+  const originalConsoleWarn = console.warn;
+  if (normalized.captureConsoleErrors) {
+    console.error = (...args) => {
+      pushItem("recent_console_errors", { type: "console_error", message: args.map(String).join(" ") }, normalized);
+      originalConsoleError(...args);
+    };
+  }
+  if (normalized.captureConsoleWarnings) {
+    console.warn = (...args) => {
+      pushItem("recent_console_errors", { type: "console_warn", message: args.map(String).join(" ") }, normalized);
+      originalConsoleWarn(...args);
+    };
+  }
+  document.addEventListener("click", clickHandler, true);
+  document.addEventListener("submit", submitHandler, true);
+  window.addEventListener("error", errorHandler);
+  window.addEventListener("unhandledrejection", rejectionHandler);
+  cleanupRef = () => {
+    document.removeEventListener("click", clickHandler, true);
+    document.removeEventListener("submit", submitHandler, true);
+    window.removeEventListener("error", errorHandler);
+    window.removeEventListener("unhandledrejection", rejectionHandler);
+    console.error = originalConsoleError;
+    console.warn = originalConsoleWarn;
+    cleanupRef = null;
+  };
+  return cleanupRef;
+}
+function clearFeedbackDiagnostics() {
+  if (typeof window === "undefined") {
+    return;
+  }
+  window.sessionStorage.removeItem(STORAGE_KEY);
+}
+function recordFeedbackRouteVisit(route) {
+  const pathname = route.pathname || "unknown";
+  const href = route.href || "";
+  const title = route.title || "";
+  pushItem("recent_actions", {
+    type: "route_visit",
+    message: `Visited route ${pathname}${href ? ` (${href})` : ""}${title ? ` - ${title}` : ""}`
+  }, normalizeConfig());
+}
+function getFeedbackDiagnosticsSnapshot(route) {
+  if (typeof window === "undefined") {
+    return {};
+  }
+  const stored = readStoredDiagnostics();
+  const navigatorInfo = window.navigator;
+  const navEntry = performance.getEntriesByType("navigation")[0];
+  const memory = performance.memory;
+  return {
+    page_title: route?.title || document.title,
+    page_url: route?.href || window.location.href,
+    current_route: route?.pathname || window.location.pathname,
+    referrer: document.referrer || void 0,
+    language: navigator.language,
+    languages: Array.from(navigator.languages || []),
+    timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+    submitted_at_client: (/* @__PURE__ */ new Date()).toISOString(),
+    browser_info: navigator.userAgent,
+    online: navigator.onLine,
+    device_pixel_ratio: window.devicePixelRatio,
+    viewport: {
+      width: window.innerWidth,
+      height: window.innerHeight
+    },
+    screen: {
+      width: window.screen?.width,
+      height: window.screen?.height
+    },
+    network_info: navigatorInfo.connection ? {
+      type: navigatorInfo.connection.type,
+      effective_type: navigatorInfo.connection.effectiveType,
+      downlink_mbps: navigatorInfo.connection.downlink,
+      rtt_ms: navigatorInfo.connection.rtt,
+      save_data: navigatorInfo.connection.saveData
+    } : void 0,
+    performance_timing: navEntry ? {
+      page_load_ms: Math.round(navEntry.loadEventEnd - navEntry.startTime),
+      dom_interactive_ms: Math.round(navEntry.domInteractive - navEntry.startTime),
+      dom_content_loaded_ms: Math.round(
+        navEntry.domContentLoadedEventEnd - navEntry.startTime
+      ),
+      ttfb_ms: Math.round(navEntry.responseStart - navEntry.startTime)
+    } : void 0,
+    memory_info: memory ? {
+      used_js_heap_mb: Math.round((memory.usedJSHeapSize || 0) / 1024 / 1024),
+      total_js_heap_mb: Math.round((memory.totalJSHeapSize || 0) / 1024 / 1024),
+      limit_mb: Math.round((memory.jsHeapSizeLimit || 0) / 1024 / 1024)
+    } : void 0,
+    recent_actions: stored.recent_actions,
+    recent_console_errors: stored.recent_console_errors
+  };
+}
+
+// src/hooks/useRouteTracking.ts
+import { useEffect, useRef } from "react";
+function useRouteTracking(getCurrentRoute, enabled) {
+  const previousPathRef = useRef(void 0);
+  useEffect(() => {
+    if (!enabled) {
+      return;
+    }
+    const checkRoute = () => {
+      const route = getCurrentRoute();
+      const currentPath = route.pathname || route.href;
+      if (!currentPath || previousPathRef.current === currentPath) {
+        return;
+      }
+      previousPathRef.current = currentPath;
+      recordFeedbackRouteVisit(route);
+    };
+    checkRoute();
+    const interval = window.setInterval(checkRoute, 1200);
+    return () => window.clearInterval(interval);
+  }, [enabled, getCurrentRoute]);
+}
+
+// src/schema/formSchema.ts
+import { z } from "zod";
+var feedbackFieldLabels = {
+  type: "Feedback Type",
+  title: "Title",
+  priority: "Priority",
+  satisfaction_rating: "Satisfaction Rating",
+  experience_summary: "Experience Summary",
+  what_were_you_doing: "What were you doing?",
+  what_happened: "What happened?",
+  expected_outcome: "Expected outcome",
+  steps_to_reproduce: "Steps to reproduce",
+  desired_solution: "Desired solution",
+  impact_details: "Impact details",
+  additional_context: "Additional context",
+  frequency: "Frequency",
+  impact_level: "Impact level"
+};
+var priorityOptions = [
+  { value: "low", label: "Low" },
+  { value: "medium", label: "Medium" },
+  { value: "high", label: "High" },
+  { value: "critical", label: "Critical" }
+];
+var frequencyOptions = [
+  { value: "once", label: "Once" },
+  { value: "sometimes", label: "Sometimes" },
+  { value: "often", label: "Often" },
+  { value: "every_time", label: "Every time" }
+];
+var impactLevelOptions = [
+  { value: "minor", label: "Minor" },
+  { value: "moderate", label: "Moderate" },
+  { value: "major", label: "Major" },
+  { value: "critical", label: "Critical" }
+];
+var feedbackTypes = [
+  {
+    value: "bug",
+    label: "Bug Report",
+    description: "Something is broken or not working as expected",
+    icon: "bug",
+    fields: [
+      {
+        key: "what_were_you_doing",
+        label: "What were you doing?",
+        placeholder: "Describe what you were trying to do",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "what_happened",
+        label: "What happened?",
+        placeholder: "Describe what actually happened",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "expected_outcome",
+        label: "What did you expect?",
+        placeholder: "Describe expected behavior",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "steps_to_reproduce",
+        label: "Steps to reproduce",
+        placeholder: "List the steps so we can reproduce the issue",
+        inputType: "textarea"
+      },
+      {
+        key: "impact_details",
+        label: "Impact details",
+        placeholder: "How is this affecting your work?",
+        inputType: "textarea"
+      },
+      {
+        key: "additional_context",
+        label: "Additional context",
+        placeholder: "Anything else that may help us debug",
+        inputType: "textarea"
+      }
+    ]
+  },
+  {
+    value: "feature",
+    label: "Feature Request",
+    description: "Request a new capability or enhancement",
+    icon: "sparkles",
+    fields: [
+      {
+        key: "experience_summary",
+        label: "Experience summary",
+        placeholder: "What are you trying to achieve?",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "desired_solution",
+        label: "Desired solution",
+        placeholder: "Describe the capability you want",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "what_were_you_doing",
+        label: "Current workflow",
+        placeholder: "How do you do this today?",
+        inputType: "textarea"
+      },
+      {
+        key: "impact_details",
+        label: "Impact details",
+        placeholder: "How much value would this create?",
+        inputType: "textarea"
+      },
+      {
+        key: "additional_context",
+        label: "Additional context",
+        placeholder: "Any extra context for product/engineering",
+        inputType: "textarea"
+      }
+    ]
+  },
+  {
+    value: "feedback",
+    label: "General Feedback",
+    description: "Share your experience and suggestions",
+    icon: "message",
+    fields: [
+      {
+        key: "experience_summary",
+        label: "Experience summary",
+        placeholder: "What feedback would you like to share?",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "satisfaction_rating",
+        label: "Satisfaction rating",
+        helpText: "Rate your current experience from 1 to 5",
+        inputType: "rating"
+      },
+      {
+        key: "what_were_you_doing",
+        label: "What were you doing?",
+        placeholder: "What context were you in when this came up?",
+        inputType: "textarea"
+      },
+      {
+        key: "what_happened",
+        label: "What happened?",
+        placeholder: "What stood out in your experience?",
+        inputType: "textarea"
+      },
+      {
+        key: "desired_solution",
+        label: "Suggested improvement",
+        placeholder: "How could we improve this?",
+        inputType: "textarea"
+      },
+      {
+        key: "additional_context",
+        label: "Additional context",
+        placeholder: "Anything else to share?",
+        inputType: "textarea"
+      }
+    ]
+  },
+  {
+    value: "improvement",
+    label: "Improvement Idea",
+    description: "Propose a focused improvement to an existing flow",
+    icon: "wrench",
+    fields: [
+      {
+        key: "experience_summary",
+        label: "Experience summary",
+        placeholder: "What part of the experience should improve?",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "desired_solution",
+        label: "Desired solution",
+        placeholder: "Describe your improvement idea",
+        required: true,
+        inputType: "textarea"
+      },
+      {
+        key: "what_were_you_doing",
+        label: "Current behavior",
+        placeholder: "What were you doing when this came up?",
+        inputType: "textarea"
+      },
+      {
+        key: "what_happened",
+        label: "Current pain point",
+        placeholder: "What made this difficult or inefficient?",
+        inputType: "textarea"
+      },
+      {
+        key: "impact_details",
+        label: "Impact details",
+        placeholder: "What is the impact of this issue?",
+        inputType: "textarea"
+      },
+      {
+        key: "additional_context",
+        label: "Additional context",
+        placeholder: "Any additional details",
+        inputType: "textarea"
+      }
+    ]
+  }
+];
+var feedbackTypeValues = z.enum(["bug", "feature", "feedback", "improvement"]);
+var feedbackFormSchema = z.object({
+  type: z.union([feedbackTypeValues, z.literal("")]),
+  title: z.string().max(200),
+  priority: z.enum(["low", "medium", "high", "critical"]),
+  satisfaction_rating: z.number().int().min(1).max(5).nullable(),
+  experience_summary: z.string(),
+  what_were_you_doing: z.string(),
+  what_happened: z.string(),
+  expected_outcome: z.string(),
+  steps_to_reproduce: z.string(),
+  desired_solution: z.string(),
+  impact_details: z.string(),
+  additional_context: z.string(),
+  frequency: z.enum(["", "once", "sometimes", "often", "every_time"]),
+  impact_level: z.enum(["", "minor", "moderate", "major", "critical"])
+});
+var requiredByType = {
+  bug: ["what_were_you_doing", "what_happened", "expected_outcome"],
+  feature: ["experience_summary", "desired_solution"],
+  feedback: ["experience_summary"],
+  improvement: ["experience_summary", "desired_solution"]
+};
+function createEmptyFeedbackForm() {
+  return {
+    type: "",
+    title: "",
+    priority: "medium",
+    satisfaction_rating: null,
+    experience_summary: "",
+    what_were_you_doing: "",
+    what_happened: "",
+    expected_outcome: "",
+    steps_to_reproduce: "",
+    desired_solution: "",
+    impact_details: "",
+    additional_context: "",
+    frequency: "",
+    impact_level: ""
+  };
+}
+function getRequiredFeedbackFields(type) {
+  return requiredByType[type];
+}
+function validateFeedbackForm(formData) {
+  const parse = feedbackFormSchema.safeParse(formData);
+  if (!parse.success) {
+    return {
+      valid: false,
+      title: "Invalid Form Data",
+      description: "Please check your feedback inputs and try again."
+    };
+  }
+  if (!formData.title.trim()) {
+    return {
+      valid: false,
+      title: "Missing Information",
+      description: "Please add a title for this feedback."
+    };
+  }
+  if (!formData.type) {
+    return {
+      valid: false,
+      title: "Missing Type",
+      description: "Please select a feedback type."
+    };
+  }
+  const missingField = getRequiredFeedbackFields(formData.type).find((field) => {
+    const value = formData[field];
+    return typeof value === "string" ? !value.trim() : value == null;
+  });
+  if (missingField) {
+    return {
+      valid: false,
+      title: "Missing Information",
+      description: `Please complete "${feedbackFieldLabels[missingField]}".`
+    };
+  }
+  if (formData.title.trim().length < 5) {
+    return {
+      valid: false,
+      title: "Missing Information",
+      description: "Please add a more descriptive title (minimum 5 characters)."
+    };
+  }
+  return { valid: true };
+}
+function buildExperienceDetailsPayload(formData) {
+  const details = {};
+  const detailKeys = [
+    "experience_summary",
+    "what_were_you_doing",
+    "what_happened",
+    "expected_outcome",
+    "steps_to_reproduce",
+    "desired_solution",
+    "impact_details",
+    "additional_context",
+    "frequency",
+    "impact_level"
+  ];
+  detailKeys.forEach((key) => {
+    const value = formData[key];
+    if (typeof value === "string" && value.trim()) {
+      details[key] = value.trim();
+    }
+  });
+  if (Number.isInteger(formData.satisfaction_rating)) {
+    details.satisfaction_rating = formData.satisfaction_rating;
+  }
+  return details;
+}
+
+// src/schema/descriptionBuilder.ts
+function section(title, lines) {
+  const cleaned = lines.filter((line) => line.trim());
+  if (cleaned.length === 0) {
+    return "";
+  }
+  return [`## ${title}`, ...cleaned].join("\n");
+}
+function formatValue(value) {
+  if (value == null) {
+    return "";
+  }
+  if (Array.isArray(value)) {
+    return value.join(", ");
+  }
+  return String(value).trim();
+}
+function buildFeedbackDescription(formData, diagnostics) {
+  const details = buildExperienceDetailsPayload(formData);
+  const detailLines = Object.entries(details).filter(([key]) => key !== "satisfaction_rating").map(([key, value]) => {
+    const label = feedbackFieldLabels[key] || key;
+    return `- ${label}: ${formatValue(value)}`;
+  });
+  const satisfactionLine = Number.isInteger(details.satisfaction_rating) ? [`- Satisfaction Rating: ${details.satisfaction_rating}/5`] : [];
+  const pageContext = section("Page Context", [
+    diagnostics?.page_title ? `- Page title: ${diagnostics.page_title}` : "",
+    diagnostics?.page_url ? `- Page URL: ${diagnostics.page_url}` : "",
+    diagnostics?.current_route ? `- Current route: ${diagnostics.current_route}` : "",
+    diagnostics?.referrer ? `- Referrer: ${diagnostics.referrer}` : "",
+    diagnostics?.browser_info ? `- Browser info: ${diagnostics.browser_info}` : ""
+  ]);
+  const network = section("Network", [
+    diagnostics?.network_info?.effective_type ? `- Effective type: ${diagnostics.network_info.effective_type}` : "",
+    diagnostics?.network_info?.downlink_mbps ? `- Downlink (Mbps): ${diagnostics.network_info.downlink_mbps}` : "",
+    diagnostics?.network_info?.rtt_ms ? `- RTT (ms): ${diagnostics.network_info.rtt_ms}` : "",
+    diagnostics?.network_info?.save_data != null ? `- Save data: ${diagnostics.network_info.save_data ? "Yes" : "No"}` : ""
+  ]);
+  const performance2 = section("Performance", [
+    diagnostics?.performance_timing?.page_load_ms ? `- Page load (ms): ${diagnostics.performance_timing.page_load_ms}` : "",
+    diagnostics?.performance_timing?.dom_interactive_ms ? `- DOM interactive (ms): ${diagnostics.performance_timing.dom_interactive_ms}` : "",
+    diagnostics?.performance_timing?.dom_content_loaded_ms ? `- DOM content loaded (ms): ${diagnostics.performance_timing.dom_content_loaded_ms}` : "",
+    diagnostics?.performance_timing?.ttfb_ms ? `- TTFB (ms): ${diagnostics.performance_timing.ttfb_ms}` : ""
+  ]);
+  const recentActions = section(
+    "Recent Actions",
+    (diagnostics?.recent_actions || []).map(
+      (item) => `- [${item.timestamp || "unknown"}] ${item.type || "event"}: ${item.message || ""}`
+    )
+  );
+  const recentErrors = section(
+    "Recent Console Errors",
+    (diagnostics?.recent_console_errors || []).map(
+      (item) => `- [${item.timestamp || "unknown"}] ${item.type || "event"}: ${item.message || ""}`
+    )
+  );
+  const blocks = [
+    `# ${formData.title.trim()}`,
+    `Type: ${formData.type}`,
+    section("Experience Details", [...satisfactionLine, ...detailLines]),
+    pageContext,
+    network,
+    performance2,
+    recentActions,
+    recentErrors
+  ].filter(Boolean);
+  return blocks.join("\n\n").slice(0, 1e4);
+}
+
+// src/components/SupportWidget.tsx
+import "./widget-PDWZ5OMY.css";
+
+// src/utils/classNames.ts
+function classNames(...items) {
+  return items.filter(Boolean).join(" ");
+}
+
+// src/components/SupportWidget.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function labelForType(type) {
+  return feedbackTypes.find((item) => item.value === type)?.label || type;
+}
+function getErrorMessage(error) {
+  if (error instanceof Error) {
+    return error.message;
+  }
+  return "Unknown submission error";
+}
+function SupportWidget({ config, isVisible = true, onSuccess, onError, onSubmit }) {
+  const [isOpen, setIsOpen] = useState(false);
+  const [step, setStep] = useState(1);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [isSubmitted, setIsSubmitted] = useState(false);
+  const [announce, setAnnounce] = useState("");
+  const [formData, setFormData] = useState(createEmptyFeedbackForm());
+  const [submitResult, setSubmitResult] = useState(null);
+  const diagnosticsConfig = useMemo(() => config.diagnostics || {}, [config.diagnostics]);
+  const diagnosticsEnabled = diagnosticsConfig.enabled !== false;
+  const submissionConfig = useMemo(() => config.submission || {}, [config.submission]);
+  const defaultSubmit = useMemo(
+    () => {
+      if (submissionConfig.mode === "github_issue_proxy") {
+        return createGitHubIssueProxyClient({
+          apiBaseUrl: config.apiBaseUrl,
+          getAuthToken: config.getAuthToken,
+          endpointPath: submissionConfig.endpointPath
+        });
+      }
+      return createCentralFeedbackClient({
+        apiBaseUrl: config.apiBaseUrl,
+        getAuthToken: config.getAuthToken,
+        endpointPath: submissionConfig.endpointPath
+      });
+    },
+    [config.apiBaseUrl, config.getAuthToken, submissionConfig.endpointPath, submissionConfig.mode]
+  );
+  useEffect2(() => {
+    const cleanup = installFeedbackDiagnostics(diagnosticsConfig);
+    return cleanup;
+  }, [diagnosticsConfig]);
+  useRouteTracking(config.getCurrentRoute, diagnosticsEnabled);
+  function resetState() {
+    setStep(1);
+    setIsSubmitting(false);
+    setIsSubmitted(false);
+    setFormData(createEmptyFeedbackForm());
+    setAnnounce("");
+    setSubmitResult(null);
+  }
+  const handleClose = useCallback(() => {
+    setIsOpen(false);
+    if (diagnosticsConfig.clearPolicy === "on_close") {
+      clearFeedbackDiagnostics();
+    }
+    resetState();
+  }, [diagnosticsConfig.clearPolicy]);
+  useEffect2(() => {
+    if (!isOpen) {
+      return;
+    }
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") {
+        handleClose();
+      }
+    };
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
+  }, [isOpen, handleClose]);
+  function handleTypeSelect(type) {
+    setFormData((previous) => ({ ...previous, type }));
+    setStep(2);
+    setAnnounce(`Selected ${labelForType(type)}.`);
+  }
+  function updateField(key, value) {
+    setFormData((previous) => ({ ...previous, [key]: value }));
+  }
+  async function handleSubmit(event) {
+    event.preventDefault();
+    const validation2 = validateFeedbackForm(formData);
+    if (!validation2.valid) {
+      setAnnounce(`${validation2.title}: ${validation2.description}`);
+      return;
+    }
+    if (!formData.type) {
+      return;
+    }
+    setIsSubmitting(true);
+    const route = config.getCurrentRoute();
+    const diagnostics = diagnosticsEnabled ? getFeedbackDiagnosticsSnapshot(route) : void 0;
+    const payload = {
+      type: formData.type,
+      title: formData.title.trim(),
+      description: buildFeedbackDescription(formData, diagnostics),
+      priority: formData.priority,
+      satisfaction_rating: formData.satisfaction_rating,
+      page_url: diagnostics?.page_url,
+      browser_info: diagnostics?.browser_info,
+      experience_details: buildExperienceDetailsPayload(formData),
+      technical_context: diagnostics,
+      app_name: config.appName,
+      environment: config.environment,
+      repo_slug: config.repoSlug,
+      route_path: route.pathname,
+      context: config.getCurrentUserContext?.(),
+      custom_fields: config.customFields
+    };
+    try {
+      const result = await (onSubmit || defaultSubmit)(payload);
+      setSubmitResult(result);
+      setIsSubmitted(true);
+      setAnnounce("Thank you. Your support ticket was submitted successfully.");
+      if (diagnosticsConfig.clearPolicy !== "manual") {
+        clearFeedbackDiagnostics();
+      }
+      onSuccess?.(result);
+      window.setTimeout(() => {
+        handleClose();
+      }, 2e3);
+    } catch (error) {
+      const message = getErrorMessage(error);
+      setAnnounce(`Submission failed: ${message}`);
+      onError?.(error);
+    } finally {
+      setIsSubmitting(false);
+    }
+  }
+  if (!isVisible) {
+    return null;
+  }
+  const selectedTypeConfig = feedbackTypes.find((item) => item.value === formData.type);
+  const validation = validateFeedbackForm(formData);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { "aria-live": "polite", className: "sw-sr-only", children: announce }),
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        "aria-label": config.theme?.launcherLabel || "Support Ticket",
+        className: classNames("sw-launcher", config.theme?.classNames?.launcher),
+        "data-testid": "feedback-widget-button",
+        onClick: () => setIsOpen(true),
+        type: "button",
+        children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "sw-launcher-icon", children: "?" }),
+          /* @__PURE__ */ jsx("span", { children: config.theme?.launcherLabel || "Support Ticket" })
+        ]
+      }
+    ),
+    isOpen ? /* @__PURE__ */ jsx("div", { className: "sw-overlay", onClick: handleClose, children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "aria-describedby": "support-widget-description",
+        "aria-modal": "true",
+        className: classNames("sw-modal", config.theme?.classNames?.dialog),
+        onClick: (event) => event.stopPropagation(),
+        role: "dialog",
+        children: [
+          /* @__PURE__ */ jsx("button", { "aria-label": "Close", className: "sw-close", onClick: handleClose, type: "button", children: "x" }),
+          /* @__PURE__ */ jsx("p", { className: "sw-sr-only", id: "support-widget-description", children: "Support ticket dialog" }),
+          isSubmitted ? /* @__PURE__ */ jsxs("div", { className: "sw-success", "data-testid": "feedback-success-screen", children: [
+            /* @__PURE__ */ jsx("h2", { children: "Thank You!" }),
+            /* @__PURE__ */ jsx("p", { children: "Your feedback helps us improve the product." }),
+            submitResult?.issue_number || submitResult?.issue_url ? /* @__PURE__ */ jsxs("p", { "data-testid": "feedback-success-issue-link", children: [
+              "GitHub issue created:",
+              submitResult.issue_url ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                " ",
+                /* @__PURE__ */ jsx("a", { href: submitResult.issue_url, rel: "noreferrer", target: "_blank", children: submitResult.issue_number ? `#${submitResult.issue_number}` : "Open issue" })
+              ] }) : ` #${submitResult.issue_number}`
+            ] }) : null
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsxs("header", { className: "sw-header", children: [
+              /* @__PURE__ */ jsx("h2", { children: step === 1 ? "Send Feedback" : selectedTypeConfig?.label || "Support Ticket" }),
+              /* @__PURE__ */ jsx("p", { children: step === 1 ? "What kind of support ticket would you like to submit?" : selectedTypeConfig?.description })
+            ] }),
+            step === 1 ? /* @__PURE__ */ jsx("div", { className: "sw-type-grid", children: feedbackTypes.map((typeConfig) => /* @__PURE__ */ jsxs(
+              "button",
+              {
+                className: "sw-type-card",
+                "data-testid": `feedback-type-${typeConfig.value}`,
+                onClick: () => handleTypeSelect(typeConfig.value),
+                type: "button",
+                children: [
+                  /* @__PURE__ */ jsx("strong", { children: typeConfig.label }),
+                  /* @__PURE__ */ jsx("span", { children: typeConfig.description })
+                ]
+              },
+              typeConfig.value
+            )) }) : /* @__PURE__ */ jsxs("form", { className: "sw-form", onSubmit: handleSubmit, children: [
+              /* @__PURE__ */ jsx("label", { htmlFor: "support-title", children: "Title *" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  id: "support-title",
+                  maxLength: 200,
+                  onChange: (event) => updateField("title", event.target.value),
+                  placeholder: "Short summary of your support ticket",
+                  value: formData.title
+                }
+              ),
+              /* @__PURE__ */ jsxs("section", { className: "sw-section", children: [
+                /* @__PURE__ */ jsx("h3", { children: "Experience details" }),
+                selectedTypeConfig?.fields.map((field) => {
+                  if (field.inputType === "rating") {
+                    return /* @__PURE__ */ jsxs("div", { className: "sw-rating", children: [
+                      /* @__PURE__ */ jsx("label", { children: field.label }),
+                      /* @__PURE__ */ jsx("div", { role: "group", "aria-label": "Satisfaction rating", children: [1, 2, 3, 4, 5].map((value) => /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          "aria-label": `${value} out of 5`,
+                          className: classNames(
+                            "sw-rating-button",
+                            formData.satisfaction_rating && value <= formData.satisfaction_rating ? "is-active" : void 0
+                          ),
+                          onClick: () => updateField("satisfaction_rating", value),
+                          type: "button",
+                          children: "*"
+                        },
+                        value
+                      )) })
+                    ] }, field.key);
+                  }
+                  return /* @__PURE__ */ jsxs("div", { className: "sw-field", children: [
+                    /* @__PURE__ */ jsxs("label", { htmlFor: field.key, children: [
+                      field.label,
+                      field.required ? " *" : ""
+                    ] }),
+                    /* @__PURE__ */ jsx(
+                      "textarea",
+                      {
+                        id: field.key,
+                        onChange: (event) => updateField(field.key, event.target.value),
+                        placeholder: field.placeholder,
+                        rows: 3,
+                        value: String(formData[field.key] || "")
+                      }
+                    )
+                  ] }, field.key);
+                })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "sw-row", children: [
+                /* @__PURE__ */ jsxs("div", { className: "sw-field", children: [
+                  /* @__PURE__ */ jsx("label", { htmlFor: "feedback-frequency", children: "Frequency" }),
+                  /* @__PURE__ */ jsxs(
+                    "select",
+                    {
+                      id: "feedback-frequency",
+                      onChange: (event) => updateField("frequency", event.target.value),
+                      value: formData.frequency,
+                      children: [
+                        /* @__PURE__ */ jsx("option", { value: "", children: "Select frequency" }),
+                        frequencyOptions.map((option) => /* @__PURE__ */ jsx("option", { value: option.value, children: option.label }, option.value))
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "sw-field", children: [
+                  /* @__PURE__ */ jsx("label", { htmlFor: "feedback-impact", children: "Impact" }),
+                  /* @__PURE__ */ jsxs(
+                    "select",
+                    {
+                      id: "feedback-impact",
+                      onChange: (event) => updateField("impact_level", event.target.value),
+                      value: formData.impact_level,
+                      children: [
+                        /* @__PURE__ */ jsx("option", { value: "", children: "Select impact" }),
+                        impactLevelOptions.map((option) => /* @__PURE__ */ jsx("option", { value: option.value, children: option.label }, option.value))
+                      ]
+                    }
+                  )
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "sw-field", children: [
+                /* @__PURE__ */ jsx("label", { htmlFor: "feedback-priority-select", children: "Priority" }),
+                /* @__PURE__ */ jsx(
+                  "select",
+                  {
+                    id: "feedback-priority-select",
+                    onChange: (event) => updateField("priority", event.target.value),
+                    value: formData.priority,
+                    children: priorityOptions.map((option) => /* @__PURE__ */ jsx("option", { value: option.value, children: option.label }, option.value))
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "sw-diagnostics-note", children: "Diagnostics attached: page context, route history, recent errors, and environment metrics." }),
+              !validation.valid ? /* @__PURE__ */ jsx("p", { className: "sw-error", children: validation.description }) : null,
+              /* @__PURE__ */ jsxs("div", { className: "sw-actions", children: [
+                /* @__PURE__ */ jsx("button", { onClick: () => setStep(1), type: "button", children: "Back" }),
+                /* @__PURE__ */ jsx("button", { disabled: isSubmitting || !validation.valid, type: "submit", children: isSubmitting ? "Submitting..." : "Submit" })
+              ] })
+            ] })
+          ] })
+        ]
+      }
+    ) }) : null
+  ] });
+}
+export {
+  SupportWidget,
+  buildExperienceDetailsPayload,
+  buildFeedbackDescription,
+  clearFeedbackDiagnostics,
+  createCentralFeedbackClient,
+  createEmptyFeedbackForm,
+  createGitHubIssueProxyClient,
+  feedbackFieldLabels,
+  feedbackTypes,
+  getFeedbackDiagnosticsSnapshot,
+  getRequiredFeedbackFields,
+  installFeedbackDiagnostics,
+  recordFeedbackRouteVisit,
+  validateFeedbackForm
+};