@rithuu/bugblitz-sdk 1.0.0

package/dist/bugblitz.cjs.js

@@ -0,0 +1,338 @@
+'use strict';
+
+const BugBlitz = {
+  apiKey: null,
+  projectId: null,
+  errors: [],
+  consoleErrors: [],
+  networkErrors: [],
+
+  init(config) {
+    if (!config.apiKey) {
+      console.error("BugBlitz: apiKey is required");
+      return;
+    }
+
+    if (!config.triggerElement) {
+      console.error("BugBlitz: triggerElement is required");
+      return;
+    }
+
+    this.apiKey = config.apiKey;
+
+    console.log("BugBlitz initialized with key:", this.apiKey);
+
+    this.captureErrors();
+    this.interceptNetworkErrors();
+
+    this.attachTrigger(config.triggerElement);
+  },
+
+   attachTrigger(selector) {
+    const element = document.querySelector(selector);
+
+    if (!element) {
+      console.error(`BugBlitz: No element found for selector "${selector}"`);
+      return;
+    }
+
+    element.addEventListener("click", () => {
+      this.openPopup();
+    });
+
+    console.log("BugBlitz: trigger attached to", selector);
+  },
+
+
+  openPopup() {
+    // Prevent multiple popups
+    if (document.getElementById("bugblitz-popup")) return;
+
+    const browserInfo = this.collectBrowserInfo();
+    console.log("BugBlitz: browser info collected", browserInfo);
+
+    // Overlay (dark background)
+    const overlay = document.createElement("div");
+    overlay.id = "bugblitz-overlay";
+    overlay.style.cssText = `
+      position: fixed;
+      top: 0; left: 0;
+      width: 100%; height: 100%;
+      background: rgba(0,0,0,0.5);
+      z-index: 999998;
+    `;
+
+    // Popup box
+    const popup = document.createElement("div");
+    popup.id = "bugblitz-popup";
+    popup.style.cssText = `
+      position: fixed;
+      top: 50%; left: 50%;
+      transform: translate(-50%, -50%);
+      background: white;
+      padding: 24px;
+      border-radius: 12px;
+      z-index: 999999;
+      width: 400px;
+      font-family: sans-serif;
+      box-shadow: 0 4px 24px rgba(0,0,0,0.2);
+    `;
+
+    // Title
+    const title = document.createElement("h3");
+    title.innerText = "Report a Bug 🐛";
+    title.style.cssText = `
+      margin: 0 0 16px 0;
+      font-size: 18px;
+      color: #111;
+    `;
+
+    // Textarea
+    const textarea = document.createElement("textarea");
+    textarea.id = "bugblitz-description";
+    textarea.placeholder = "Describe the bug...";
+    textarea.style.cssText = `
+      width: 100%;
+      height: 120px;
+      padding: 10px;
+      border: 1px solid #ddd;
+      border-radius: 8px;
+      font-size: 14px;
+      resize: none;
+      box-sizing: border-box;
+    `;
+
+    // Submit button
+    const submitBtn = document.createElement("button");
+    submitBtn.innerText = "Submit Report";
+    submitBtn.style.cssText = `
+      margin-top: 12px;
+      width: 100%;
+      padding: 10px;
+      background: #6c47ff;
+      color: white;
+      border: none;
+      border-radius: 8px;
+      font-size: 14px;
+      cursor: pointer;
+    `;
+
+    // Close button
+    const closeBtn = document.createElement("button");
+    closeBtn.innerText = "✕";
+    closeBtn.style.cssText = `
+      position: absolute;
+      top: 12px; right: 16px;
+      background: none;
+      border: none;
+      font-size: 18px;
+      cursor: pointer;
+      color: #888;
+    `;
+
+    // Close logic
+    closeBtn.addEventListener("click", () => this.closePopup());
+    overlay.addEventListener("click", () => this.closePopup());
+
+    // Submit logic 
+    submitBtn.addEventListener("click", async () => {
+      const description = document.getElementById("bugblitz-description").value;
+
+      if (!description.trim()) {
+        alert("Please describe the bug before submitting.");
+        return;
+      }
+
+      submitBtn.innerText = "Capturing screenshot..";
+      submitBtn.disabled = true;
+
+      const screenshot = await this.captureScreenshot();
+
+      submitBtn.innerText = "Sending...";
+
+      // const payload = {
+      //   apiKey: this.apiKey,
+      //   description,
+      //   browserInfo: this.collectBrowserInfo(),
+      //   errors: this.errors,
+      // };
+
+       const formData = new FormData();
+      formData.append("apiKey", this.apiKey);
+      formData.append("description", description);
+      formData.append("browserInfo", JSON.stringify(this.collectBrowserInfo()));
+      formData.append("errors", JSON.stringify(this.consoleErrors));
+      formData.append("networkErrors", JSON.stringify(this.networkErrors));
+      if (screenshot) {
+        formData.append("screenshot", screenshot, "screenshot.png");
+      }
+
+
+      try {
+        const response = await fetch("https://bugblitz-backend.onrender.com/api/bugs", {
+          method: "POST",
+          body: formData,
+        });
+
+        if (!response.ok) {
+          throw new Error("Server error");
+        }
+
+        submitBtn.innerText = "Submitted! ✓";
+        setTimeout(() => this.closePopup(), 1500);
+
+      } catch (err) {
+        console.error("BugBlitz: failed to send report", err);
+        submitBtn.innerText = "Failed. Try again.";
+        submitBtn.disabled = false;
+      }
+    });
+
+    // Assemble popup
+    popup.style.position = "fixed";
+    popup.appendChild(closeBtn);
+    popup.appendChild(title);
+    popup.appendChild(textarea);
+    popup.appendChild(submitBtn);
+
+    document.body.appendChild(overlay);
+    document.body.appendChild(popup);
+  },
+
+  closePopup() {
+    document.getElementById("bugblitz-popup")?.remove();
+    document.getElementById("bugblitz-overlay")?.remove();
+  },
+
+  collectBrowserInfo() {
+    return {
+      userAgent: navigator.userAgent,
+      url: window.location.href,
+      screenWidth: screen.width,
+      screenHeight: screen.height,
+      platform: navigator.platform,
+      timestamp: new Date().toISOString(),
+    };
+  },
+
+  captureErrors() {
+    // Capture JS errors
+    window.onerror = (message, source, line, column, error) => {
+      const entry = {
+        type: "error",
+        message,
+        source,
+        line,
+        column,
+        stack: error?.stack,
+        timestamp: new Date().toISOString(),
+      };
+
+      this.consoleErrors.push(entry);
+      this.errors.push(entry);
+    };
+
+    // Capture unhandled promise rejections
+    window.onunhandledrejection = (event) => {
+      const entry = {
+        type: "unhandledrejection",
+        message: event.reason?.message || String(event.reason),
+        stack: event.reason?.stack,
+        timestamp: new Date().toISOString(),
+      };
+
+      this.consoleErrors.push(entry);
+      this.errors.push(entry);
+    };
+  },
+
+  interceptNetworkErrors() {
+    if (typeof window === "undefined" || typeof window.fetch !== "function") {
+      return;
+    }
+
+    const originalFetch = window.fetch.bind(window);
+
+    window.fetch = async (...args) => {
+      const [resource, init] = args;
+      const url = typeof resource === "string" ? resource : resource?.url || "";
+      const method = init?.method || "GET";
+
+      try {
+        const response = await originalFetch(...args);
+
+        if (!response.ok) {
+          this.networkErrors.push({
+            type: "network",
+            url,
+            method,
+            status: response.status,
+            statusText: response.statusText,
+            timestamp: new Date().toISOString(),
+          });
+        }
+
+        return response;
+      } catch (error) {
+        this.networkErrors.push({
+          type: "network",
+          url,
+          method,
+          status: null,
+          statusText: error?.message || "Network request failed",
+          timestamp: new Date().toISOString(),
+        });
+
+        throw error;
+      }
+    };
+  },
+
+  loadHtml2Canvas() {
+    return new Promise((resolve, reject) => {
+      if (window.html2canvas) {
+        resolve(window.html2canvas);
+        return;
+      }
+
+      const script = document.createElement("script");
+      script.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js";
+
+      script.onload = () => resolve(window.html2canvas);
+      script.onerror = () => reject(new Error("BugBlitz: failed to load html2canvas"));
+
+      document.head.appendChild(script);
+    });
+  },
+
+  async captureScreenshot() {
+    try {
+      const html2canvas = await this.loadHtml2Canvas();
+
+      const popup = document.getElementById("bugblitz-popup");
+      const overlay = document.getElementById("bugblitz-overlay");
+      if (popup) popup.style.display = "none";
+      if (overlay) overlay.style.display = "none";
+
+      const canvas = await html2canvas(document.body);
+
+      if (popup) popup.style.display = "block";
+      if (overlay) overlay.style.display = "block";
+
+      return new Promise((resolve) => {
+        canvas.toBlob((blob) => resolve(blob), "image/png");
+      });
+
+    } catch (err) {
+      console.error("BugBlitz: screenshot failed", err);
+      return null;
+    }
+  },
+  
+};
+
+if (typeof window !== "undefined") {
+  window.BugBlitz = BugBlitz;
+}
+
+module.exports = BugBlitz;

