veo-sdk 0.3.0 → 0.3.2

package/dist/index.cjs

@@ -39,11 +39,14 @@ var init_safe_env = __esm({
 });
 
 // src/core/builder-constants.ts
-var BUILDER_TOKEN_PARAM, BUILDER_ORIGIN_PARAM;
+var BUILDER_TOKEN_PARAM, BUILDER_ORIGIN_PARAM, BUILDER_PANEL_PARAM, BUILDER_PANEL_PATH_PARAM, BUILDER_GUIDE_PARAM;
 var init_builder_constants = __esm({
   "src/core/builder-constants.ts"() {
     BUILDER_TOKEN_PARAM = "veoBuilder";
     BUILDER_ORIGIN_PARAM = "veoBuilderOrigin";
+    BUILDER_PANEL_PARAM = "veoBuilderPanel";
+    BUILDER_PANEL_PATH_PARAM = "veoBuilderPanelPath";
+    BUILDER_GUIDE_PARAM = "veoGuide";
   }
 });
 
@@ -62,56 +65,51 @@ function urlParams() {
     return null;
   }
 }
-function resolveBuilderToken() {
+function resolveBuilderContext() {
   if (!hasWindow()) return null;
   const params = urlParams();
   const fromUrl = params?.get(BUILDER_TOKEN_PARAM);
   if (fromUrl) {
-    const store = session();
+    const ctx = {
+      token: fromUrl,
+      origin: params?.get(BUILDER_ORIGIN_PARAM) ?? null,
+      panel: params?.get(BUILDER_PANEL_PARAM) === "1",
+      guide: params?.get(BUILDER_GUIDE_PARAM) ?? null,
+      panelPath: params?.get(BUILDER_PANEL_PATH_PARAM) ?? null
+    };
     try {
-      store?.setItem(TOKEN_KEY, fromUrl);
-      const origin = params?.get(BUILDER_ORIGIN_PARAM);
-      if (origin) store?.setItem(ORIGIN_KEY, origin);
+      session()?.setItem(CTX_KEY, JSON.stringify(ctx));
     } catch {
     }
-    return fromUrl;
+    return ctx;
   }
   try {
-    return session()?.getItem(TOKEN_KEY) ?? null;
+    const raw = session()?.getItem(CTX_KEY);
+    return raw ? JSON.parse(raw) : null;
   } catch {
     return null;
   }
 }
-function resolveBuilderOrigin() {
-  if (!hasWindow()) return null;
-  const fromUrl = urlParams()?.get(BUILDER_ORIGIN_PARAM);
-  if (fromUrl) return fromUrl;
-  try {
-    return session()?.getItem(ORIGIN_KEY) ?? null;
-  } catch {
-    return null;
-  }
+function resolveBuilderToken() {
+  return resolveBuilderContext()?.token ?? null;
 }
 function isBuilderMode() {
-  return resolveBuilderToken() !== null;
+  return resolveBuilderContext() !== null;
 }
 function clearBuilderToken() {
   if (!hasWindow()) return;
   try {
-    const store = session();
-    store?.removeItem(TOKEN_KEY);
-    store?.removeItem(ORIGIN_KEY);
+    session()?.removeItem(CTX_KEY);
   } catch {
   }
 }
-var TOKEN_KEY, ORIGIN_KEY;
+var CTX_KEY;
 var init_builder_token = __esm({
   "src/core/builder-token.ts"() {
     init_safe_env();
     init_builder_constants();
     init_builder_constants();
-    TOKEN_KEY = "veo:builder_token";
-    ORIGIN_KEY = "veo:builder_origin";
+    CTX_KEY = "veo:builder_ctx";
   }
 });
 
@@ -1940,6 +1938,85 @@ var init_bridge_protocol = __esm({
   }
 });
 
+// src/plugins/builder/builder-panel.ts
+function injectBuilderPanel(opts) {
+  if (!hasWindow() || !hasDocument()) {
+    return { target: () => null, teardown: () => {
+    } };
+  }
+  const host = document.createElement("div");
+  host.setAttribute("data-veo-builder-panel", "");
+  const shadow = host.attachShadow({ mode: "open" });
+  const style = document.createElement("style");
+  style.textContent = PANEL_CSS;
+  const container = document.createElement("div");
+  container.className = "veo-panel";
+  const header = document.createElement("div");
+  header.className = "veo-panel-header";
+  const title = document.createElement("span");
+  title.className = "veo-panel-title";
+  title.textContent = "Veo \xB7 Editor";
+  const close = document.createElement("button");
+  close.className = "veo-panel-close";
+  close.type = "button";
+  close.setAttribute("aria-label", "Cerrar");
+  close.textContent = "\u2715";
+  close.addEventListener("click", () => opts.onClose());
+  header.append(title, close);
+  const iframe = document.createElement("iframe");
+  iframe.className = "veo-panel-frame";
+  iframe.title = "Editor de Veo";
+  iframe.src = buildPanelUrl(opts);
+  container.append(header, iframe);
+  shadow.append(style, container);
+  document.body.appendChild(host);
+  return {
+    target: () => iframe.contentWindow,
+    teardown: () => host.remove()
+  };
+}
+function buildPanelUrl(opts) {
+  const path = opts.panelPath ?? DEFAULT_PANEL_PATH;
+  const url = new URL(path, opts.dashboardOrigin);
+  url.searchParams.set("veoToken", opts.token);
+  url.searchParams.set("veoApp", opts.appOrigin);
+  if (opts.guide) url.searchParams.set("veoGuide", opts.guide);
+  return url.toString();
+}
+var DEFAULT_PANEL_PATH, PANEL_CSS;
+var init_builder_panel = __esm({
+  "src/plugins/builder/builder-panel.ts"() {
+    init_safe_env();
+    DEFAULT_PANEL_PATH = "/guides/design";
+    PANEL_CSS = `
+:host { all: initial; }
+.veo-panel {
+  position: fixed; top: 0; right: 0; bottom: 0;
+  width: 420px; max-width: 100vw;
+  display: flex; flex-direction: column;
+  background: #fff;
+  box-shadow: -8px 0 30px rgba(0,0,0,0.18);
+  z-index: 2147483647;
+  font-family: system-ui, -apple-system, sans-serif;
+}
+.veo-panel-header {
+  flex: 0 0 auto;
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 8px 12px;
+  background: #0f172a; color: #fff;
+  font-size: 13px; font-weight: 600;
+}
+.veo-panel-close {
+  border: 0; background: transparent; color: #fff;
+  font-size: 15px; cursor: pointer; line-height: 1;
+  padding: 4px 6px; border-radius: 6px;
+}
+.veo-panel-close:hover { background: rgba(255,255,255,0.15); }
+.veo-panel-frame { flex: 1 1 auto; width: 100%; border: 0; background: #fff; }
+`;
+  }
+});
+
 // src/plugins/builder/element-picker.ts
 function startElementPicker(options) {
   if (!hasDocument()) {
@@ -2145,18 +2222,23 @@ var init_element_picker = __esm({
 // src/plugins/builder/builder-mode.ts
 function initBuilderMode() {
   if (!hasWindow() || !hasDocument()) return null;
-  const token = resolveBuilderToken();
-  if (!token) return null;
-  const dashboardOrigin = resolveDashboardOrigin();
+  const ctx = resolveBuilderContext();
+  if (!ctx) return null;
+  const token = ctx.token;
+  const dashboardOrigin = resolveDashboardOrigin(ctx.origin);
   if (!dashboardOrigin) return null;
-  const target = resolveTarget();
-  if (!target) return null;
   let picker = null;
+  let panel = null;
+  let staticTarget = null;
+  const getTarget = () => panel ? panel.target() : staticTarget;
   const post = (event) => {
-    target.postMessage({ source: VEO_BUILDER_SOURCE, token, ...event }, dashboardOrigin);
+    getTarget()?.postMessage({ source: VEO_BUILDER_SOURCE, token, ...event }, dashboardOrigin);
   };
   const handleCommand = (cmd) => {
     switch (cmd.type) {
+      case "panel-ready":
+        post({ type: "ready" });
+        break;
       case "start-picker":
         picker?.stop();
         picker = startElementPicker({
@@ -2200,13 +2282,28 @@ function initBuilderMode() {
     picker?.stop();
     picker = null;
     closeGuidePreview();
-    clearBuilderToken();
     post({ type: "closed" });
+    panel?.teardown();
+    panel = null;
+    clearBuilderToken();
   };
+  if (ctx.panel) {
+    panel = injectBuilderPanel({
+      dashboardOrigin,
+      token,
+      appOrigin: window.location.origin,
+      guide: ctx.guide,
+      panelPath: ctx.panelPath,
+      onClose: () => teardown()
+    });
+  } else {
+    staticTarget = resolveTarget();
+    if (!staticTarget) return null;
+  }
   const activate = () => {
     window.addEventListener("message", onMessage);
     window.addEventListener("pagehide", onPageHide);
-    post({ type: "ready" });
+    if (!ctx.panel) post({ type: "ready" });
   };
   const cfg = window.__veoBuilder;
   if (cfg?.apiKey && cfg?.apiUrl) {
@@ -2239,11 +2336,10 @@ function resolveTarget() {
   if (window.parent && window.parent !== window) return window.parent;
   return null;
 }
-function resolveDashboardOrigin() {
-  const stored = resolveBuilderOrigin();
-  if (stored) {
+function resolveDashboardOrigin(originHint) {
+  if (originHint) {
     try {
-      return new URL(stored).origin;
+      return new URL(originHint).origin;
     } catch {
       return null;
     }
@@ -2263,6 +2359,7 @@ var init_builder_mode = __esm({
     init_safe_env();
     init_guide_preview();
     init_bridge_protocol();
+    init_builder_panel();
     init_element_picker();
   }
 });