veo-sdk 0.3.16 → 0.4.1

package/dist/builder.d.cts

@@ -1,5 +1,37 @@
-import { P as PreviewGuideInput } from './guide-preview-DewCTa-B.cjs';
-export { a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-DewCTa-B.cjs';
+import { P as PreviewGuideInput } from './guide-preview-D_xhRVLe.cjs';
+export { a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-D_xhRVLe.cjs';
+
+/**
+ * Manipulación DIRECTA del diseño en modo editor: arrastrar la tarjeta de una
+ * modal para posicionarla, redimensionarla desde bordes/esquinas, y arrastrar
+ * un banner para alternar top/bottom. Vive en el bundle builder (veo-builder.js)
+ * — el runtime de guías no carga nada de esto.
+ *
+ * Funciona como DECORATOR: se adjunta DESPUÉS del render sobre el shadow root
+ * abierto del host de la guía (no toca los renderers). Durante el gesto aplica
+ * las variables CSS localmente (feedback a 60fps, sin postMessage); al soltar
+ * (`pointerup`) emite UN `onCommit(patch)` con los valores finales, que el
+ * builder-mode postea al panel como `design-updated`. El panel actualiza su
+ * estado y re-manda `preview` — que entra por el update in-place con las
+ * MISMAS variables → no hay loop ni parpadeo.
+ *
+ * Geometría del modal (ver styles.ts): la card usa `left: posX%` +
+ * `translate(-posX%)`, o sea `cardLeft = posX * (viewportW - cardW)` →
+ * `posX = cardLeft / (viewportW - cardW)`. Mismo modelo que serializa el
+ * dashboard (`style.posX/posY` en 0..1) y consume `applyDesignVars`.
+ */
+
+/** Merge superficial sobre `step.style` del paso activo (lo aplica el panel). */
+interface DesignPatch {
+    stepIndex: number;
+    style: {
+        posX?: number;
+        posY?: number;
+        width?: number;
+        height?: number;
+        position?: 'top' | 'bottom';
+    };
+}
 
 /**
  * Element picker — el "inspeccionar" del navegador, pero del SDK. Corre
@@ -86,6 +118,9 @@ type BuilderEvent = {
     payload: PickedElement;
 } | {
     type: 'pick-cancelled';
+} | {
+    type: 'design-updated';
+    payload: DesignPatch;
 } | {
     type: 'closed';
 };
@@ -99,6 +134,7 @@ type BuilderCommand = {
 } | {
     type: 'preview';
     guide: PreviewGuideInput;
+    editable?: boolean;
 } | {
     type: 'close-preview';
 } | {

package/dist/builder.d.ts

@@ -1,5 +1,37 @@
-import { P as PreviewGuideInput } from './guide-preview-DewCTa-B.js';
-export { a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-DewCTa-B.js';
+import { P as PreviewGuideInput } from './guide-preview-D_xhRVLe.js';
+export { a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-D_xhRVLe.js';
+
+/**
+ * Manipulación DIRECTA del diseño en modo editor: arrastrar la tarjeta de una
+ * modal para posicionarla, redimensionarla desde bordes/esquinas, y arrastrar
+ * un banner para alternar top/bottom. Vive en el bundle builder (veo-builder.js)
+ * — el runtime de guías no carga nada de esto.
+ *
+ * Funciona como DECORATOR: se adjunta DESPUÉS del render sobre el shadow root
+ * abierto del host de la guía (no toca los renderers). Durante el gesto aplica
+ * las variables CSS localmente (feedback a 60fps, sin postMessage); al soltar
+ * (`pointerup`) emite UN `onCommit(patch)` con los valores finales, que el
+ * builder-mode postea al panel como `design-updated`. El panel actualiza su
+ * estado y re-manda `preview` — que entra por el update in-place con las
+ * MISMAS variables → no hay loop ni parpadeo.
+ *
+ * Geometría del modal (ver styles.ts): la card usa `left: posX%` +
+ * `translate(-posX%)`, o sea `cardLeft = posX * (viewportW - cardW)` →
+ * `posX = cardLeft / (viewportW - cardW)`. Mismo modelo que serializa el
+ * dashboard (`style.posX/posY` en 0..1) y consume `applyDesignVars`.
+ */
+
+/** Merge superficial sobre `step.style` del paso activo (lo aplica el panel). */
+interface DesignPatch {
+    stepIndex: number;
+    style: {
+        posX?: number;
+        posY?: number;
+        width?: number;
+        height?: number;
+        position?: 'top' | 'bottom';
+    };
+}
 
 /**
  * Element picker — el "inspeccionar" del navegador, pero del SDK. Corre
@@ -86,6 +118,9 @@ type BuilderEvent = {
     payload: PickedElement;
 } | {
     type: 'pick-cancelled';
+} | {
+    type: 'design-updated';
+    payload: DesignPatch;
 } | {
     type: 'closed';
 };
@@ -99,6 +134,7 @@ type BuilderCommand = {
 } | {
     type: 'preview';
     guide: PreviewGuideInput;
+    editable?: boolean;
 } | {
     type: 'close-preview';
 } | {

package/dist/builder.mjs

@@ -1,7 +1,7 @@
-import './chunk-IEHGG5NL.mjs';
-import { initBuilderMode } from './chunk-QCIT7CGE.mjs';
-export { createBuilderSession, initBuilderMode, startElementPicker, stopElementPicker } from './chunk-QCIT7CGE.mjs';
-export { closeGuidePreview, previewGuide } from './chunk-YHUPUTWH.mjs';
+import './chunk-KLN46YQI.mjs';
+import { initBuilderMode } from './chunk-ULH64GMX.mjs';
+export { createBuilderSession, initBuilderMode, startElementPicker, stopElementPicker } from './chunk-ULH64GMX.mjs';
+export { closeGuidePreview, previewGuide } from './chunk-F2ZWZUTR.mjs';
 import './chunk-PTG3BTJE.mjs';
 
 // src/builder.ts