viewgate-wrapper 1.3.5 → 1.4.0

package/dist/viewgate-wrapper.js

@@ -1,10 +1,10 @@
-(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode('@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap";:root{--vg-primary: #2513ec;--vg-primary-gradient: linear-gradient(135deg, #2513ec 0%, #7e3ff2 100%);--vg-glass: rgba(255, 255, 255, .7);--vg-glass-border: rgba(255, 255, 255, .3);--vg-shadow: 0 8px 32px 0 rgba(31, 38, 135, .37);--vg-radius: 16px}body{font-family:Inter,system-ui,-apple-system,sans-serif!important;margin:0}.vg-glassmorphism{background:var(--vg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--vg-glass-border);box-shadow:var(--vg-shadow);border-radius:var(--vg-radius)}.vg-button-primary{background:var(--vg-primary-gradient);color:#fff;border:none;padding:10px 24px;border-radius:12px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #2513ec4d}.vg-button-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #2513ec66}.vg-button-ghost{background:transparent;color:#444;border:1px solid #ddd;padding:10px 24px;border-radius:12px;cursor:pointer;transition:background .2s}.vg-button-ghost:hover{background:#0000000d}.vg-badge{background:#2513ec1a;color:var(--vg-primary);padding:4px 12px;border-radius:20px;font-size:12px;font-family:JetBrains Mono,monospace;font-weight:700;border:1px solid rgba(37,19,236,.2)}.vg-textarea{width:100%;border:1.5px solid #eee;border-radius:12px;padding:12px;font-family:inherit;color:#0f172a;resize:none;transition:border-color .2s,box-shadow .2s;outline:none}.vg-textarea:focus{border-color:var(--vg-primary);box-shadow:0 0 0 4px #2513ec1a}@keyframes vg-slide-in{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes vg-fade-in{0%{opacity:0}to{opacity:1}}.vg-animate-slide{animation:vg-slide-in .3s cubic-bezier(.16,1,.3,1)}.vg-animate-fade{animation:vg-fade-in .2s ease-out}.vg-toasts{position:fixed;top:24px;right:24px;display:flex;flex-direction:column;gap:12px;z-index:100000}.vg-toast{padding:16px 24px;display:flex;align-items:center;gap:12px;min-width:300px}.vg-toast.success{background:#ecfdf5;border:1px solid #10b981;color:#065f46}.vg-toast.error{background:#fef2f2;border:1px solid #ef4444;color:#991b1b}.vg-cursor-pointer *{cursor:pointer!important}')),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
-import Ae, { createContext as $e, useState as C, useContext as Le, useCallback as oe, useEffect as Fe } from "react";
-var D = { exports: {} }, V = {};
-var ie;
-function Ve() {
-  if (ie) return V;
-  ie = 1;
+(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode('@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap";:root{--vg-primary: #2513ec;--vg-primary-gradient: linear-gradient(135deg, #2513ec 0%, #7e3ff2 100%);--vg-glass: rgba(255, 255, 255, .7);--vg-glass-border: rgba(255, 255, 255, .3);--vg-shadow: 0 8px 32px 0 rgba(31, 38, 135, .37);--vg-radius: 16px}body{font-family:Inter,system-ui,-apple-system,sans-serif!important;margin:0}.vg-glassmorphism{background:var(--vg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--vg-glass-border);box-shadow:var(--vg-shadow);border-radius:var(--vg-radius)}.vg-button-primary{background:var(--vg-primary-gradient);color:#fff;border:none;padding:10px 24px;border-radius:12px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #2513ec4d}.vg-button-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #2513ec66}.vg-button-ghost{background:transparent;color:#444;border:1px solid #ddd;padding:10px 24px;border-radius:12px;cursor:pointer;transition:background .2s}.vg-button-ghost:hover{background:#0000000d}.vg-badge{background:#2513ec1a;color:var(--vg-primary);padding:4px 12px;border-radius:20px;font-size:12px;font-family:JetBrains Mono,monospace;font-weight:700;border:1px solid rgba(37,19,236,.2)}.vg-textarea{width:100%;border:1.5px solid #eee;border-radius:12px;padding:12px;font-family:inherit;color:#0f172a;resize:none;transition:border-color .2s,box-shadow .2s;outline:none}.vg-textarea:focus{border-color:var(--vg-primary);box-shadow:0 0 0 4px #2513ec1a}@keyframes vg-slide-in{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes vg-fade-in{0%{opacity:0}to{opacity:1}}.vg-animate-slide{animation:vg-slide-in .3s cubic-bezier(.16,1,.3,1)}.vg-animate-fade{animation:vg-fade-in .2s ease-out}.vg-toasts{position:fixed;top:24px;right:24px;display:flex;flex-direction:column;gap:12px;z-index:100000}.vg-toast{padding:16px 24px;display:flex;align-items:center;gap:12px;min-width:300px}.vg-toast.success{background:#ecfdf5;border:1px solid #10b981;color:#065f46}.vg-toast.error{background:#fef2f2;border:1px solid #ef4444;color:#991b1b}.vg-cursor-pointer *{cursor:pointer!important}@keyframes vg-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.vg-spinner{border:4px solid rgba(255,255,255,.3);border-top:4px solid white;border-radius:50%;width:40px;height:40px;animation:vg-spin 1s linear infinite;margin-bottom:16px}')),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
+import Ae, { createContext as Le, useState as S, useContext as $e, useCallback as te, useEffect as ue } from "react";
+var Y = { exports: {} }, D = {};
+var de;
+function Fe() {
+  if (de) return D;
+  de = 1;
   var e = /* @__PURE__ */ Symbol.for("react.transitional.element"), t = /* @__PURE__ */ Symbol.for("react.fragment");
   function r(n, a, s) {
     var i = null;
@@ -21,47 +21,47 @@ function Ve() {
       props: s
     };
   }
-  return V.Fragment = t, V.jsx = r, V.jsxs = r, V;
+  return D.Fragment = t, D.jsx = r, D.jsxs = r, D;
 }
-var I = {};
-var ce;
-function Ie() {
-  return ce || (ce = 1, process.env.NODE_ENV !== "production" && (function() {
+var N = {};
+var fe;
+function Ge() {
+  return fe || (fe = 1, process.env.NODE_ENV !== "production" && (function() {
     function e(o) {
       if (o == null) return null;
       if (typeof o == "function")
-        return o.$$typeof === _e ? null : o.displayName || o.name || null;
+        return o.$$typeof === z ? null : o.displayName || o.name || null;
       if (typeof o == "string") return o;
       switch (o) {
-        case T:
+        case O:
           return "Fragment";
-        case L:
+        case H:
           return "Profiler";
-        case $:
+        case k:
           return "StrictMode";
-        case g:
+        case W:
           return "Suspense";
-        case P:
+        case T:
           return "SuspenseList";
-        case ke:
+        case K:
           return "Activity";
       }
       if (typeof o == "object")
         switch (typeof o.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), o.$$typeof) {
-          case G:
+          case M:
             return "Portal";
-          case z:
+          case X:
             return o.displayName || "Context";
-          case N:
+          case F:
             return (o._context.displayName || "Context") + ".Consumer";
-          case b:
+          case Z:
             var f = o.render;
             return o = o.displayName, o || (o = f.displayName || f.name || "", o = o !== "" ? "ForwardRef(" + o + ")" : "ForwardRef"), o;
-          case F:
+          case G:
             return f = o.displayName || null, f !== null ? f : e(o.type) || "Memo";
-          case k:
+          case P:
             f = o._payload, o = o._init;
             try {
               return e(o(f));
@@ -82,17 +82,17 @@ function Ie() {
       }
       if (f) {
         f = console;
-        var p = f.error, w = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
-        return p.call(
+        var x = f.error, y = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
+        return x.call(
           f,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          w
+          y
         ), t(o);
       }
     }
     function n(o) {
-      if (o === T) return "<>";
-      if (typeof o == "object" && o !== null && o.$$typeof === k)
+      if (o === O) return "<>";
+      if (typeof o == "object" && o !== null && o.$$typeof === P)
         return "<...>";
       try {
         var f = e(o);
@@ -102,48 +102,48 @@ function Ie() {
       }
     }
     function a() {
-      var o = Y.A;
+      var o = m.A;
       return o === null ? null : o.getOwner();
     }
     function s() {
       return Error("react-stack-top-frame");
     }
     function i(o) {
-      if (ee.call(o, "key")) {
+      if (h.call(o, "key")) {
         var f = Object.getOwnPropertyDescriptor(o, "key").get;
         if (f && f.isReactWarning) return !1;
       }
       return o.key !== void 0;
     }
     function c(o, f) {
-      function p() {
-        te || (te = !0, console.error(
+      function x() {
+        I || (I = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
           f
         ));
       }
-      p.isReactWarning = !0, Object.defineProperty(o, "key", {
-        get: p,
+      x.isReactWarning = !0, Object.defineProperty(o, "key", {
+        get: x,
         configurable: !0
       });
     }
-    function l() {
+    function u() {
       var o = e(this.type);
-      return re[o] || (re[o] = !0, console.error(
+      return oe[o] || (oe[o] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), o = this.props.ref, o !== void 0 ? o : null;
     }
-    function u(o, f, p, w, M, B) {
-      var y = p.ref;
+    function d(o, f, x, y, U, Q) {
+      var w = x.ref;
       return o = {
-        $$typeof: A,
+        $$typeof: $,
         type: o,
         key: f,
-        props: p,
-        _owner: w
-      }, (y !== void 0 ? y : null) !== null ? Object.defineProperty(o, "ref", {
+        props: x,
+        _owner: y
+      }, (w !== void 0 ? w : null) !== null ? Object.defineProperty(o, "ref", {
         enumerable: !1,
-        get: l
+        get: u
       }) : Object.defineProperty(o, "ref", { enumerable: !1, value: null }), o._store = {}, Object.defineProperty(o._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -158,109 +158,109 @@ function Ie() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: M
+        value: U
       }), Object.defineProperty(o, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: B
+        value: Q
       }), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
     }
-    function m(o, f, p, w, M, B) {
-      var y = f.children;
-      if (y !== void 0)
-        if (w)
-          if (je(y)) {
-            for (w = 0; w < y.length; w++)
-              h(y[w]);
-            Object.freeze && Object.freeze(y);
+    function p(o, f, x, y, U, Q) {
+      var w = f.children;
+      if (w !== void 0)
+        if (y)
+          if (_(w)) {
+            for (y = 0; y < w.length; y++)
+              g(w[y]);
+            Object.freeze && Object.freeze(w);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else h(y);
-      if (ee.call(f, "key")) {
-        y = e(o);
-        var _ = Object.keys(f).filter(function(Oe) {
-          return Oe !== "key";
+        else g(w);
+      if (h.call(f, "key")) {
+        w = e(o);
+        var V = Object.keys(f).filter(function(Ve) {
+          return Ve !== "key";
         });
-        w = 0 < _.length ? "{key: someKey, " + _.join(": ..., ") + ": ...}" : "{key: someKey}", ae[y + w] || (_ = 0 < _.length ? "{" + _.join(": ..., ") + ": ...}" : "{}", console.error(
+        y = 0 < V.length ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}", le[w + y] || (V = 0 < V.length ? "{" + V.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          w,
           y,
-          _,
-          y
-        ), ae[y + w] = !0);
+          w,
+          V,
+          w
+        ), le[w + y] = !0);
       }
-      if (y = null, p !== void 0 && (r(p), y = "" + p), i(f) && (r(f.key), y = "" + f.key), "key" in f) {
-        p = {};
-        for (var J in f)
-          J !== "key" && (p[J] = f[J]);
-      } else p = f;
-      return y && c(
-        p,
+      if (w = null, x !== void 0 && (r(x), w = "" + x), i(f) && (r(f.key), w = "" + f.key), "key" in f) {
+        x = {};
+        for (var ee in f)
+          ee !== "key" && (x[ee] = f[ee]);
+      } else x = f;
+      return w && c(
+        x,
         typeof o == "function" ? o.displayName || o.name || "Unknown" : o
-      ), u(
+      ), d(
         o,
-        y,
-        p,
+        w,
+        x,
         a(),
-        M,
-        B
+        U,
+        Q
       );
     }
-    function h(o) {
-      x(o) ? o._store && (o._store.validated = 1) : typeof o == "object" && o !== null && o.$$typeof === k && (o._payload.status === "fulfilled" ? x(o._payload.value) && o._payload.value._store && (o._payload.value._store.validated = 1) : o._store && (o._store.validated = 1));
+    function g(o) {
+      v(o) ? o._store && (o._store.validated = 1) : typeof o == "object" && o !== null && o.$$typeof === P && (o._payload.status === "fulfilled" ? v(o._payload.value) && o._payload.value._store && (o._payload.value._store.validated = 1) : o._store && (o._store.validated = 1));
     }
-    function x(o) {
-      return typeof o == "object" && o !== null && o.$$typeof === A;
+    function v(o) {
+      return typeof o == "object" && o !== null && o.$$typeof === $;
     }
-    var S = Ae, A = /* @__PURE__ */ Symbol.for("react.transitional.element"), G = /* @__PURE__ */ Symbol.for("react.portal"), T = /* @__PURE__ */ Symbol.for("react.fragment"), $ = /* @__PURE__ */ Symbol.for("react.strict_mode"), L = /* @__PURE__ */ Symbol.for("react.profiler"), N = /* @__PURE__ */ Symbol.for("react.consumer"), z = /* @__PURE__ */ Symbol.for("react.context"), b = /* @__PURE__ */ Symbol.for("react.forward_ref"), g = /* @__PURE__ */ Symbol.for("react.suspense"), P = /* @__PURE__ */ Symbol.for("react.suspense_list"), F = /* @__PURE__ */ Symbol.for("react.memo"), k = /* @__PURE__ */ Symbol.for("react.lazy"), ke = /* @__PURE__ */ Symbol.for("react.activity"), _e = /* @__PURE__ */ Symbol.for("react.client.reference"), Y = S.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, ee = Object.prototype.hasOwnProperty, je = Array.isArray, q = console.createTask ? console.createTask : function() {
+    var C = Ae, $ = /* @__PURE__ */ Symbol.for("react.transitional.element"), M = /* @__PURE__ */ Symbol.for("react.portal"), O = /* @__PURE__ */ Symbol.for("react.fragment"), k = /* @__PURE__ */ Symbol.for("react.strict_mode"), H = /* @__PURE__ */ Symbol.for("react.profiler"), F = /* @__PURE__ */ Symbol.for("react.consumer"), X = /* @__PURE__ */ Symbol.for("react.context"), Z = /* @__PURE__ */ Symbol.for("react.forward_ref"), W = /* @__PURE__ */ Symbol.for("react.suspense"), T = /* @__PURE__ */ Symbol.for("react.suspense_list"), G = /* @__PURE__ */ Symbol.for("react.memo"), P = /* @__PURE__ */ Symbol.for("react.lazy"), K = /* @__PURE__ */ Symbol.for("react.activity"), z = /* @__PURE__ */ Symbol.for("react.client.reference"), m = C.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, h = Object.prototype.hasOwnProperty, _ = Array.isArray, j = console.createTask ? console.createTask : function() {
       return null;
     };
-    S = {
+    C = {
       react_stack_bottom_frame: function(o) {
         return o();
       }
     };
-    var te, re = {}, ne = S.react_stack_bottom_frame.bind(
-      S,
+    var I, oe = {}, ie = C.react_stack_bottom_frame.bind(
+      C,
       s
-    )(), se = q(n(s)), ae = {};
-    I.Fragment = T, I.jsx = function(o, f, p) {
-      var w = 1e4 > Y.recentlyCreatedOwnerStacks++;
-      return m(
+    )(), ce = j(n(s)), le = {};
+    N.Fragment = O, N.jsx = function(o, f, x) {
+      var y = 1e4 > m.recentlyCreatedOwnerStacks++;
+      return p(
         o,
         f,
-        p,
+        x,
         !1,
-        w ? Error("react-stack-top-frame") : ne,
-        w ? q(n(o)) : se
+        y ? Error("react-stack-top-frame") : ie,
+        y ? j(n(o)) : ce
       );
-    }, I.jsxs = function(o, f, p) {
-      var w = 1e4 > Y.recentlyCreatedOwnerStacks++;
-      return m(
+    }, N.jsxs = function(o, f, x) {
+      var y = 1e4 > m.recentlyCreatedOwnerStacks++;
+      return p(
         o,
         f,
-        p,
+        x,
         !0,
-        w ? Error("react-stack-top-frame") : ne,
-        w ? q(n(o)) : se
+        y ? Error("react-stack-top-frame") : ie,
+        y ? j(n(o)) : ce
       );
     };
-  })()), I;
+  })()), N;
 }
-var le;
-function Ge() {
-  return le || (le = 1, process.env.NODE_ENV === "production" ? D.exports = Ve() : D.exports = Ie()), D.exports;
+var me;
+function Ie() {
+  return me || (me = 1, process.env.NODE_ENV === "production" ? Y.exports = Fe() : Y.exports = Ge()), Y.exports;
 }
-var d = Ge();
-const Me = {
+var l = Ie();
+const De = {
   en: {
     enterMode: "🚀 Enter Feedback Mode",
     exitMode: "✨ Exit Mode",
@@ -275,7 +275,14 @@ const Me = {
     error: "Failed to submit feedback. Check backend connection.",
     successHeader: "Success",
     errorHeader: "Error",
-    preview: "Preview"
+    preview: "Preview",
+    viewComments: "👀 View Comments",
+    close: "Close",
+    observe: "Observe",
+    pending: "Pending",
+    readyForReview: "Ready for Review",
+    noComments: "No comments found.",
+    deleteConfirm: "Are you sure you want to close/delete this comment?"
   },
   es: {
     enterMode: "🚀 Activar Modo Comentarios",
@@ -291,32 +298,39 @@ const Me = {
     error: "Error al enviar comentarios. Revisa la conexión con el servidor.",
     successHeader: "Éxito",
     errorHeader: "Error",
-    preview: "Vista previa"
+    preview: "Vista previa",
+    viewComments: "👀 Ver Comentarios",
+    close: "Cerrar",
+    observe: "Observar",
+    pending: "Pendiente",
+    readyForReview: "Lista para revisión",
+    noComments: "No hay comentarios.",
+    deleteConfirm: "¿Estás seguro de que deseas cerrar y eliminar este comentario?"
   }
-}, we = $e(void 0), De = () => {
-  const e = Le(we);
+}, be = Le(void 0), Ne = () => {
+  const e = $e(be);
   if (!e) throw new Error("useViewGate must be used within a ViewGateProvider");
   return e;
-}, Gt = ({ children: e, language: t = "es", apiKey: r, baseUrl: n = "https://view-gate.vercel.app" }) => {
-  const [a, s] = C([]), i = (l, u) => {
-    const m = Date.now();
-    s((h) => [...h, { id: m, message: l, type: u }]), setTimeout(() => {
-      s((h) => h.filter((x) => x.id !== m));
+}, It = ({ children: e, language: t = "es", apiKey: r, baseUrl: n = "https://view-gate.vercel.app" }) => {
+  const [a, s] = S([]), i = (u, d) => {
+    const p = Date.now();
+    s((g) => [...g, { id: p, message: u, type: d }]), setTimeout(() => {
+      s((g) => g.filter((v) => v.id !== p));
     }, 4e3);
-  }, c = Me[t];
-  return /* @__PURE__ */ d.jsxs(we.Provider, { "data-source-path": "/src/components/ViewGateProvider.tsx:99", value: { addToast: i, language: t, t: c, apiKey: r, baseUrl: n }, children: [
+  }, c = De[t];
+  return /* @__PURE__ */ l.jsxs(be.Provider, { "data-source-path": "/src/components/ViewGateProvider.tsx:113", value: { addToast: i, language: t, t: c, apiKey: r, baseUrl: n }, children: [
     e,
-    /* @__PURE__ */ d.jsx(Vt, { "data-source-path": "/src/components/ViewGateProvider.tsx:101" }),
-    /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateProvider.tsx:102", className: "vg-toasts", children: a.map((l) => /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateProvider.tsx:104", className: `vg-toast vg-glassmorphism vg-animate-slide ${l.type}`, children: [
-      /* @__PURE__ */ d.jsx("span", { "data-source-path": "/src/components/ViewGateProvider.tsx:105", style: { fontSize: "20px" }, children: l.type === "success" ? "✅" : "❌" }),
-      /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateProvider.tsx:106", children: [
-        /* @__PURE__ */ d.jsx("strong", { "data-source-path": "/src/components/ViewGateProvider.tsx:107", style: { display: "block" }, children: l.type === "success" ? c.successHeader : c.errorHeader }),
-        /* @__PURE__ */ d.jsx("span", { "data-source-path": "/src/components/ViewGateProvider.tsx:108", style: { fontSize: "14px" }, children: l.message })
+    /* @__PURE__ */ l.jsx(Ft, { "data-source-path": "/src/components/ViewGateProvider.tsx:115" }),
+    /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateProvider.tsx:116", className: "vg-toasts", children: a.map((u) => /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateProvider.tsx:118", className: `vg-toast vg-glassmorphism vg-animate-slide ${u.type}`, children: [
+      /* @__PURE__ */ l.jsx("span", { "data-source-path": "/src/components/ViewGateProvider.tsx:119", style: { fontSize: "20px" }, children: u.type === "success" ? "✅" : "❌" }),
+      /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateProvider.tsx:120", children: [
+        /* @__PURE__ */ l.jsx("strong", { "data-source-path": "/src/components/ViewGateProvider.tsx:121", style: { display: "block" }, children: u.type === "success" ? c.successHeader : c.errorHeader }),
+        /* @__PURE__ */ l.jsx("span", { "data-source-path": "/src/components/ViewGateProvider.tsx:122", style: { fontSize: "14px" }, children: u.message })
       ] })
-    ] }, l.id)) })
+    ] }, u.id)) })
   ] });
 };
-function He(e, t) {
+function Me(e, t) {
   if (e.match(/^[a-z]+:\/\//i))
     return e;
   if (e.match(/^\/\//))
@@ -326,7 +340,7 @@ function He(e, t) {
   const r = document.implementation.createHTMLDocument(), n = r.createElement("base"), a = r.createElement("a");
   return r.head.appendChild(n), r.body.appendChild(a), t && (n.href = t), a.href = e, a.href;
 }
-const We = /* @__PURE__ */ (() => {
+const He = /* @__PURE__ */ (() => {
   let e = 0;
   const t = () => (
     // eslint-disable-next-line no-bitwise
@@ -340,27 +354,27 @@ function R(e) {
     t.push(e[r]);
   return t;
 }
-let j = null;
-function ye(e = {}) {
-  return j || (e.includeStyleProperties ? (j = e.includeStyleProperties, j) : (j = R(window.getComputedStyle(document.documentElement)), j));
+let A = null;
+function Ee(e = {}) {
+  return A || (e.includeStyleProperties ? (A = e.includeStyleProperties, A) : (A = R(window.getComputedStyle(document.documentElement)), A));
 }
-function H(e, t) {
+function q(e, t) {
   const n = (e.ownerDocument.defaultView || window).getComputedStyle(e).getPropertyValue(t);
   return n ? parseFloat(n.replace("px", "")) : 0;
 }
-function Ue(e) {
-  const t = H(e, "border-left-width"), r = H(e, "border-right-width");
+function We(e) {
+  const t = q(e, "border-left-width"), r = q(e, "border-right-width");
   return e.clientWidth + t + r;
 }
-function Ne(e) {
-  const t = H(e, "border-top-width"), r = H(e, "border-bottom-width");
+function ze(e) {
+  const t = q(e, "border-top-width"), r = q(e, "border-bottom-width");
   return e.clientHeight + t + r;
 }
-function xe(e, t = {}) {
-  const r = t.width || Ue(e), n = t.height || Ne(e);
+function Se(e, t = {}) {
+  const r = t.width || We(e), n = t.height || ze(e);
   return { width: r, height: n };
 }
-function ze() {
+function Ue() {
   let e, t;
   try {
     t = process;
@@ -373,7 +387,7 @@ const E = 16384;
 function Ye(e) {
   (e.width > E || e.height > E) && (e.width > E && e.height > E ? e.width > e.height ? (e.height *= E / e.width, e.width = E) : (e.width *= E / e.height, e.height = E) : e.width > E ? (e.height *= E / e.width, e.width = E) : (e.width *= E / e.height, e.height = E));
 }
-function W(e) {
+function B(e) {
   return new Promise((t, r) => {
     const n = new Image();
     n.onload = () => {
@@ -390,18 +404,18 @@ async function Be(e, t, r) {
   const n = "http://www.w3.org/2000/svg", a = document.createElementNS(n, "svg"), s = document.createElementNS(n, "foreignObject");
   return a.setAttribute("width", `${t}`), a.setAttribute("height", `${r}`), a.setAttribute("viewBox", `0 0 ${t} ${r}`), s.setAttribute("width", "100%"), s.setAttribute("height", "100%"), s.setAttribute("x", "0"), s.setAttribute("y", "0"), s.setAttribute("externalResourcesRequired", "true"), a.appendChild(s), s.appendChild(e), qe(a);
 }
-const v = (e, t) => {
+const b = (e, t) => {
   if (e instanceof t)
     return !0;
   const r = Object.getPrototypeOf(e);
-  return r === null ? !1 : r.constructor.name === t.name || v(r, t);
+  return r === null ? !1 : r.constructor.name === t.name || b(r, t);
 };
 function Je(e) {
   const t = e.getPropertyValue("content");
   return `${e.cssText} content: '${t.replace(/'|"/g, "")}';`;
 }
 function Xe(e, t) {
-  return ye(t).map((r) => {
+  return Ee(t).map((r) => {
     const n = e.getPropertyValue(r), a = e.getPropertyPriority(r);
     return `${r}: ${n}${a ? " !important" : ""};`;
   }).join(" ");
@@ -410,11 +424,11 @@ function Ze(e, t, r, n) {
   const a = `.${e}:${t}`, s = r.cssText ? Je(r) : Xe(r, n);
   return document.createTextNode(`${a}{${s}}`);
 }
-function ue(e, t, r, n) {
+function pe(e, t, r, n) {
   const a = window.getComputedStyle(e, r), s = a.getPropertyValue("content");
   if (s === "" || s === "none")
     return;
-  const i = We();
+  const i = He();
   try {
     t.className = `${t.className} ${i}`;
   } catch {
@@ -424,16 +438,16 @@ function ue(e, t, r, n) {
   c.appendChild(Ze(i, r, a, n)), t.appendChild(c);
 }
 function Ke(e, t, r) {
-  ue(e, t, ":before", r), ue(e, t, ":after", r);
+  pe(e, t, ":before", r), pe(e, t, ":after", r);
 }
-const fe = "application/font-woff", de = "image/jpeg", Qe = {
-  woff: fe,
-  woff2: fe,
+const he = "application/font-woff", ge = "image/jpeg", Qe = {
+  woff: he,
+  woff2: he,
   ttf: "application/font-truetype",
   eot: "application/vnd.ms-fontobject",
   png: "image/png",
-  jpg: de,
-  jpeg: de,
+  jpg: ge,
+  jpeg: ge,
   gif: "image/gif",
   tiff: "image/tiff",
   svg: "image/svg+xml",
@@ -443,20 +457,20 @@ function et(e) {
   const t = /\.([^./]*?)$/g.exec(e);
   return t ? t[1] : "";
 }
-function K(e) {
+function se(e) {
   const t = et(e).toLowerCase();
   return Qe[t] || "";
 }
 function tt(e) {
   return e.split(/,/)[1];
 }
-function Z(e) {
+function ne(e) {
   return e.search(/^(data:)/) !== -1;
 }
 function rt(e, t) {
   return `data:${t};base64,${e}`;
 }
-async function be(e, t, r) {
+async function Ce(e, t, r) {
   const n = await fetch(e, t);
   if (n.status === 404)
     throw new Error(`Resource "${n.url}" not found`);
@@ -466,67 +480,67 @@ async function be(e, t, r) {
     c.onerror = i, c.onloadend = () => {
       try {
         s(r({ res: n, result: c.result }));
-      } catch (l) {
-        i(l);
+      } catch (u) {
+        i(u);
       }
     }, c.readAsDataURL(a);
   });
 }
-const X = {};
+const re = {};
 function nt(e, t, r) {
   let n = e.replace(/\?.*/, "");
   return r && (n = e), /ttf|otf|eot|woff2?/i.test(n) && (n = n.replace(/.*\//, "")), t ? `[${t}]${n}` : n;
 }
-async function Q(e, t, r) {
+async function ae(e, t, r) {
   const n = nt(e, t, r.includeQueryParams);
-  if (X[n] != null)
-    return X[n];
+  if (re[n] != null)
+    return re[n];
   r.cacheBust && (e += (/\?/.test(e) ? "&" : "?") + (/* @__PURE__ */ new Date()).getTime());
   let a;
   try {
-    const s = await be(e, r.fetchRequestInit, ({ res: i, result: c }) => (t || (t = i.headers.get("Content-Type") || ""), tt(c)));
+    const s = await Ce(e, r.fetchRequestInit, ({ res: i, result: c }) => (t || (t = i.headers.get("Content-Type") || ""), tt(c)));
     a = rt(s, t);
   } catch (s) {
     a = r.imagePlaceholder || "";
     let i = `Failed to fetch resource: ${e}`;
     s && (i = typeof s == "string" ? s : s.message), i && console.warn(i);
   }
-  return X[n] = a, a;
+  return re[n] = a, a;
 }
 async function st(e) {
   const t = e.toDataURL();
-  return t === "data:," ? e.cloneNode(!1) : W(t);
+  return t === "data:," ? e.cloneNode(!1) : B(t);
 }
 async function at(e, t) {
   if (e.currentSrc) {
     const s = document.createElement("canvas"), i = s.getContext("2d");
     s.width = e.clientWidth, s.height = e.clientHeight, i?.drawImage(e, 0, 0, s.width, s.height);
     const c = s.toDataURL();
-    return W(c);
+    return B(c);
   }
-  const r = e.poster, n = K(r), a = await Q(r, n, t);
-  return W(a);
+  const r = e.poster, n = se(r), a = await ae(r, n, t);
+  return B(a);
 }
 async function ot(e, t) {
   var r;
   try {
     if (!((r = e?.contentDocument) === null || r === void 0) && r.body)
-      return await U(e.contentDocument.body, t, !0);
+      return await J(e.contentDocument.body, t, !0);
   } catch {
   }
   return e.cloneNode(!1);
 }
 async function it(e, t) {
-  return v(e, HTMLCanvasElement) ? st(e) : v(e, HTMLVideoElement) ? at(e, t) : v(e, HTMLIFrameElement) ? ot(e, t) : e.cloneNode(ve(e));
+  return b(e, HTMLCanvasElement) ? st(e) : b(e, HTMLVideoElement) ? at(e, t) : b(e, HTMLIFrameElement) ? ot(e, t) : e.cloneNode(Re(e));
 }
-const ct = (e) => e.tagName != null && e.tagName.toUpperCase() === "SLOT", ve = (e) => e.tagName != null && e.tagName.toUpperCase() === "SVG";
+const ct = (e) => e.tagName != null && e.tagName.toUpperCase() === "SLOT", Re = (e) => e.tagName != null && e.tagName.toUpperCase() === "SVG";
 async function lt(e, t, r) {
   var n, a;
-  if (ve(t))
+  if (Re(t))
     return t;
   let s = [];
-  return ct(e) && e.assignedNodes ? s = R(e.assignedNodes()) : v(e, HTMLIFrameElement) && (!((n = e.contentDocument) === null || n === void 0) && n.body) ? s = R(e.contentDocument.body.childNodes) : s = R(((a = e.shadowRoot) !== null && a !== void 0 ? a : e).childNodes), s.length === 0 || v(e, HTMLVideoElement) || await s.reduce((i, c) => i.then(() => U(c, r)).then((l) => {
-    l && t.appendChild(l);
+  return ct(e) && e.assignedNodes ? s = R(e.assignedNodes()) : b(e, HTMLIFrameElement) && (!((n = e.contentDocument) === null || n === void 0) && n.body) ? s = R(e.contentDocument.body.childNodes) : s = R(((a = e.shadowRoot) !== null && a !== void 0 ? a : e).childNodes), s.length === 0 || b(e, HTMLVideoElement) || await s.reduce((i, c) => i.then(() => J(c, r)).then((u) => {
+    u && t.appendChild(u);
   }), Promise.resolve()), t;
 }
 function ut(e, t, r) {
@@ -534,24 +548,24 @@ function ut(e, t, r) {
   if (!n)
     return;
   const a = window.getComputedStyle(e);
-  a.cssText ? (n.cssText = a.cssText, n.transformOrigin = a.transformOrigin) : ye(r).forEach((s) => {
+  a.cssText ? (n.cssText = a.cssText, n.transformOrigin = a.transformOrigin) : Ee(r).forEach((s) => {
     let i = a.getPropertyValue(s);
-    s === "font-size" && i.endsWith("px") && (i = `${Math.floor(parseFloat(i.substring(0, i.length - 2))) - 0.1}px`), v(e, HTMLIFrameElement) && s === "display" && i === "inline" && (i = "block"), s === "d" && t.getAttribute("d") && (i = `path(${t.getAttribute("d")})`), n.setProperty(s, i, a.getPropertyPriority(s));
+    s === "font-size" && i.endsWith("px") && (i = `${Math.floor(parseFloat(i.substring(0, i.length - 2))) - 0.1}px`), b(e, HTMLIFrameElement) && s === "display" && i === "inline" && (i = "block"), s === "d" && t.getAttribute("d") && (i = `path(${t.getAttribute("d")})`), n.setProperty(s, i, a.getPropertyPriority(s));
   });
 }
-function ft(e, t) {
-  v(e, HTMLTextAreaElement) && (t.innerHTML = e.value), v(e, HTMLInputElement) && t.setAttribute("value", e.value);
-}
 function dt(e, t) {
-  if (v(e, HTMLSelectElement)) {
+  b(e, HTMLTextAreaElement) && (t.innerHTML = e.value), b(e, HTMLInputElement) && t.setAttribute("value", e.value);
+}
+function ft(e, t) {
+  if (b(e, HTMLSelectElement)) {
     const n = Array.from(t.children).find((a) => e.value === a.getAttribute("value"));
     n && n.setAttribute("selected", "");
   }
 }
 function mt(e, t, r) {
-  return v(t, Element) && (ut(e, t, r), Ke(e, t, r), ft(e, t), dt(e, t)), t;
+  return b(t, Element) && (ut(e, t, r), Ke(e, t, r), dt(e, t), ft(e, t)), t;
 }
-async function ht(e, t) {
+async function pt(e, t) {
   const r = e.querySelectorAll ? e.querySelectorAll("use") : [];
   if (r.length === 0)
     return e;
@@ -559,8 +573,8 @@ async function ht(e, t) {
   for (let s = 0; s < r.length; s++) {
     const c = r[s].getAttribute("xlink:href");
     if (c) {
-      const l = e.querySelector(c), u = document.querySelector(c);
-      !l && u && !n[c] && (n[c] = await U(u, t, !0));
+      const u = e.querySelector(c), d = document.querySelector(c);
+      !u && d && !n[c] && (n[c] = await J(d, t, !0));
     }
   }
   const a = Object.values(n);
@@ -569,37 +583,37 @@ async function ht(e, t) {
     i.setAttribute("xmlns", s), i.style.position = "absolute", i.style.width = "0", i.style.height = "0", i.style.overflow = "hidden", i.style.display = "none";
     const c = document.createElementNS(s, "defs");
     i.appendChild(c);
-    for (let l = 0; l < a.length; l++)
-      c.appendChild(a[l]);
+    for (let u = 0; u < a.length; u++)
+      c.appendChild(a[u]);
     e.appendChild(i);
   }
   return e;
 }
-async function U(e, t, r) {
-  return !r && t.filter && !t.filter(e) ? null : Promise.resolve(e).then((n) => it(n, t)).then((n) => lt(e, n, t)).then((n) => mt(e, n, t)).then((n) => ht(n, t));
+async function J(e, t, r) {
+  return !r && t.filter && !t.filter(e) ? null : Promise.resolve(e).then((n) => it(n, t)).then((n) => lt(e, n, t)).then((n) => mt(e, n, t)).then((n) => pt(n, t));
 }
-const Ee = /url\((['"]?)([^'"]+?)\1\)/g, pt = /url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g, gt = /src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;
-function wt(e) {
+const ke = /url\((['"]?)([^'"]+?)\1\)/g, ht = /url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g, gt = /src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;
+function xt(e) {
   const t = e.replace(/([.*+?^${}()|\[\]\/\\])/g, "\\$1");
   return new RegExp(`(url\\(['"]?)(${t})(['"]?\\))`, "g");
 }
 function yt(e) {
   const t = [];
-  return e.replace(Ee, (r, n, a) => (t.push(a), r)), t.filter((r) => !Z(r));
+  return e.replace(ke, (r, n, a) => (t.push(a), r)), t.filter((r) => !ne(r));
 }
-async function xt(e, t, r, n, a) {
+async function wt(e, t, r, n, a) {
   try {
-    const s = r ? He(t, r) : t, i = K(t);
+    const s = r ? Me(t, r) : t, i = se(t);
     let c;
-    return a || (c = await Q(s, i, n)), e.replace(wt(t), `$1${c}$3`);
+    return a || (c = await ae(s, i, n)), e.replace(xt(t), `$1${c}$3`);
   } catch {
   }
   return e;
 }
-function bt(e, { preferredFontFormat: t }) {
+function vt(e, { preferredFontFormat: t }) {
   return t ? e.replace(gt, (r) => {
     for (; ; ) {
-      const [n, , a] = pt.exec(r) || [];
+      const [n, , a] = ht.exec(r) || [];
       if (!a)
         return "";
       if (a === t)
@@ -607,38 +621,38 @@ function bt(e, { preferredFontFormat: t }) {
     }
   }) : e;
 }
-function Se(e) {
-  return e.search(Ee) !== -1;
+function Te(e) {
+  return e.search(ke) !== -1;
 }
-async function Re(e, t, r) {
-  if (!Se(e))
+async function Pe(e, t, r) {
+  if (!Te(e))
     return e;
-  const n = bt(e, r);
-  return yt(n).reduce((s, i) => s.then((c) => xt(c, i, t, r)), Promise.resolve(n));
+  const n = vt(e, r);
+  return yt(n).reduce((s, i) => s.then((c) => wt(c, i, t, r)), Promise.resolve(n));
 }
-async function O(e, t, r) {
+async function L(e, t, r) {
   var n;
   const a = (n = t.style) === null || n === void 0 ? void 0 : n.getPropertyValue(e);
   if (a) {
-    const s = await Re(a, null, r);
+    const s = await Pe(a, null, r);
     return t.style.setProperty(e, s, t.style.getPropertyPriority(e)), !0;
   }
   return !1;
 }
-async function vt(e, t) {
-  await O("background", e, t) || await O("background-image", e, t), await O("mask", e, t) || await O("-webkit-mask", e, t) || await O("mask-image", e, t) || await O("-webkit-mask-image", e, t);
+async function bt(e, t) {
+  await L("background", e, t) || await L("background-image", e, t), await L("mask", e, t) || await L("-webkit-mask", e, t) || await L("mask-image", e, t) || await L("-webkit-mask-image", e, t);
 }
 async function Et(e, t) {
-  const r = v(e, HTMLImageElement);
-  if (!(r && !Z(e.src)) && !(v(e, SVGImageElement) && !Z(e.href.baseVal)))
+  const r = b(e, HTMLImageElement);
+  if (!(r && !ne(e.src)) && !(b(e, SVGImageElement) && !ne(e.href.baseVal)))
     return;
-  const n = r ? e.src : e.href.baseVal, a = await Q(n, K(n), t);
+  const n = r ? e.src : e.href.baseVal, a = await ae(n, se(n), t);
   await new Promise((s, i) => {
-    e.onload = s, e.onerror = t.onImageErrorHandler ? (...l) => {
+    e.onload = s, e.onerror = t.onImageErrorHandler ? (...u) => {
       try {
-        s(t.onImageErrorHandler(...l));
-      } catch (u) {
-        i(u);
+        s(t.onImageErrorHandler(...u));
+      } catch (d) {
+        i(d);
       }
     } : i;
     const c = e;
@@ -646,13 +660,13 @@ async function Et(e, t) {
   });
 }
 async function St(e, t) {
-  const n = R(e.childNodes).map((a) => Ce(a, t));
+  const n = R(e.childNodes).map((a) => je(a, t));
   await Promise.all(n).then(() => e);
 }
-async function Ce(e, t) {
-  v(e, Element) && (await vt(e, t), await Et(e, t), await St(e, t));
+async function je(e, t) {
+  b(e, Element) && (await bt(e, t), await Et(e, t), await St(e, t));
 }
-function Rt(e, t) {
+function Ct(e, t) {
   const { style: r } = e;
   t.backgroundColor && (r.backgroundColor = t.backgroundColor), t.width && (r.width = `${t.width}px`), t.height && (r.height = `${t.height}px`);
   const n = t.style;
@@ -660,49 +674,49 @@ function Rt(e, t) {
     r[a] = n[a];
   }), e;
 }
-const me = {};
-async function he(e) {
-  let t = me[e];
+const xe = {};
+async function ye(e) {
+  let t = xe[e];
   if (t != null)
     return t;
   const n = await (await fetch(e)).text();
-  return t = { url: e, cssText: n }, me[e] = t, t;
+  return t = { url: e, cssText: n }, xe[e] = t, t;
 }
-async function pe(e, t) {
+async function we(e, t) {
   let r = e.cssText;
   const n = /url\(["']?([^"')]+)["']?\)/g, s = (r.match(/url\([^)]+\)/g) || []).map(async (i) => {
     let c = i.replace(n, "$1");
-    return c.startsWith("https://") || (c = new URL(c, e.url).href), be(c, t.fetchRequestInit, ({ result: l }) => (r = r.replace(i, `url(${l})`), [i, l]));
+    return c.startsWith("https://") || (c = new URL(c, e.url).href), Ce(c, t.fetchRequestInit, ({ result: u }) => (r = r.replace(i, `url(${u})`), [i, u]));
   });
   return Promise.all(s).then(() => r);
 }
-function ge(e) {
+function ve(e) {
   if (e == null)
     return [];
   const t = [], r = /(\/\*[\s\S]*?\*\/)/gi;
   let n = e.replace(r, "");
   const a = new RegExp("((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})", "gi");
   for (; ; ) {
-    const l = a.exec(n);
-    if (l === null)
+    const u = a.exec(n);
+    if (u === null)
       break;
-    t.push(l[0]);
+    t.push(u[0]);
   }
   n = n.replace(a, "");
   const s = /@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi, i = "((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})", c = new RegExp(i, "gi");
   for (; ; ) {
-    let l = s.exec(n);
-    if (l === null) {
-      if (l = c.exec(n), l === null)
+    let u = s.exec(n);
+    if (u === null) {
+      if (u = c.exec(n), u === null)
         break;
       s.lastIndex = c.lastIndex;
     } else
       c.lastIndex = s.lastIndex;
-    t.push(l[0]);
+    t.push(u[0]);
   }
   return t;
 }
-async function Ct(e, t) {
+async function Rt(e, t) {
   const r = [], n = [];
   return e.forEach((a) => {
     if ("cssRules" in a)
@@ -710,25 +724,25 @@ async function Ct(e, t) {
         R(a.cssRules || []).forEach((s, i) => {
           if (s.type === CSSRule.IMPORT_RULE) {
             let c = i + 1;
-            const l = s.href, u = he(l).then((m) => pe(m, t)).then((m) => ge(m).forEach((h) => {
+            const u = s.href, d = ye(u).then((p) => we(p, t)).then((p) => ve(p).forEach((g) => {
               try {
-                a.insertRule(h, h.startsWith("@import") ? c += 1 : a.cssRules.length);
-              } catch (x) {
+                a.insertRule(g, g.startsWith("@import") ? c += 1 : a.cssRules.length);
+              } catch (v) {
                 console.error("Error inserting rule from remote css", {
-                  rule: h,
-                  error: x
+                  rule: g,
+                  error: v
                 });
               }
-            })).catch((m) => {
-              console.error("Error loading remote css", m.toString());
+            })).catch((p) => {
+              console.error("Error loading remote css", p.toString());
             });
-            n.push(u);
+            n.push(d);
           }
         });
       } catch (s) {
         const i = e.find((c) => c.href == null) || document.styleSheets[0];
-        a.href != null && n.push(he(a.href).then((c) => pe(c, t)).then((c) => ge(c).forEach((l) => {
-          i.insertRule(l, i.cssRules.length);
+        a.href != null && n.push(ye(a.href).then((c) => we(c, t)).then((c) => ve(c).forEach((u) => {
+          i.insertRule(u, i.cssRules.length);
         })).catch((c) => {
           console.error("Error loading remote stylesheet", c);
         })), console.error("Error inlining remote css file", s);
@@ -744,54 +758,54 @@ async function Ct(e, t) {
       }
   }), r));
 }
-function Tt(e) {
-  return e.filter((t) => t.type === CSSRule.FONT_FACE_RULE).filter((t) => Se(t.style.getPropertyValue("src")));
+function kt(e) {
+  return e.filter((t) => t.type === CSSRule.FONT_FACE_RULE).filter((t) => Te(t.style.getPropertyValue("src")));
 }
-async function Pt(e, t) {
+async function Tt(e, t) {
   if (e.ownerDocument == null)
     throw new Error("Provided element is not within a Document");
-  const r = R(e.ownerDocument.styleSheets), n = await Ct(r, t);
-  return Tt(n);
+  const r = R(e.ownerDocument.styleSheets), n = await Rt(r, t);
+  return kt(n);
 }
-function Te(e) {
+function Oe(e) {
   return e.trim().replace(/["']/g, "");
 }
-function kt(e) {
+function Pt(e) {
   const t = /* @__PURE__ */ new Set();
   function r(n) {
     (n.style.fontFamily || getComputedStyle(n).fontFamily).split(",").forEach((s) => {
-      t.add(Te(s));
+      t.add(Oe(s));
     }), Array.from(n.children).forEach((s) => {
       s instanceof HTMLElement && r(s);
     });
   }
   return r(e), t;
 }
-async function _t(e, t) {
-  const r = await Pt(e, t), n = kt(e);
-  return (await Promise.all(r.filter((s) => n.has(Te(s.style.fontFamily))).map((s) => {
+async function jt(e, t) {
+  const r = await Tt(e, t), n = Pt(e);
+  return (await Promise.all(r.filter((s) => n.has(Oe(s.style.fontFamily))).map((s) => {
     const i = s.parentStyleSheet ? s.parentStyleSheet.href : null;
-    return Re(s.cssText, i, t);
+    return Pe(s.cssText, i, t);
   }))).join(`
 `);
 }
-async function jt(e, t) {
-  const r = t.fontEmbedCSS != null ? t.fontEmbedCSS : t.skipFonts ? null : await _t(e, t);
+async function Ot(e, t) {
+  const r = t.fontEmbedCSS != null ? t.fontEmbedCSS : t.skipFonts ? null : await jt(e, t);
   if (r) {
     const n = document.createElement("style"), a = document.createTextNode(r);
     n.appendChild(a), e.firstChild ? e.insertBefore(n, e.firstChild) : e.appendChild(n);
   }
 }
-async function Ot(e, t = {}) {
-  const { width: r, height: n } = xe(e, t), a = await U(e, t, !0);
-  return await jt(a, t), await Ce(a, t), Rt(a, t), await Be(a, r, n);
+async function _t(e, t = {}) {
+  const { width: r, height: n } = Se(e, t), a = await J(e, t, !0);
+  return await Ot(a, t), await je(a, t), Ct(a, t), await Be(a, r, n);
 }
-async function At(e, t = {}) {
-  const { width: r, height: n } = xe(e, t), a = await Ot(e, t), s = await W(a), i = document.createElement("canvas"), c = i.getContext("2d"), l = t.pixelRatio || ze(), u = t.canvasWidth || r, m = t.canvasHeight || n;
-  return i.width = u * l, i.height = m * l, t.skipAutoScale || Ye(i), i.style.width = `${u}`, i.style.height = `${m}`, t.backgroundColor && (c.fillStyle = t.backgroundColor, c.fillRect(0, 0, i.width, i.height)), c.drawImage(s, 0, 0, i.width, i.height), i;
+async function Vt(e, t = {}) {
+  const { width: r, height: n } = Se(e, t), a = await _t(e, t), s = await B(a), i = document.createElement("canvas"), c = i.getContext("2d"), u = t.pixelRatio || Ue(), d = t.canvasWidth || r, p = t.canvasHeight || n;
+  return i.width = d * u, i.height = p * u, t.skipAutoScale || Ye(i), i.style.width = `${d}`, i.style.height = `${p}`, t.backgroundColor && (c.fillStyle = t.backgroundColor, c.fillRect(0, 0, i.width, i.height)), c.drawImage(s, 0, 0, i.width, i.height), i;
 }
-async function $t(e, t = {}) {
-  return (await At(e, t)).toDataURL();
+async function At(e, t = {}) {
+  return (await Vt(e, t)).toDataURL();
 }
 const Lt = (e) => {
   const r = Object.keys(e).find((s) => s.startsWith("__reactFiber$") || s.startsWith("__reactInternalInstance$"));
@@ -807,24 +821,24 @@ const Lt = (e) => {
     a = a.return;
   }
   return n.join(" > ") || "Generic Component";
-}, Ft = (e) => {
+}, $t = (e) => {
   const t = e.getAttribute("data-source-path") || "unknown:0", r = Lt(e), a = ((c) => {
-    const l = [];
-    let u = c;
-    for (; u && u.nodeType === Node.ELEMENT_NODE; ) {
-      let m = u.nodeName.toLowerCase();
-      if (u.id) {
-        m += "#" + u.id, l.unshift(m);
+    const u = [];
+    let d = c;
+    for (; d && d.nodeType === Node.ELEMENT_NODE; ) {
+      let p = d.nodeName.toLowerCase();
+      if (d.id) {
+        p += "#" + d.id, u.unshift(p);
         break;
       } else {
-        let h = u, x = 1;
-        for (; h.previousElementSibling; )
-          h = h.previousElementSibling, h.nodeName.toLowerCase() === m && x++;
-        x > 1 && (m += `:nth-of-type(${x})`);
+        let g = d, v = 1;
+        for (; g.previousElementSibling; )
+          g = g.previousElementSibling, g.nodeName.toLowerCase() === p && v++;
+        v > 1 && (p += `:nth-of-type(${v})`);
       }
-      l.unshift(m), u = u.parentElement;
+      u.unshift(p), d = d.parentElement;
     }
-    return l.join(" > ");
+    return u.join(" > ");
   })(e), s = (e.innerText || "").slice(0, 50).trim(), i = `${e.tagName.toLowerCase()}-${s.replace(/\s+/g, "_")}-${a.split(" > ").slice(-2).join("_")}`;
   return {
     tag: e.tagName.toLowerCase(),
@@ -838,29 +852,50 @@ const Lt = (e) => {
     signature: i,
     source: t
   };
-}, Vt = () => {
-  const { addToast: e, language: t, t: r, apiKey: n, baseUrl: a } = De(), [s, i] = C(!1), [c, l] = C(null), [u, m] = C(null), [h, x] = C(""), [S, A] = C(!1), [G, T] = C(!1), $ = oe((b) => {
-    if (!s || u) return;
-    const g = document.elementFromPoint(b.clientX, b.clientY);
-    if (!g || g.id === "viewgate-overlay" || g.closest("#viewgate-ui")) {
-      l(null);
+}, Ft = () => {
+  const { addToast: e, language: t, t: r, apiKey: n, baseUrl: a } = Ne(), [s, i] = S(!1), [c, u] = S(null), [d, p] = S(null), [g, v] = S(""), [C, $] = S(!1), [M, O] = S(!1), [k, H] = S(!1), [F, X] = S([]), [Z, W] = S(!1), T = te(async () => {
+    if (n) {
+      W(!0);
+      try {
+        const m = await fetch(`${a}/api/annotations`, {
+          headers: { "x-api-key": n }
+        });
+        if (m.ok) {
+          const h = await m.json();
+          X(h);
+        }
+      } catch (m) {
+        console.error("Failed to fetch annotations", m);
+      } finally {
+        W(!1);
+      }
+    }
+  }, [n, a]);
+  ue(() => {
+    (s || k) && T();
+  }, [s, k, T]);
+  const G = te((m) => {
+    if (!s || d) return;
+    const h = document.elementFromPoint(m.clientX, m.clientY);
+    if (!h || h.id === "viewgate-overlay" || h.closest("#viewgate-ui")) {
+      u(null);
       return;
     }
-    g.getAttribute("data-source-path"), l({
-      tag: g.tagName.toLowerCase(),
-      source: g.getAttribute("data-source-path") || "unknown:0",
-      rect: g.getBoundingClientRect(),
-      element: g,
-      previewText: (g.innerText || "").slice(0, 100) || (g.getAttribute("placeholder") || "").slice(0, 100) || g.tagName.toLowerCase(),
-      semanticReference: Ft(g)
+    h.getAttribute("data-source-path"), u({
+      tag: h.tagName.toLowerCase(),
+      source: h.getAttribute("data-source-path") || "unknown:0",
+      rect: h.getBoundingClientRect(),
+      element: h,
+      previewText: (h.innerText || "").slice(0, 100) || (h.getAttribute("placeholder") || "").slice(0, 100) || h.tagName.toLowerCase(),
+      semanticReference: $t(h)
     });
-  }, [s, u]), L = oe(async (b) => {
-    if (!(!s || u) && c) {
-      b.preventDefault(), b.stopPropagation(), T(!0);
+  }, [s, d]), P = te(async (m) => {
+    if (!(!s || d) && c) {
+      m.preventDefault(), m.stopPropagation(), O(!0);
       try {
-        const g = c.element.style.display, P = window.getComputedStyle(c.element).display === "inline";
-        P && (c.element.style.display = "inline-block");
-        const F = await $t(c.element, {
+        const h = c.element.style.display, _ = window.getComputedStyle(c.element).display === "inline";
+        _ && (c.element.style.display = "inline-block");
+        const j = await At(c.element, {
           backgroundColor: "#ffffff",
           pixelRatio: 2,
           skipFonts: !0,
@@ -870,21 +905,21 @@ const Lt = (e) => {
             // Extra padding for better look
           }
         });
-        P && (c.element.style.display = g), m({ ...c, visualPreview: F });
-      } catch (g) {
-        console.error("Failed to capture preview:", g), m(c);
+        _ && (c.element.style.display = h), p({ ...c, visualPreview: j });
+      } catch (h) {
+        console.error("Failed to capture preview:", h), p(c);
       } finally {
-        T(!1), l(null);
+        O(!1), u(null);
       }
     }
-  }, [s, c, u]);
-  Fe(() => (s && !u ? document.body.classList.add("vg-cursor-pointer") : document.body.classList.remove("vg-cursor-pointer"), window.addEventListener("mousemove", $), window.addEventListener("click", L, !0), () => {
-    document.body.classList.remove("vg-cursor-pointer"), window.removeEventListener("mousemove", $), window.removeEventListener("click", L, !0);
-  }), [s, u, $, L]);
-  const N = async () => {
-    if (!u || !h.trim()) return;
-    A(!0);
-    const { semanticReference: b } = u, [g, P] = b.source.split(":"), F = P || "0";
+  }, [s, c, d, k]);
+  ue(() => (s && !d ? document.body.classList.add("vg-cursor-pointer") : document.body.classList.remove("vg-cursor-pointer"), window.addEventListener("mousemove", G), window.addEventListener("click", P, !0), () => {
+    document.body.classList.remove("vg-cursor-pointer"), window.removeEventListener("mousemove", G), window.removeEventListener("click", P, !0);
+  }), [s, d, G, P]);
+  const K = async () => {
+    if (!d || !g.trim()) return;
+    $(!0);
+    const { semanticReference: m } = d, [h, _] = m.source.split(":"), j = _ || "0";
     try {
       if (!(await fetch(`${a}/api/annotations`, {
         method: "POST",
@@ -893,32 +928,45 @@ const Lt = (e) => {
           "x-api-key": n
         },
         body: JSON.stringify({
-          filePath: g,
-          line: parseInt(F),
+          filePath: h,
+          line: parseInt(j),
           url: window.location.href,
-          message: h,
-          componentName: b.componentPath || u.tag,
-          reference: b
+          message: g,
+          componentName: m.componentPath || d.tag,
+          reference: m
         })
       })).ok) throw new Error("Backend failed");
-      e(r.success, "success"), m(null), x(""), i(!1);
-    } catch (k) {
-      console.error(k), e(r.error, "error");
+      e(r.success, "success"), p(null), v(""), i(!1), T();
+    } catch (I) {
+      console.error(I), e(r.error, "error");
     } finally {
-      A(!1);
+      $(!1);
     }
-  }, z = (b) => b.split("/").pop()?.split("\\").pop() || "unknown";
-  return /* @__PURE__ */ d.jsxs(d.Fragment, { children: [
-    /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:230", style: { position: "fixed", bottom: "30px", right: "30px", zIndex: 99999 }, id: "viewgate-ui", children: /* @__PURE__ */ d.jsx(
-      "button",
-      {
-        onClick: () => i(!s),
-        className: "vg-button-primary",
-        style: { padding: "12px 24px", fontSize: "15px" },
-        children: s ? r.exitMode : r.enterMode
-      }
-    ) }),
-    G && /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:242", style: {
+  }, z = (m) => m.split("/").pop()?.split("\\").pop() || "unknown";
+  return /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
+    /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:259", style: { position: "fixed", bottom: "30px", right: "30px", zIndex: 99999 }, id: "viewgate-ui", children: [
+      /* @__PURE__ */ l.jsx(
+        "button",
+        {
+          onClick: () => i(!s),
+          className: "vg-button-primary",
+          style: { padding: "12px 24px", fontSize: "15px" },
+          children: s ? r.exitMode : r.enterMode
+        }
+      ),
+      F.length > 0 && /* @__PURE__ */ l.jsx(
+        "button",
+        {
+          onClick: () => {
+            H(!k), i(!1), p(null);
+          },
+          className: "vg-button-ghost",
+          style: { padding: "12px 24px", fontSize: "15px", marginLeft: "12px", background: "white" },
+          children: r.viewComments
+        }
+      )
+    ] }),
+    M && /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:284", style: {
       position: "fixed",
       top: 0,
       left: 0,
@@ -930,8 +978,11 @@ const Lt = (e) => {
       justifyContent: "center",
       zIndex: 1e5,
       cursor: "wait"
-    }, children: /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:255", className: "vg-glassmorphism", style: { padding: "20px 40px", fontWeight: 700 }, children: "Capturing..." }) }),
-    s && c && !u && !G && /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:263", style: {
+    }, children: /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:297", className: "vg-glassmorphism", style: { padding: "30px 50px", fontWeight: 700, display: "flex", flexDirection: "column", alignItems: "center", backgroundColor: "rgba(0,0,0,0.7)", color: "white", border: "1px solid rgba(255,255,255,0.1)" }, children: [
+      /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:298", className: "vg-spinner" }),
+      "Capturing..."
+    ] }) }),
+    s && c && !d && !M && /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:306", style: {
       position: "fixed",
       top: c.rect.top,
       left: c.rect.left,
@@ -945,7 +996,7 @@ const Lt = (e) => {
       boxShadow: "0 0 15px rgba(37, 19, 236, 0.2)",
       transition: "all 0.1s ease-out"
     } }),
-    u && /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:281", className: "vg-animate-fade", style: {
+    d && /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:324", className: "vg-animate-fade", style: {
       position: "fixed",
       top: 0,
       left: 0,
@@ -957,33 +1008,33 @@ const Lt = (e) => {
       alignItems: "center",
       justifyContent: "center",
       zIndex: 99999
-    }, children: /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:294", className: "vg-glassmorphism vg-animate-slide", style: {
+    }, children: /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:337", className: "vg-glassmorphism vg-animate-slide", style: {
       padding: "32px",
       width: "460px",
       background: "white",
       color: "#0f172a"
     }, children: [
-      /* @__PURE__ */ d.jsx("h2", { "data-source-path": "/src/components/ViewGateOverlay.tsx:300", style: { margin: "0 0 10px 0", fontSize: "24px", fontWeight: 800 }, children: r.feedbackHeader }),
-      /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:302", style: { marginBottom: "20px" }, children: [
-        /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:303", style: { display: "flex", flexWrap: "wrap", gap: "8px", alignItems: "center" }, children: [
-          u.semanticReference.componentPath ? /* @__PURE__ */ d.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:305", className: "vg-badge", style: { backgroundColor: "#f5f3ff", color: "#7c3aed", borderColor: "#ddd6fe" }, children: [
+      /* @__PURE__ */ l.jsx("h2", { "data-source-path": "/src/components/ViewGateOverlay.tsx:343", style: { margin: "0 0 10px 0", fontSize: "24px", fontWeight: 800 }, children: r.feedbackHeader }),
+      /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:345", style: { marginBottom: "20px" }, children: [
+        /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:346", style: { display: "flex", flexWrap: "wrap", gap: "8px", alignItems: "center" }, children: [
+          d.semanticReference.componentPath ? /* @__PURE__ */ l.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:348", className: "vg-badge", style: { backgroundColor: "#f5f3ff", color: "#7c3aed", borderColor: "#ddd6fe" }, children: [
             "📦 ",
-            u.semanticReference.componentPath
-          ] }) : /* @__PURE__ */ d.jsx("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:309", className: "vg-badge", children: u.tag }),
-          u.semanticReference.source && !u.semanticReference.source.startsWith("unknown") ? /* @__PURE__ */ d.jsx(d.Fragment, { children: /* @__PURE__ */ d.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:314", className: "vg-badge", style: { backgroundColor: "#fdf2f8", color: "#db2777", borderColor: "#fbcfe8" }, children: [
+            d.semanticReference.componentPath
+          ] }) : /* @__PURE__ */ l.jsx("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:352", className: "vg-badge", children: d.tag }),
+          d.semanticReference.source && !d.semanticReference.source.startsWith("unknown") ? /* @__PURE__ */ l.jsx(l.Fragment, { children: /* @__PURE__ */ l.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:357", className: "vg-badge", style: { backgroundColor: "#fdf2f8", color: "#db2777", borderColor: "#fbcfe8" }, children: [
             "📄 ",
-            z(u.semanticReference.source.split(":")[0] || "unknown")
-          ] }) }) : /* @__PURE__ */ d.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:319", className: "vg-badge", style: { backgroundColor: "#f0f9ff", color: "#0369a1", borderColor: "#bae6fd", maxWidth: "300px", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: [
+            z(d.semanticReference.source.split(":")[0] || "unknown")
+          ] }) }) : /* @__PURE__ */ l.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:362", className: "vg-badge", style: { backgroundColor: "#f0f9ff", color: "#0369a1", borderColor: "#bae6fd", maxWidth: "300px", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: [
             "🆔 ",
-            u.semanticReference.signature
+            d.semanticReference.signature
           ] })
         ] }),
-        /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:324", style: { marginTop: "8px", fontSize: "11px", color: "#94a3b8" }, children: [
+        /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:367", style: { marginTop: "8px", fontSize: "11px", color: "#94a3b8" }, children: [
           "🎯 ",
-          u.semanticReference.selector
+          d.semanticReference.selector
         ] })
       ] }),
-      /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:330", style: {
+      /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:373", style: {
         backgroundColor: "#f8fafc",
         borderRadius: "8px",
         border: "1px solid #e2e8f0",
@@ -992,8 +1043,8 @@ const Lt = (e) => {
         display: "flex",
         flexDirection: "column"
       }, children: [
-        /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:339", style: { padding: "8px 12px", fontSize: "10px", color: "#94a3b8", textTransform: "uppercase", fontWeight: 700, borderBottom: "1px solid #f1f5f9" }, children: r.preview }),
-        /* @__PURE__ */ d.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:342", style: {
+        /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:382", style: { padding: "8px 12px", fontSize: "10px", color: "#94a3b8", textTransform: "uppercase", fontWeight: 700, borderBottom: "1px solid #f1f5f9" }, children: r.preview }),
+        /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:385", style: {
           padding: "12px",
           display: "flex",
           justifyContent: "center",
@@ -1002,10 +1053,10 @@ const Lt = (e) => {
           maxHeight: "150px",
           overflow: "hidden",
           backgroundColor: "white"
-        }, children: u.visualPreview ? /* @__PURE__ */ d.jsx(
+        }, children: d.visualPreview ? /* @__PURE__ */ l.jsx(
           "img",
           {
-            src: u.visualPreview,
+            src: d.visualPreview,
             alt: "Element Preview",
             style: {
               maxWidth: "100%",
@@ -1015,77 +1066,175 @@ const Lt = (e) => {
               borderRadius: "4px"
             }
           }
-        ) : /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:365", style: { fontSize: "13px", color: "#64748b", fontStyle: "italic" }, children: [
+        ) : /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:408", style: { fontSize: "13px", color: "#64748b", fontStyle: "italic" }, children: [
           '"',
-          u.previewText,
+          d.previewText,
           '"'
         ] }) })
       ] }),
-      /* @__PURE__ */ d.jsx(
+      /* @__PURE__ */ l.jsx(
         "textarea",
         {
           className: "vg-textarea",
-          value: h,
-          onChange: (b) => x(b.target.value),
+          value: g,
+          onChange: (m) => v(m.target.value),
           rows: 4,
           placeholder: r.placeholder,
           autoFocus: !0
         }
       ),
-      /* @__PURE__ */ d.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:381", style: { display: "flex", justifyContent: "flex-end", gap: "12px", marginTop: "24px" }, children: [
-        /* @__PURE__ */ d.jsx(
+      /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:424", style: { display: "flex", justifyContent: "flex-end", gap: "12px", marginTop: "24px" }, children: [
+        /* @__PURE__ */ l.jsx(
           "button",
           {
-            onClick: () => m(null),
+            onClick: () => p(null),
             className: "vg-button-ghost",
             children: r.cancel
           }
         ),
-        /* @__PURE__ */ d.jsx(
+        /* @__PURE__ */ l.jsx(
           "button",
           {
-            onClick: N,
+            onClick: K,
             className: "vg-button-primary",
-            disabled: S || !h.trim(),
-            style: { opacity: S || !h.trim() ? 0.6 : 1 },
-            children: S ? r.submitting : r.send
+            disabled: C || !g.trim(),
+            style: { opacity: C || !g.trim() ? 0.6 : 1 },
+            children: C ? r.submitting : r.send
           }
         )
       ] })
+    ] }) }),
+    k && /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:446", className: "vg-animate-fade", style: {
+      position: "fixed",
+      top: 0,
+      left: 0,
+      width: "100%",
+      height: "100%",
+      backgroundColor: "rgba(0,0,0,0.6)",
+      backdropFilter: "blur(4px)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      zIndex: 99999
+    }, children: /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:459", className: "vg-glassmorphism vg-animate-slide", style: {
+      padding: "32px",
+      width: "600px",
+      maxHeight: "80vh",
+      background: "white",
+      color: "#0f172a",
+      display: "flex",
+      flexDirection: "column"
+    }, children: [
+      /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:468", style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: "20px" }, children: [
+        /* @__PURE__ */ l.jsx("h2", { "data-source-path": "/src/components/ViewGateOverlay.tsx:469", style: { margin: 0, fontSize: "24px", fontWeight: 800 }, children: r.feedbackHeader }),
+        /* @__PURE__ */ l.jsx("button", { "data-source-path": "/src/components/ViewGateOverlay.tsx:470", onClick: () => H(!1), className: "vg-button-ghost", style: { padding: "6px 12px" }, children: "✕" })
+      ] }),
+      /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:473", style: { overflowY: "auto", flex: 1, paddingRight: "8px", display: "flex", flexDirection: "column", gap: "16px" }, children: Z ? /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:475", style: { textAlign: "center", padding: "40px", color: "#64748b" }, children: "Cargando..." }) : F.length === 0 ? /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:477", style: { textAlign: "center", padding: "40px", color: "#64748b" }, children: r.noComments }) : F.map((m) => /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:480", style: {
+        border: "1px solid #e2e8f0",
+        borderRadius: "12px",
+        padding: "16px",
+        backgroundColor: m.status === "ready_for_review" ? "#f0fdf4" : "#fff"
+      }, children: [
+        /* @__PURE__ */ l.jsx("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:486", style: { display: "flex", justifyContent: "space-between", marginBottom: "12px" }, children: /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:487", style: { display: "flex", gap: "8px", alignItems: "center" }, children: [
+          m.status === "ready_for_review" ? /* @__PURE__ */ l.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:489", className: "vg-badge", style: { backgroundColor: "#dcfce7", color: "#166534", borderColor: "#bbf7d0" }, children: [
+            "✓ ",
+            r.readyForReview
+          ] }) : /* @__PURE__ */ l.jsxs("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:491", className: "vg-badge", style: { backgroundColor: "#fef3c7", color: "#92400e", borderColor: "#fde68a" }, children: [
+            "⏳ ",
+            r.pending
+          ] }),
+          /* @__PURE__ */ l.jsx("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:493", style: { fontSize: "12px", color: "#64748b" }, children: new Date(m.timestamp).toLocaleString() })
+        ] }) }),
+        /* @__PURE__ */ l.jsxs("p", { "data-source-path": "/src/components/ViewGateOverlay.tsx:499", style: { margin: "0 0 12px 0", fontSize: "15px", fontWeight: 600 }, children: [
+          '"',
+          m.message,
+          '"'
+        ] }),
+        /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:501", style: { display: "flex", gap: "6px", flexWrap: "wrap", marginBottom: "16px" }, children: [
+          /* @__PURE__ */ l.jsx("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:502", className: "vg-badge", style: { backgroundColor: "#f1f5f9", color: "#475569", border: "none" }, children: m.componentName || "UI Element" }),
+          m.filePath && m.filePath !== "unknown" && /* @__PURE__ */ l.jsx("span", { "data-source-path": "/src/components/ViewGateOverlay.tsx:506", className: "vg-badge", style: { backgroundColor: "#f1f5f9", color: "#475569", border: "none" }, children: z(m.filePath) })
+        ] }),
+        m.status === "ready_for_review" && /* @__PURE__ */ l.jsxs("div", { "data-source-path": "/src/components/ViewGateOverlay.tsx:513", style: { display: "flex", gap: "8px", justifyContent: "flex-end", borderTop: "1px solid #e2e8f0", paddingTop: "16px", marginTop: "8px" }, children: [
+          /* @__PURE__ */ l.jsxs(
+            "button",
+            {
+              "data-source-path": "/src/components/ViewGateOverlay.tsx:514",
+              className: "vg-button-ghost",
+              style: { display: "flex", alignItems: "center", gap: "6px" },
+              onClick: async () => {
+                try {
+                  (await fetch(`${a}/api/annotations/${m._id}`, {
+                    method: "PATCH",
+                    headers: { "Content-Type": "application/json", "x-api-key": n },
+                    body: JSON.stringify({ status: "pending" })
+                  })).ok && (T(), e(r.success, "success"));
+                } catch {
+                }
+              },
+              children: [
+                "✍️ ",
+                r.observe
+              ]
+            }
+          ),
+          /* @__PURE__ */ l.jsxs(
+            "button",
+            {
+              "data-source-path": "/src/components/ViewGateOverlay.tsx:534",
+              className: "vg-button-primary",
+              style: { backgroundColor: "#ef4444", display: "flex", alignItems: "center", gap: "6px" },
+              onClick: async () => {
+                if (window.confirm(r.deleteConfirm))
+                  try {
+                    (await fetch(`${a}/api/annotations/${m._id}`, {
+                      method: "DELETE",
+                      headers: { "x-api-key": n }
+                    })).ok && (T(), e(r.success, "success"));
+                  } catch {
+                  }
+              },
+              children: [
+                "🗑️ ",
+                r.close
+              ]
+            }
+          )
+        ] })
+      ] }, m._id)) })
     ] }) })
   ] });
 };
-function Pe(e, t, r) {
+function _e(e, t, r) {
   if (!t.endsWith(".tsx") && !t.endsWith(".jsx") || t.includes("node_modules")) return e;
   const n = (c) => c.replace(/\\/g, "/"), a = n(t).replace(n(r), "");
   return e.split(`
-`).map((c, l) => {
-    const u = l + 1;
-    return c.replace(/(^|[^a-zA-Z0-9])<([a-zA-Z][a-zA-Z0-9\.]*)(?=[ \t\n\/\>])/g, (m, h, x) => m.includes("data-source-path") || x === "Fragment" || x === "React.Fragment" ? m : `${h}<${x} data-source-path="${a}:${u}"`);
+`).map((c, u) => {
+    const d = u + 1;
+    return c.replace(/(^|[^a-zA-Z0-9])<([a-zA-Z][a-zA-Z0-9\.]*)(?=[ \t\n\/\>])/g, (p, g, v) => p.includes("data-source-path") || v === "Fragment" || v === "React.Fragment" ? p : `${g}<${v} data-source-path="${a}:${d}"`);
   }).join(`
 `);
 }
-function Mt() {
+function Dt() {
   return {
     name: "vite-plugin-viewgate",
     enforce: "pre",
     transform(e, t) {
       return {
-        code: Pe(e, t, process.cwd()),
+        code: _e(e, t, process.cwd()),
         map: null
       };
     }
   };
 }
-function Dt(e) {
+function Nt(e) {
   const t = this.resourcePath;
-  return t ? (process.env.NODE_ENV, Pe(e, t, process.cwd())) : e;
+  return t ? (process.env.NODE_ENV, _e(e, t, process.cwd())) : e;
 }
 export {
-  Gt as ViewGate,
-  Vt as ViewGateOverlay,
-  Pe as transformSourcePaths,
-  De as useViewGate,
-  Dt as viewgateNextLoader,
-  Mt as viewgatePlugin
+  It as ViewGate,
+  Ft as ViewGateOverlay,
+  _e as transformSourcePaths,
+  Ne as useViewGate,
+  Nt as viewgateNextLoader,
+  Dt as viewgatePlugin
 };