zuljaman-banner-components 1.0.7 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/components/shared/DraggableElement.d.ts.map +1 -1
  2. package/dist/components/shared/DraggableElement.js +193 -162
  3. package/package.json +2 -3
package/dist/components/shared/DraggableElement.d.ts.map CHANGED
@@ -1 +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;AAG1B,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,CAqf5D,CAAC"}
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,CAqhB5D,CAAC"}
package/dist/components/shared/DraggableElement.js CHANGED
@@ -11,12 +11,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
11
11
  exports.DraggableElement = void 0;
12
12
  const jsx_runtime_1 = require("react/jsx-runtime");
13
13
  const react_1 = __importDefault(require("react"));
14
- const react_draggable_1 = __importDefault(require("react-draggable"));
15
14
  const DraggableElement = ({ enabled, position, rotation, width, scale, elementId, isSelected, onPositionChange, onRotationChange, onWidthChange, onSelect, onDeselect, onRotationSnap, onDragMove, centerOrigin = false, children, }) => {
16
15
  const [isDragging, setIsDragging] = react_1.default.useState(false);
17
16
  const [isRotating, setIsRotating] = react_1.default.useState(false);
18
17
  const [isResizing, setIsResizing] = react_1.default.useState(false);
19
18
  const [resizeSide, setResizeSide] = react_1.default.useState(null);
19
+ const [currentPosition, setCurrentPosition] = react_1.default.useState(position);
20
20
  const elementRef = react_1.default.useRef(null);
21
21
  const rotatingContentRef = react_1.default.useRef(null);
22
22
  const contentOnlyRef = react_1.default.useRef(null);
@@ -32,9 +32,13 @@ const DraggableElement = ({ enabled, position, rotation, width, scale, elementId
32
32
  const mouseDownPosRef = react_1.default.useRef(null);
33
33
  const justSelectedRef = react_1.default.useRef(false);
34
34
  const justStoppedWithoutDragRef = react_1.default.useRef(false);
35
+ const dragStartPosRef = react_1.default.useRef({ x: 0, y: 0 });
35
36
  react_1.default.useEffect(() => {
36
37
  currentRotationRef.current = rotation;
37
38
  }, [rotation]);
39
+ react_1.default.useEffect(() => {
40
+ setCurrentPosition(position);
41
+ }, [position]);
38
42
  if (!enabled) {
39
43
  return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
40
44
  }
@@ -151,6 +155,62 @@ const DraggableElement = ({ enabled, position, rotation, width, scale, elementId
151
155
  };
152
156
  }
153
157
  }, [isResizing, resizeSide]);
158
+ // Drag handlers
159
+ const handleDragStart = (e) => {
160
+ const target = e.target;
161
+ if (target.closest('.rotation-handle') || target.closest('.width-handle')) {
162
+ return;
163
+ }
164
+ // Auto-select element when starting to drag
165
+ if (!isSelected) {
166
+ onSelect(elementId);
167
+ }
168
+ hasDraggedRef.current = false;
169
+ dragStartPosRef.current = { x: e.clientX, y: e.clientY };
170
+ startPositionRef.current = { x: currentPosition.x, y: currentPosition.y };
171
+ setIsDragging(true);
172
+ };
173
+ const handleDragMove = (e) => {
174
+ if (!isDragging)
175
+ return;
176
+ hasDraggedRef.current = true;
177
+ const deltaX = (e.clientX - dragStartPosRef.current.x) / scale;
178
+ const deltaY = (e.clientY - dragStartPosRef.current.y) / scale;
179
+ const newPosition = {
180
+ x: startPositionRef.current.x + deltaX,
181
+ y: startPositionRef.current.y + deltaY,
182
+ };
183
+ setCurrentPosition(newPosition);
184
+ if (contentOnlyRef.current && onDragMove) {
185
+ const elementBounds = contentOnlyRef.current.getBoundingClientRect();
186
+ onDragMove(elementId, elementBounds);
187
+ }
188
+ };
189
+ const handleDragEnd = () => {
190
+ // If we didn't actually drag, set flag to prevent onClick from toggling
191
+ if (!hasDraggedRef.current) {
192
+ justStoppedWithoutDragRef.current = true;
193
+ }
194
+ setIsDragging(false);
195
+ onPositionChange === null || onPositionChange === void 0 ? void 0 : onPositionChange(currentPosition);
196
+ // Auto-capture width if not explicitly set
197
+ if (width === undefined && contentOnlyRef.current && onWidthChange) {
198
+ const currentWidth = contentOnlyRef.current.offsetWidth;
199
+ if (currentWidth > 0) {
200
+ onWidthChange(Math.round(currentWidth));
201
+ }
202
+ }
203
+ };
204
+ react_1.default.useEffect(() => {
205
+ if (isDragging) {
206
+ window.addEventListener('mousemove', handleDragMove);
207
+ window.addEventListener('mouseup', handleDragEnd);
208
+ return () => {
209
+ window.removeEventListener('mousemove', handleDragMove);
210
+ window.removeEventListener('mouseup', handleDragEnd);
211
+ };
212
+ }
213
+ }, [isDragging, currentPosition, scale]);
154
214
  // Selection handlers
155
215
  const handleElementClick = (e) => {
156
216
  // Don't toggle selection if clicking rotation or width handles
@@ -196,172 +256,143 @@ const DraggableElement = ({ enabled, position, rotation, width, scale, elementId
196
256
  document.removeEventListener('click', handleClickOutside);
197
257
  };
198
258
  }, [isSelected, onDeselect]);
199
- return ((0, jsx_runtime_1.jsx)(react_draggable_1.default, { position: position, disabled: false, onStart: (e) => {
259
+ return ((0, jsx_runtime_1.jsx)("div", { ref: elementRef, onClick: handleElementClick, onMouseDown: (e) => {
260
+ // Track mouse down position for click detection
200
261
  const target = e.target;
201
262
  if (target.closest('.rotation-handle') || target.closest('.width-handle')) {
202
- return false;
203
- }
204
- // Auto-select element when starting to drag
205
- if (!isSelected) {
206
- onSelect(elementId);
207
- }
208
- hasDraggedRef.current = false;
209
- setIsDragging(true);
210
- }, onDrag: (_e, _data) => {
211
- hasDraggedRef.current = true;
212
- if (contentOnlyRef.current && onDragMove) {
213
- const elementBounds = contentOnlyRef.current.getBoundingClientRect();
214
- onDragMove(elementId, elementBounds);
263
+ mouseDownPosRef.current = null;
264
+ return;
215
265
  }
216
- }, onStop: (_e, data) => {
217
- // If we didn't actually drag, set flag to prevent onClick from toggling
218
- if (!hasDraggedRef.current) {
219
- justStoppedWithoutDragRef.current = true;
220
- }
221
- setIsDragging(false);
222
- onPositionChange === null || onPositionChange === void 0 ? void 0 : onPositionChange({ x: data.x, y: data.y });
223
- // Auto-capture width if not explicitly set
224
- if (width === undefined && contentOnlyRef.current && onWidthChange) {
225
- const currentWidth = contentOnlyRef.current.offsetWidth;
226
- if (currentWidth > 0) {
227
- onWidthChange(Math.round(currentWidth));
228
- }
266
+ mouseDownPosRef.current = { x: e.clientX, y: e.clientY };
267
+ handleDragStart(e);
268
+ }, onMouseUp: (e) => {
269
+ // Detect click (mouse up at same position as mouse down)
270
+ const target = e.target;
271
+ if (target.closest('.rotation-handle') || target.closest('.width-handle')) {
272
+ return;
229
273
  }
230
- }, scale: scale, cancel: ".rotation-handle, .width-handle", children: (0, jsx_runtime_1.jsx)("div", { ref: elementRef, onClick: handleElementClick, onMouseDown: (e) => {
231
- // Track mouse down position for click detection
232
- const target = e.target;
233
- if (target.closest('.rotation-handle') || target.closest('.width-handle')) {
234
- mouseDownPosRef.current = null;
235
- return;
236
- }
237
- mouseDownPosRef.current = { x: e.clientX, y: e.clientY };
238
- }, onMouseUp: (e) => {
239
- // Detect click (mouse up at same position as mouse down)
240
- const target = e.target;
241
- if (target.closest('.rotation-handle') || target.closest('.width-handle')) {
242
- return;
243
- }
244
- if (mouseDownPosRef.current) {
245
- const deltaX = Math.abs(e.clientX - mouseDownPosRef.current.x);
246
- const deltaY = Math.abs(e.clientY - mouseDownPosRef.current.y);
247
- // If mouse hasn't moved much (less than 5px), treat as click
248
- if (deltaX < 5 && deltaY < 5) {
249
- e.preventDefault();
250
- e.stopPropagation();
251
- if (!isSelected) {
252
- onSelect(elementId);
253
- }
254
- else {
255
- // Toggle off if already selected
256
- onDeselect();
257
- }
258
- justSelectedRef.current = true; // Mark that we just selected
274
+ if (mouseDownPosRef.current) {
275
+ const deltaX = Math.abs(e.clientX - mouseDownPosRef.current.x);
276
+ const deltaY = Math.abs(e.clientY - mouseDownPosRef.current.y);
277
+ // If mouse hasn't moved much (less than 5px), treat as click
278
+ if (deltaX < 5 && deltaY < 5) {
279
+ e.preventDefault();
280
+ e.stopPropagation();
281
+ if (!isSelected) {
282
+ onSelect(elementId);
259
283
  }
260
- mouseDownPosRef.current = null;
284
+ else {
285
+ // Toggle off if already selected
286
+ onDeselect();
287
+ }
288
+ justSelectedRef.current = true; // Mark that we just selected
261
289
  }
262
- }, style: {
263
- cursor: isDragging ? "move" : "grab",
264
- opacity: isDragging || isRotating || isResizing ? 0.8 : 1,
265
- transition: isDragging || isRotating || isResizing ? "none" : "opacity 0.2s ease",
266
- display: "inline-block",
267
- position: "relative",
268
- }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
269
- transform: centerOrigin ? 'translate(-50%, -50%)' : undefined,
270
- position: "relative"
271
- }, children: [(isDragging || isRotating || isResizing) && ((0, jsx_runtime_1.jsx)("div", { style: {
272
- position: "absolute",
273
- inset: "-8px",
274
- border: "2px dashed rgba(59, 130, 246, 0.5)",
275
- zIndex: 0,
276
- pointerEvents: "none",
277
- } })), (0, jsx_runtime_1.jsxs)("div", { ref: rotatingContentRef, style: { transform: `rotate(${rotation}deg)`, position: "relative", display: "inline-block" }, children: [isSelected && ((0, jsx_runtime_1.jsx)("div", { style: {
278
- position: "absolute",
279
- inset: 0,
280
- border: "4px dotted rgba(59, 130, 246, 1)",
281
- zIndex: 1,
282
- pointerEvents: "none",
283
- } })), onRotationChange && isSelected && ((0, jsx_runtime_1.jsx)("div", { ref: blueHandleRef, className: "rotation-handle", onMouseDown: handleRotationStart, style: {
284
- position: "absolute",
285
- top: "-16px",
286
- right: "-16px",
287
- width: "32px",
288
- height: "32px",
289
- borderRadius: "50%",
290
- backgroundColor: "rgba(59, 130, 246, 0.9)",
291
- border: "2px solid white",
292
- cursor: "grab",
293
- display: "flex",
294
- alignItems: "center",
295
- justifyContent: "center",
296
- fontSize: "16px",
297
- lineHeight: "1",
298
- color: "white",
299
- zIndex: 1000,
300
- boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
301
- transform: `rotate(${-rotation}deg)`,
302
- transformOrigin: "center center",
303
- }, title: "Drag to rotate", children: "\u21BB" })), onRotationChange && isSelected && ((0, jsx_runtime_1.jsx)("div", { ref: purpleIndicatorRef, style: {
304
- position: "absolute",
305
- top: "-16px",
306
- right: "-16px",
307
- width: "32px",
308
- height: "32px",
309
- borderRadius: "50%",
310
- backgroundColor: "rgba(139, 92, 246, 0.9)",
311
- border: "2px solid white",
312
- display: "flex",
313
- alignItems: "center",
314
- justifyContent: "center",
315
- fontSize: "16px",
316
- lineHeight: "1",
317
- color: "white",
318
- zIndex: 999,
319
- boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
320
- pointerEvents: "none",
321
- }, title: "Rotation indicator", children: "\u21BB" })), isSelected && ((0, jsx_runtime_1.jsx)("div", { className: "width-handle width-handle-left", onMouseDown: (e) => handleResizeStart(e, 'left'), style: {
322
- position: "absolute",
323
- left: "-16px",
324
- top: "50%",
325
- transform: `translateY(-50%) rotate(${-rotation}deg)`,
326
- transformOrigin: "center center",
327
- width: "32px",
328
- height: "32px",
329
- borderRadius: "50%",
330
- backgroundColor: "rgba(16, 185, 129, 0.9)",
331
- border: "2px solid white",
332
- cursor: "ew-resize",
333
- display: "flex",
334
- alignItems: "center",
335
- justifyContent: "center",
336
- fontSize: "16px",
337
- lineHeight: "1",
338
- color: "white",
339
- zIndex: 1000,
340
- boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
341
- }, title: "Drag to resize width", children: "\u27F7" })), isSelected && ((0, jsx_runtime_1.jsx)("div", { className: "width-handle width-handle-right", onMouseDown: (e) => handleResizeStart(e, 'right'), style: {
342
- position: "absolute",
343
- right: "-16px",
344
- top: "50%",
345
- transform: `translateY(-50%) rotate(${-rotation}deg)`,
346
- transformOrigin: "center center",
347
- width: "32px",
348
- height: "32px",
349
- borderRadius: "50%",
350
- backgroundColor: "rgba(16, 185, 129, 0.9)",
351
- border: "2px solid white",
352
- cursor: "ew-resize",
353
- display: "flex",
354
- alignItems: "center",
355
- justifyContent: "center",
356
- fontSize: "16px",
357
- lineHeight: "1",
358
- color: "white",
359
- zIndex: 1000,
360
- boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
361
- }, title: "Drag to resize width", children: "\u27F7" })), (0, jsx_runtime_1.jsx)("div", { ref: contentOnlyRef, style: {
362
- position: "relative",
363
- zIndex: 1,
364
- width: width ? `${width}px` : undefined,
365
- }, children: children })] })] }) }) }));
290
+ mouseDownPosRef.current = null;
291
+ }
292
+ }, style: {
293
+ cursor: isDragging ? "move" : "grab",
294
+ opacity: isDragging || isRotating || isResizing ? 0.8 : 1,
295
+ transition: isDragging || isRotating || isResizing ? "none" : "opacity 0.2s ease",
296
+ display: "inline-block",
297
+ position: "relative",
298
+ transform: `translate(${currentPosition.x}px, ${currentPosition.y}px)`,
299
+ }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
300
+ transform: centerOrigin ? 'translate(-50%, -50%)' : undefined,
301
+ position: "relative"
302
+ }, children: [(isDragging || isRotating || isResizing) && ((0, jsx_runtime_1.jsx)("div", { style: {
303
+ position: "absolute",
304
+ inset: "-8px",
305
+ border: "2px dashed rgba(59, 130, 246, 0.5)",
306
+ zIndex: 0,
307
+ pointerEvents: "none",
308
+ } })), (0, jsx_runtime_1.jsxs)("div", { ref: rotatingContentRef, style: { transform: `rotate(${rotation}deg)`, position: "relative", display: "inline-block" }, children: [isSelected && ((0, jsx_runtime_1.jsx)("div", { style: {
309
+ position: "absolute",
310
+ inset: 0,
311
+ border: "4px dotted rgba(59, 130, 246, 1)",
312
+ zIndex: 1,
313
+ pointerEvents: "none",
314
+ } })), onRotationChange && isSelected && ((0, jsx_runtime_1.jsx)("div", { ref: blueHandleRef, className: "rotation-handle", onMouseDown: handleRotationStart, style: {
315
+ position: "absolute",
316
+ top: "-16px",
317
+ right: "-16px",
318
+ width: "32px",
319
+ height: "32px",
320
+ borderRadius: "50%",
321
+ backgroundColor: "rgba(59, 130, 246, 0.9)",
322
+ border: "2px solid white",
323
+ cursor: "grab",
324
+ display: "flex",
325
+ alignItems: "center",
326
+ justifyContent: "center",
327
+ fontSize: "16px",
328
+ lineHeight: "1",
329
+ color: "white",
330
+ zIndex: 1000,
331
+ boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
332
+ transform: `rotate(${-rotation}deg)`,
333
+ transformOrigin: "center center",
334
+ }, title: "Drag to rotate", children: "\u21BB" })), onRotationChange && isSelected && ((0, jsx_runtime_1.jsx)("div", { ref: purpleIndicatorRef, style: {
335
+ position: "absolute",
336
+ top: "-16px",
337
+ right: "-16px",
338
+ width: "32px",
339
+ height: "32px",
340
+ borderRadius: "50%",
341
+ backgroundColor: "rgba(139, 92, 246, 0.9)",
342
+ border: "2px solid white",
343
+ display: "flex",
344
+ alignItems: "center",
345
+ justifyContent: "center",
346
+ fontSize: "16px",
347
+ lineHeight: "1",
348
+ color: "white",
349
+ zIndex: 999,
350
+ boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
351
+ pointerEvents: "none",
352
+ }, title: "Rotation indicator", children: "\u21BB" })), isSelected && ((0, jsx_runtime_1.jsx)("div", { className: "width-handle width-handle-left", onMouseDown: (e) => handleResizeStart(e, 'left'), style: {
353
+ position: "absolute",
354
+ left: "-16px",
355
+ top: "50%",
356
+ transform: `translateY(-50%) rotate(${-rotation}deg)`,
357
+ transformOrigin: "center center",
358
+ width: "32px",
359
+ height: "32px",
360
+ borderRadius: "50%",
361
+ backgroundColor: "rgba(16, 185, 129, 0.9)",
362
+ border: "2px solid white",
363
+ cursor: "ew-resize",
364
+ display: "flex",
365
+ alignItems: "center",
366
+ justifyContent: "center",
367
+ fontSize: "16px",
368
+ lineHeight: "1",
369
+ color: "white",
370
+ zIndex: 1000,
371
+ boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
372
+ }, title: "Drag to resize width", children: "\u27F7" })), isSelected && ((0, jsx_runtime_1.jsx)("div", { className: "width-handle width-handle-right", onMouseDown: (e) => handleResizeStart(e, 'right'), style: {
373
+ position: "absolute",
374
+ right: "-16px",
375
+ top: "50%",
376
+ transform: `translateY(-50%) rotate(${-rotation}deg)`,
377
+ transformOrigin: "center center",
378
+ width: "32px",
379
+ height: "32px",
380
+ borderRadius: "50%",
381
+ backgroundColor: "rgba(16, 185, 129, 0.9)",
382
+ border: "2px solid white",
383
+ cursor: "ew-resize",
384
+ display: "flex",
385
+ alignItems: "center",
386
+ justifyContent: "center",
387
+ fontSize: "16px",
388
+ lineHeight: "1",
389
+ color: "white",
390
+ zIndex: 1000,
391
+ boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
392
+ }, title: "Drag to resize width", children: "\u27F7" })), (0, jsx_runtime_1.jsx)("div", { ref: contentOnlyRef, style: {
393
+ position: "relative",
394
+ zIndex: 1,
395
+ width: width ? `${width}px` : undefined,
396
+ }, children: children })] })] }) }));
366
397
  };
367
398
  exports.DraggableElement = DraggableElement;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zuljaman-banner-components",
3
- "version": "1.0.7",
3
+ "version": "1.0.8",
4
4
  "description": "Shared banner components package for Next.js and AWS Lambda platforms",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -45,8 +45,7 @@
45
45
  "dependencies": {
46
46
  "clsx": "^2.1.1",
47
47
  "react": "^19.0.0",
48
- "react-dom": "^19.0.0",
49
- "react-draggable": "^4.5.0"
48
+ "react-dom": "^19.0.0"
50
49
  },
51
50
  "peerDependencies": {
52
51
  "next": ">=14.0.0"