zuljaman-banner-components 1.0.13 → 1.0.15

package/dist/components/BannerRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRenderer.d.ts","sourceRoot":"","sources":["../../src/components/BannerRenderer.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,KAAgE,MAAM,OAAO,CAAC;AAGrF,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAUvD,UAAU,mBAAmB;IAE3B,WAAW,EAAE,MAAM,CAAC;IAGpB,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAGhD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAG7B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,CAAC,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpE,oBAAoB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAG5C,oBAAoB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACvF,oBAAoB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAChE;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4lBxD,CAAC"}
+{"version":3,"file":"BannerRenderer.d.ts","sourceRoot":"","sources":["../../src/components/BannerRenderer.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,KAAgE,MAAM,OAAO,CAAC;AAGrF,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAUvD,UAAU,mBAAmB;IAE3B,WAAW,EAAE,MAAM,CAAC;IAGpB,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAGhD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAG7B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,CAAC,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpE,oBAAoB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAG5C,oBAAoB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACvF,oBAAoB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAChE;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAqnBxD,CAAC"}

package/dist/components/BannerRenderer.js

@@ -102,17 +102,6 @@ const BannerRenderer = ({ bannerStyle, copies = [], bannerSubstyle = 1, logoUrl,
     (0, react_1.useEffect)(() => {
         setAutoOffsets({});
     }, [config]);
-    // Memoize copies without rotation to prevent auto-positioning recalc on rotation changes
-    const copiesWithoutRotation = (0, react_1.useMemo)(() => {
-        return copies.map(copy => ({
-            text: copy.text,
-            styleSlot: copy.styleSlot,
-            translateX: copy.translateX,
-            translateY: copy.translateY,
-            width: copy.width,
-            // Exclude rotation from memoization
-        }));
-    }, [copies.map(c => `${c.text}-${c.styleSlot}-${c.translateX || 0}-${c.translateY || 0}-${c.width || 'auto'}`).join(',')]);
     // Auto-positioning calculation
     (0, react_1.useLayoutEffect)(() => {
         // Only calculate if auto-positioning is enabled
@@ -126,6 +115,36 @@ const BannerRenderer = ({ bannerStyle, copies = [], bannerSubstyle = 1, logoUrl,
             direction: config.autoPositioningConfig.direction,
             gapRem: config.gapRem,
         });
+        // Get anchor copy object to check if it's been dragged
+        let anchorCopy;
+        if (anchorElement === 'copy1') {
+            anchorCopy = copies.find(c => c.styleSlot === 0);
+        }
+        else if (anchorElement === 'copy2') {
+            anchorCopy = copies.find(c => c.styleSlot === 1);
+        }
+        // Get target copy object to check if it's been dragged
+        let targetCopy;
+        if (targetElement === 'copy1') {
+            targetCopy = copies.find(c => c.styleSlot === 0);
+        }
+        else if (targetElement === 'copy2') {
+            targetCopy = copies.find(c => c.styleSlot === 1);
+        }
+        // Check if anchor has been manually dragged
+        const anchorHasBeenDragged = anchorCopy && ((anchorCopy.translateX !== undefined && anchorCopy.translateX !== 0) ||
+            (anchorCopy.translateY !== undefined && anchorCopy.translateY !== 0));
+        // Check if target has been manually dragged
+        const targetHasBeenDragged = targetCopy && ((targetCopy.translateX !== undefined && targetCopy.translateX !== 0) ||
+            (targetCopy.translateY !== undefined && targetCopy.translateY !== 0));
+        // Skip auto-positioning if either anchor or target has been manually positioned
+        if (anchorHasBeenDragged || targetHasBeenDragged) {
+            console.log('⏭️ SKIPPING AUTO-POSITION - Copy has been manually dragged:', {
+                anchorDragged: anchorHasBeenDragged,
+                targetDragged: targetHasBeenDragged,
+            });
+            return;
+        }
         // Get anchor element ref
         let anchorRef = null;
         if (anchorElement === 'logo') {
@@ -218,7 +237,7 @@ const BannerRenderer = ({ bannerStyle, copies = [], bannerSubstyle = 1, logoUrl,
                 return prev; // No significant change, return same object to prevent re-render
             });
         }
-    }, [config, sizeMultiplier, recalcTrigger, copiesWithoutRotation]);
+    }, [config, recalcTrigger, copies]); // Recalculate on style/substyle change and when copy text changes (if not dragged)
     // Rotation snap function - snaps to 0°, 90°, 180°, 270°
     const handleRotationSnap = react_1.default.useCallback((angle) => {
         const snapAngles = [0, 90, 180, 270, -90, -180, -270];

package/dist/components/shared/DraggableElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableElement.d.ts","sourceRoot":"","sources":["../../../src/components/shared/DraggableElement.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IAGpB,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3D,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,UAAU,EAAE,MAAM,IAAI,CAAC;IAGvB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAG1D,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAmoB5D,CAAC"}
+{"version":3,"file":"DraggableElement.d.ts","sourceRoot":"","sources":["../../../src/components/shared/DraggableElement.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IAGpB,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3D,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,UAAU,EAAE,MAAM,IAAI,CAAC;IAGvB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAG1D,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAioB5D,CAAC"}

package/dist/components/shared/DraggableElement.js

@@ -209,18 +209,16 @@ const DraggableElement = ({ enabled, position, rotation, width, scale, elementId
             }
         };
         const handleDragEnd = () => {
+            var _a;
             console.log('[DraggableElement] Drag mouseup - ending drag');
             // If we didn't actually drag, set flag to prevent onClick from toggling
             if (!hasDraggedRef.current) {
                 justStoppedWithoutDragRef.current = true;
             }
             setIsDragging(false);
-            // Use callback form to get latest position
-            setCurrentPosition((pos) => {
-                var _a;
-                (_a = onPositionChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPositionChangeRef, pos);
-                return pos;
-            });
+            // Notify parent of final position (use ref to avoid state update during render)
+            const finalPosition = currentPositionRef.current;
+            (_a = onPositionChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPositionChangeRef, finalPosition);
             // Auto-capture width if not explicitly set
             if (widthRef.current === undefined && contentOnlyRef.current && onWidthChangeRef.current) {
                 const currentWidth = contentOnlyRef.current.offsetWidth;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zuljaman-banner-components",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "Shared banner components package for Next.js and AWS Lambda platforms",
   "main": "dist/index.js",
   "module": "dist/index.js",