veo-sdk 0.5.2 → 0.5.4

package/dist/builder-MFTOJV6F.mjs

@@ -0,0 +1,5 @@
+export { VEO_BLOCK_MIME, attachBlockDropTarget, attachDesignManipulator, createBuilderSession, initBuilderMode, startElementPicker, stopElementPicker } from './chunk-SBNT464M.mjs';
+import './chunk-JPA46JBS.mjs';
+import './chunk-PTG3BTJE.mjs';
+//# sourceMappingURL=builder-MFTOJV6F.mjs.map
+//# sourceMappingURL=builder-MFTOJV6F.mjs.map

package/dist/{builder-LSWVQYFZ.mjs.map → builder-MFTOJV6F.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"builder-LSWVQYFZ.mjs"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"builder-MFTOJV6F.mjs"}

package/dist/builder.cjs

@@ -2,6 +2,91 @@
 
 var dom = require('@floating-ui/dom');
 
+// src/plugins/builder/block-drop-target.ts
+var VEO_BLOCK_MIME = "application/x-veo-block";
+function attachBlockDropTarget(options) {
+  const { host, stepIndex, onDrop } = options;
+  const doc = host.ownerDocument;
+  let line = null;
+  let spot = null;
+  const contentEl = () => host.shadowRoot?.querySelector(".veo-guide-content") ?? null;
+  const blockChildren = (container) => Array.from(container.children).filter(
+    (el) => el instanceof HTMLElement && el.dataset.veoIdx !== void 0
+  );
+  const hideLine = () => {
+    line?.remove();
+    line = null;
+    spot = null;
+  };
+  const showLine = (at) => {
+    if (!line) {
+      line = doc.createElement("div");
+      line.style.cssText = "position:fixed;height:3px;border-radius:2px;background:#FF5B35;box-shadow:0 0 0 1px rgba(255,255,255,0.65);pointer-events:none;z-index:2147483647;";
+      host.shadowRoot?.appendChild(line);
+    }
+    line.style.left = `${at.rect.left + 4}px`;
+    line.style.width = `${Math.max(0, at.rect.width - 8)}px`;
+    line.style.top = `${at.y - 1.5}px`;
+  };
+  const isBlockDrag = (event) => {
+    const types = event.dataTransfer?.types;
+    return !!types && Array.from(types).includes(VEO_BLOCK_MIME);
+  };
+  const locate = (event) => {
+    const container = contentEl();
+    if (!container) return null;
+    const rect = container.getBoundingClientRect();
+    const kids = blockChildren(container);
+    let beforeIndex = null;
+    let y = kids.length === 0 ? rect.top + rect.height / 2 : 0;
+    for (const kid of kids) {
+      const r = kid.getBoundingClientRect();
+      if (event.clientY < r.top + r.height / 2) {
+        const idx = Number(kid.dataset.veoIdx);
+        beforeIndex = Number.isFinite(idx) ? idx : null;
+        y = r.top;
+        break;
+      }
+      y = r.bottom;
+    }
+    return { beforeIndex, y, rect };
+  };
+  const onDragOver = (event) => {
+    if (!isBlockDrag(event)) return;
+    const at = locate(event);
+    if (!at) return;
+    event.preventDefault();
+    if (event.dataTransfer) event.dataTransfer.dropEffect = "copy";
+    spot = at;
+    showLine(at);
+  };
+  const onDropEvent = (event) => {
+    if (!isBlockDrag(event)) return;
+    event.preventDefault();
+    const blockType = event.dataTransfer?.getData(VEO_BLOCK_MIME) ?? "";
+    const at = spot ?? locate(event);
+    hideLine();
+    if (!blockType || !at) return;
+    onDrop({ stepIndex, blockType, beforeIndex: at.beforeIndex });
+  };
+  const onDragLeave = (event) => {
+    const to = event.relatedTarget;
+    if (to instanceof Node && (to === host || host.contains(to))) return;
+    hideLine();
+  };
+  host.addEventListener("dragover", onDragOver);
+  host.addEventListener("drop", onDropEvent);
+  host.addEventListener("dragleave", onDragLeave);
+  return {
+    detach() {
+      host.removeEventListener("dragover", onDragOver);
+      host.removeEventListener("drop", onDropEvent);
+      host.removeEventListener("dragleave", onDragLeave);
+      hideLine();
+    }
+  };
+}
+
 // src/utils/safe-env.ts
 function hasWindow() {
   return typeof window !== "undefined";
@@ -268,7 +353,15 @@ function buildStepContent(step, doc, callbacks) {
 function buildContentNodes(step, doc) {
   const blocks = normalizeBlocks(step);
   if (blocks) {
-    return blocks.filter((b) => b.type !== "button").map((b) => buildContentBlock(b, doc)).filter((n) => n !== null);
+    const nodes2 = [];
+    for (const { block, idx } of blocks) {
+      if (block.type === "button") continue;
+      const node = buildContentBlock(block, doc);
+      if (!node) continue;
+      node.dataset.veoIdx = String(idx);
+      nodes2.push(node);
+    }
+    return nodes2;
   }
   const nodes = [];
   if (typeof step.imageUrl === "string" && step.imageUrl && isSafeUrl(step.imageUrl)) {
@@ -330,7 +423,8 @@ function renderLegacyStep(container, step, doc, callbacks) {
 }
 function normalizeBlocks(step) {
   if (!Array.isArray(step.blocks) || step.blocks.length === 0) return null;
-  const valid = step.blocks.filter((b) => {
+  const valid = step.blocks.map((block, idx) => ({ block, idx })).filter((entry) => {
+    const b = entry.block;
     if (!b || typeof b !== "object") return false;
     if (b.type === "image") return typeof b.url === "string" && isSafeUrl(b.url);
     return b.type === "title" || b.type === "text" || b.type === "button";
@@ -340,13 +434,14 @@ function normalizeBlocks(step) {
 function renderBlocks(container, blocks, doc, callbacks) {
   let i = 0;
   while (i < blocks.length) {
-    const block = blocks[i];
-    if (block?.type === "button") {
+    const entry = blocks[i];
+    if (entry?.block.type === "button") {
       const actions = doc.createElement("div");
       actions.className = "veo-guide-actions";
+      actions.dataset.veoIdx = String(entry.idx);
       let rowAlign;
-      while (i < blocks.length && blocks[i]?.type === "button") {
-        const btnBlock = blocks[i];
+      while (i < blocks.length && blocks[i]?.block.type === "button") {
+        const btnBlock = blocks[i].block;
         if (!rowAlign) {
           const a = btnBlock.style?.align;
           if (a === "left" || a === "center" || a === "right") rowAlign = a;
@@ -358,8 +453,11 @@ function renderBlocks(container, blocks, doc, callbacks) {
       container.appendChild(actions);
       continue;
     }
-    const node = buildContentBlock(block, doc);
-    if (node) container.appendChild(node);
+    const node = entry ? buildContentBlock(entry.block, doc) : null;
+    if (node && entry) {
+      node.dataset.veoIdx = String(entry.idx);
+      container.appendChild(node);
+    }
     i++;
   }
 }
@@ -1531,7 +1629,7 @@ var BannerRenderer = class extends BaseRenderer {
     const step = context.guide.guideSteps[idx];
     if (!step) return;
     const position = step.style?.position === "bottom" ? "bottom" : "top";
-    const selector = context.nav ? null : step.selector?.trim() ?? null;
+    const selector = step.selector?.trim() || null;
     let anchor = null;
     if (selector) {
       anchor = await waitForElement(selector);
@@ -3389,6 +3487,7 @@ function initBuilderMode() {
   let panel = null;
   let staticTarget = null;
   let manipulator = null;
+  let dropTarget = null;
   let pendingPreview = null;
   const getTarget = () => panel ? panel.target() : staticTarget;
   const post = (event) => {
@@ -3397,6 +3496,8 @@ function initBuilderMode() {
   const applyPreview = (cmd) => {
     manipulator?.detach();
     manipulator = null;
+    dropTarget?.detach();
+    dropTarget = null;
     const handle = previewGuide(cmd.guide);
     if (!cmd.editable) return;
     void handle.ready.then((result) => {
@@ -3415,6 +3516,11 @@ function initBuilderMode() {
           applyPreview(queued);
         }
       });
+      dropTarget = attachBlockDropTarget({
+        host,
+        stepIndex: cmd.guide.startStepIndex ?? 0,
+        onDrop: (payload) => post({ type: "block-dropped", payload })
+      });
     });
   };
   const handleCommand = (cmd) => {
@@ -3449,6 +3555,8 @@ function initBuilderMode() {
       case "close-preview":
         manipulator?.detach();
         manipulator = null;
+        dropTarget?.detach();
+        dropTarget = null;
         pendingPreview = null;
         closeGuidePreview();
         break;
@@ -3471,6 +3579,8 @@ function initBuilderMode() {
     picker = null;
     manipulator?.detach();
     manipulator = null;
+    dropTarget?.detach();
+    dropTarget = null;
     pendingPreview = null;
     closeGuidePreview();
     post({ type: "closed" });