package/dist/bugblitz.esm.js

@@ -0,0 +1,336 @@
+const BugBlitz = {
+  apiKey: null,
+  projectId: null,
+  errors: [],
+  consoleErrors: [],
+  networkErrors: [],
+
+  init(config) {
+    if (!config.apiKey) {
+      console.error("BugBlitz: apiKey is required");
+      return;
+    }
+
+    if (!config.triggerElement) {
+      console.error("BugBlitz: triggerElement is required");
+      return;
+    }
+
+    this.apiKey = config.apiKey;
+
+    console.log("BugBlitz initialized with key:", this.apiKey);
+
+    this.captureErrors();
+    this.interceptNetworkErrors();
+
+    this.attachTrigger(config.triggerElement);
+  },
+
+   attachTrigger(selector) {
+    const element = document.querySelector(selector);
+
+    if (!element) {
+      console.error(`BugBlitz: No element found for selector "${selector}"`);
+      return;
+    }
+
+    element.addEventListener("click", () => {
+      this.openPopup();
+    });
+
+    console.log("BugBlitz: trigger attached to", selector);
+  },
+
+
+  openPopup() {
+    // Prevent multiple popups
+    if (document.getElementById("bugblitz-popup")) return;
+
+    const browserInfo = this.collectBrowserInfo();
+    console.log("BugBlitz: browser info collected", browserInfo);
+
+    // Overlay (dark background)
+    const overlay = document.createElement("div");
+    overlay.id = "bugblitz-overlay";
+    overlay.style.cssText = `
+      position: fixed;
+      top: 0; left: 0;
+      width: 100%; height: 100%;
+      background: rgba(0,0,0,0.5);
+      z-index: 999998;
+    `;
+
+    // Popup box
+    const popup = document.createElement("div");
+    popup.id = "bugblitz-popup";
+    popup.style.cssText = `
+      position: fixed;
+      top: 50%; left: 50%;
+      transform: translate(-50%, -50%);
+      background: white;
+      padding: 24px;
+      border-radius: 12px;
+      z-index: 999999;
+      width: 400px;
+      font-family: sans-serif;
+      box-shadow: 0 4px 24px rgba(0,0,0,0.2);
+    `;
+
+    // Title
+    const title = document.createElement("h3");
+    title.innerText = "Report a Bug 🐛";
+    title.style.cssText = `
+      margin: 0 0 16px 0;
+      font-size: 18px;
+      color: #111;
+    `;
+
+    // Textarea
+    const textarea = document.createElement("textarea");
+    textarea.id = "bugblitz-description";
+    textarea.placeholder = "Describe the bug...";
+    textarea.style.cssText = `
+      width: 100%;
+      height: 120px;
+      padding: 10px;
+      border: 1px solid #ddd;
+      border-radius: 8px;
+      font-size: 14px;
+      resize: none;
+      box-sizing: border-box;
+    `;
+
+    // Submit button
+    const submitBtn = document.createElement("button");
+    submitBtn.innerText = "Submit Report";
+    submitBtn.style.cssText = `
+      margin-top: 12px;
+      width: 100%;
+      padding: 10px;
+      background: #6c47ff;
+      color: white;
+      border: none;
+      border-radius: 8px;
+      font-size: 14px;
+      cursor: pointer;
+    `;
+
+    // Close button
+    const closeBtn = document.createElement("button");
+    closeBtn.innerText = "✕";
+    closeBtn.style.cssText = `
+      position: absolute;
+      top: 12px; right: 16px;
+      background: none;
+      border: none;
+      font-size: 18px;
+      cursor: pointer;
+      color: #888;
+    `;
+
+    // Close logic
+    closeBtn.addEventListener("click", () => this.closePopup());
+    overlay.addEventListener("click", () => this.closePopup());
+
+    // Submit logic 
+    submitBtn.addEventListener("click", async () => {
+      const description = document.getElementById("bugblitz-description").value;
+
+      if (!description.trim()) {
+        alert("Please describe the bug before submitting.");
+        return;
+      }
+
+      submitBtn.innerText = "Capturing screenshot..";
+      submitBtn.disabled = true;
+
+      const screenshot = await this.captureScreenshot();
+
+      submitBtn.innerText = "Sending...";
+
+      // const payload = {
+      //   apiKey: this.apiKey,
+      //   description,
+      //   browserInfo: this.collectBrowserInfo(),
+      //   errors: this.errors,
+      // };
+
+       const formData = new FormData();
+      formData.append("apiKey", this.apiKey);
+      formData.append("description", description);
+      formData.append("browserInfo", JSON.stringify(this.collectBrowserInfo()));
+      formData.append("errors", JSON.stringify(this.consoleErrors));
+      formData.append("networkErrors", JSON.stringify(this.networkErrors));
+      if (screenshot) {
+        formData.append("screenshot", screenshot, "screenshot.png");
+      }
+
+
+      try {
+        const response = await fetch("https://bugblitz-backend.onrender.com/api/bugs", {
+          method: "POST",
+          body: formData,
+        });
+
+        if (!response.ok) {
+          throw new Error("Server error");
+        }
+
+        submitBtn.innerText = "Submitted! ✓";
+        setTimeout(() => this.closePopup(), 1500);
+
+      } catch (err) {
+        console.error("BugBlitz: failed to send report", err);
+        submitBtn.innerText = "Failed. Try again.";
+        submitBtn.disabled = false;
+      }
+    });
+
+    // Assemble popup
+    popup.style.position = "fixed";
+    popup.appendChild(closeBtn);
+    popup.appendChild(title);
+    popup.appendChild(textarea);
+    popup.appendChild(submitBtn);
+
+    document.body.appendChild(overlay);
+    document.body.appendChild(popup);
+  },
+
+  closePopup() {
+    document.getElementById("bugblitz-popup")?.remove();
+    document.getElementById("bugblitz-overlay")?.remove();
+  },
+
+  collectBrowserInfo() {
+    return {
+      userAgent: navigator.userAgent,
+      url: window.location.href,
+      screenWidth: screen.width,
+      screenHeight: screen.height,
+      platform: navigator.platform,
+      timestamp: new Date().toISOString(),
+    };
+  },
+
+  captureErrors() {
+    // Capture JS errors
+    window.onerror = (message, source, line, column, error) => {
+      const entry = {
+        type: "error",
+        message,
+        source,
+        line,
+        column,
+        stack: error?.stack,
+        timestamp: new Date().toISOString(),
+      };
+
+      this.consoleErrors.push(entry);
+      this.errors.push(entry);
+    };
+
+    // Capture unhandled promise rejections
+    window.onunhandledrejection = (event) => {
+      const entry = {
+        type: "unhandledrejection",
+        message: event.reason?.message || String(event.reason),
+        stack: event.reason?.stack,
+        timestamp: new Date().toISOString(),
+      };
+
+      this.consoleErrors.push(entry);
+      this.errors.push(entry);
+    };
+  },
+
+  interceptNetworkErrors() {
+    if (typeof window === "undefined" || typeof window.fetch !== "function") {
+      return;
+    }
+
+    const originalFetch = window.fetch.bind(window);
+
+    window.fetch = async (...args) => {
+      const [resource, init] = args;
+      const url = typeof resource === "string" ? resource : resource?.url || "";
+      const method = init?.method || "GET";
+
+      try {
+        const response = await originalFetch(...args);
+
+        if (!response.ok) {
+          this.networkErrors.push({
+            type: "network",
+            url,
+            method,
+            status: response.status,
+            statusText: response.statusText,
+            timestamp: new Date().toISOString(),
+          });
+        }
+
+        return response;
+      } catch (error) {
+        this.networkErrors.push({
+          type: "network",
+          url,
+          method,
+          status: null,
+          statusText: error?.message || "Network request failed",
+          timestamp: new Date().toISOString(),
+        });
+
+        throw error;
+      }
+    };
+  },
+
+  loadHtml2Canvas() {
+    return new Promise((resolve, reject) => {
+      if (window.html2canvas) {
+        resolve(window.html2canvas);
+        return;
+      }
+
+      const script = document.createElement("script");
+      script.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js";
+
+      script.onload = () => resolve(window.html2canvas);
+      script.onerror = () => reject(new Error("BugBlitz: failed to load html2canvas"));
+
+      document.head.appendChild(script);
+    });
+  },
+
+  async captureScreenshot() {
+    try {
+      const html2canvas = await this.loadHtml2Canvas();
+
+      const popup = document.getElementById("bugblitz-popup");
+      const overlay = document.getElementById("bugblitz-overlay");
+      if (popup) popup.style.display = "none";
+      if (overlay) overlay.style.display = "none";
+
+      const canvas = await html2canvas(document.body);
+
+      if (popup) popup.style.display = "block";
+      if (overlay) overlay.style.display = "block";
+
+      return new Promise((resolve) => {
+        canvas.toBlob((blob) => resolve(blob), "image/png");
+      });
+
+    } catch (err) {
+      console.error("BugBlitz: screenshot failed", err);
+      return null;
+    }
+  },
+  
+};
+
+if (typeof window !== "undefined") {
+  window.BugBlitz = BugBlitz;
+}
+
+export { BugBlitz as default };

package/dist/bugblitz.js

@@ -0,0 +1,341 @@
+var BugBlitz = (function () {
+  'use strict';
+
+  const BugBlitz = {
+    apiKey: null,
+    projectId: null,
+    errors: [],
+    consoleErrors: [],
+    networkErrors: [],
+
+    init(config) {
+      if (!config.apiKey) {
+        console.error("BugBlitz: apiKey is required");
+        return;
+      }
+
+      if (!config.triggerElement) {
+        console.error("BugBlitz: triggerElement is required");
+        return;
+      }
+
+      this.apiKey = config.apiKey;
+
+      console.log("BugBlitz initialized with key:", this.apiKey);
+
+      this.captureErrors();
+      this.interceptNetworkErrors();
+
+      this.attachTrigger(config.triggerElement);
+    },
+
+     attachTrigger(selector) {
+      const element = document.querySelector(selector);
+
+      if (!element) {
+        console.error(`BugBlitz: No element found for selector "${selector}"`);
+        return;
+      }
+
+      element.addEventListener("click", () => {
+        this.openPopup();
+      });
+
+      console.log("BugBlitz: trigger attached to", selector);
+    },
+
+
+    openPopup() {
+      // Prevent multiple popups
+      if (document.getElementById("bugblitz-popup")) return;
+
+      const browserInfo = this.collectBrowserInfo();
+      console.log("BugBlitz: browser info collected", browserInfo);
+
+      // Overlay (dark background)
+      const overlay = document.createElement("div");
+      overlay.id = "bugblitz-overlay";
+      overlay.style.cssText = `
+      position: fixed;
+      top: 0; left: 0;
+      width: 100%; height: 100%;
+      background: rgba(0,0,0,0.5);
+      z-index: 999998;
+    `;
+
+      // Popup box
+      const popup = document.createElement("div");
+      popup.id = "bugblitz-popup";
+      popup.style.cssText = `
+      position: fixed;
+      top: 50%; left: 50%;
+      transform: translate(-50%, -50%);
+      background: white;
+      padding: 24px;
+      border-radius: 12px;
+      z-index: 999999;
+      width: 400px;
+      font-family: sans-serif;
+      box-shadow: 0 4px 24px rgba(0,0,0,0.2);
+    `;
+
+      // Title
+      const title = document.createElement("h3");
+      title.innerText = "Report a Bug 🐛";
+      title.style.cssText = `
+      margin: 0 0 16px 0;
+      font-size: 18px;
+      color: #111;
+    `;
+
+      // Textarea
+      const textarea = document.createElement("textarea");
+      textarea.id = "bugblitz-description";
+      textarea.placeholder = "Describe the bug...";
+      textarea.style.cssText = `
+      width: 100%;
+      height: 120px;
+      padding: 10px;
+      border: 1px solid #ddd;
+      border-radius: 8px;
+      font-size: 14px;
+      resize: none;
+      box-sizing: border-box;
+    `;
+
+      // Submit button
+      const submitBtn = document.createElement("button");
+      submitBtn.innerText = "Submit Report";
+      submitBtn.style.cssText = `
+      margin-top: 12px;
+      width: 100%;
+      padding: 10px;
+      background: #6c47ff;
+      color: white;
+      border: none;
+      border-radius: 8px;
+      font-size: 14px;
+      cursor: pointer;
+    `;
+
+      // Close button
+      const closeBtn = document.createElement("button");
+      closeBtn.innerText = "✕";
+      closeBtn.style.cssText = `
+      position: absolute;
+      top: 12px; right: 16px;
+      background: none;
+      border: none;
+      font-size: 18px;
+      cursor: pointer;
+      color: #888;
+    `;
+
+      // Close logic
+      closeBtn.addEventListener("click", () => this.closePopup());
+      overlay.addEventListener("click", () => this.closePopup());
+
+      // Submit logic 
+      submitBtn.addEventListener("click", async () => {
+        const description = document.getElementById("bugblitz-description").value;
+
+        if (!description.trim()) {
+          alert("Please describe the bug before submitting.");
+          return;
+        }
+
+        submitBtn.innerText = "Capturing screenshot..";
+        submitBtn.disabled = true;
+
+        const screenshot = await this.captureScreenshot();
+
+        submitBtn.innerText = "Sending...";
+
+        // const payload = {
+        //   apiKey: this.apiKey,
+        //   description,
+        //   browserInfo: this.collectBrowserInfo(),
+        //   errors: this.errors,
+        // };
+
+         const formData = new FormData();
+        formData.append("apiKey", this.apiKey);
+        formData.append("description", description);
+        formData.append("browserInfo", JSON.stringify(this.collectBrowserInfo()));
+        formData.append("errors", JSON.stringify(this.consoleErrors));
+        formData.append("networkErrors", JSON.stringify(this.networkErrors));
+        if (screenshot) {
+          formData.append("screenshot", screenshot, "screenshot.png");
+        }
+
+
+        try {
+          const response = await fetch("https://bugblitz-backend.onrender.com/api/bugs", {
+            method: "POST",
+            body: formData,
+          });
+
+          if (!response.ok) {
+            throw new Error("Server error");
+          }
+
+          submitBtn.innerText = "Submitted! ✓";
+          setTimeout(() => this.closePopup(), 1500);
+
+        } catch (err) {
+          console.error("BugBlitz: failed to send report", err);
+          submitBtn.innerText = "Failed. Try again.";
+          submitBtn.disabled = false;
+        }
+      });
+
+      // Assemble popup
+      popup.style.position = "fixed";
+      popup.appendChild(closeBtn);
+      popup.appendChild(title);
+      popup.appendChild(textarea);
+      popup.appendChild(submitBtn);
+
+      document.body.appendChild(overlay);
+      document.body.appendChild(popup);
+    },
+
+    closePopup() {
+      document.getElementById("bugblitz-popup")?.remove();
+      document.getElementById("bugblitz-overlay")?.remove();
+    },
+
+    collectBrowserInfo() {
+      return {
+        userAgent: navigator.userAgent,
+        url: window.location.href,
+        screenWidth: screen.width,
+        screenHeight: screen.height,
+        platform: navigator.platform,
+        timestamp: new Date().toISOString(),
+      };
+    },
+
+    captureErrors() {
+      // Capture JS errors
+      window.onerror = (message, source, line, column, error) => {
+        const entry = {
+          type: "error",
+          message,
+          source,
+          line,
+          column,
+          stack: error?.stack,
+          timestamp: new Date().toISOString(),
+        };
+
+        this.consoleErrors.push(entry);
+        this.errors.push(entry);
+      };
+
+      // Capture unhandled promise rejections
+      window.onunhandledrejection = (event) => {
+        const entry = {
+          type: "unhandledrejection",
+          message: event.reason?.message || String(event.reason),
+          stack: event.reason?.stack,
+          timestamp: new Date().toISOString(),
+        };
+
+        this.consoleErrors.push(entry);
+        this.errors.push(entry);
+      };
+    },
+
+    interceptNetworkErrors() {
+      if (typeof window === "undefined" || typeof window.fetch !== "function") {
+        return;
+      }
+
+      const originalFetch = window.fetch.bind(window);
+
+      window.fetch = async (...args) => {
+        const [resource, init] = args;
+        const url = typeof resource === "string" ? resource : resource?.url || "";
+        const method = init?.method || "GET";
+
+        try {
+          const response = await originalFetch(...args);
+
+          if (!response.ok) {
+            this.networkErrors.push({
+              type: "network",
+              url,
+              method,
+              status: response.status,
+              statusText: response.statusText,
+              timestamp: new Date().toISOString(),
+            });
+          }
+
+          return response;
+        } catch (error) {
+          this.networkErrors.push({
+            type: "network",
+            url,
+            method,
+            status: null,
+            statusText: error?.message || "Network request failed",
+            timestamp: new Date().toISOString(),
+          });
+
+          throw error;
+        }
+      };
+    },
+
+    loadHtml2Canvas() {
+      return new Promise((resolve, reject) => {
+        if (window.html2canvas) {
+          resolve(window.html2canvas);
+          return;
+        }
+
+        const script = document.createElement("script");
+        script.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js";
+
+        script.onload = () => resolve(window.html2canvas);
+        script.onerror = () => reject(new Error("BugBlitz: failed to load html2canvas"));
+
+        document.head.appendChild(script);
+      });
+    },
+
+    async captureScreenshot() {
+      try {
+        const html2canvas = await this.loadHtml2Canvas();
+
+        const popup = document.getElementById("bugblitz-popup");
+        const overlay = document.getElementById("bugblitz-overlay");
+        if (popup) popup.style.display = "none";
+        if (overlay) overlay.style.display = "none";
+
+        const canvas = await html2canvas(document.body);
+
+        if (popup) popup.style.display = "block";
+        if (overlay) overlay.style.display = "block";
+
+        return new Promise((resolve) => {
+          canvas.toBlob((blob) => resolve(blob), "image/png");
+        });
+
+      } catch (err) {
+        console.error("BugBlitz: screenshot failed", err);
+        return null;
+      }
+    },
+    
+  };
+
+  if (typeof window !== "undefined") {
+    window.BugBlitz = BugBlitz;
+  }
+
+  return BugBlitz;
+
+})();

package/package.json

@@ -0,0 +1,29 @@
+
+
+{
+  "name": "@rithuu/bugblitz-sdk",
+  "version": "1.0.0",
+  "description": "Embeddable bug-reporting SDK for any website",
+  "type": "module",
+  "main": "dist/bugblitz.cjs.js",
+  "module": "dist/bugblitz.esm.js",
+  "unpkg": "dist/bugblitz.js",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "rollup -c",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "bug-reporting",
+    "sdk",
+    "feedback",
+    "widget"
+  ],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "rollup": "^4.62.2"
+  }
+}