publ-echo-test 0.0.174 → 0.0.176

package/dist/lib/GridItem/GridItem.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { GridItemProps } from './types';
 import { PropsWithChildren } from '../types';
-declare const _default: React.MemoExoticComponent<({ children, ...props }: PropsWithChildren<GridItemProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>>;
-export default _default;
+declare const GridItem: ({ children, ...props }: PropsWithChildren<GridItemProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export default GridItem;

package/dist/lib/GridItem/GridItem.js

@@ -21,23 +21,12 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { useEffect, useRef, useState, useCallback, useMemo, } from 'react';
+import React, { useEffect, useRef, useState, } from 'react';
 import { DraggableCore } from '../Draggable';
 import classNames from '../../external-lib/classnames';
 import { calcGridColWidth, calcGridItemPosition, calcGridItemWHPx, calcWH, calcXY, clamp, resolveRowHeight, } from './utils/calculateUtils';
 import { perc, setTopLeft, setTransform, } from '../GridLayoutEditor/utils/renderHelpers';
 import { Resizable } from '../Resizable';
-// throttle 함수 추가
-var createThrottle = function (delay) {
-    var lastCall = 0;
-    return function () {
-        var now = Date.now();
-        if (now - lastCall < delay)
-            return false;
-        lastCall = now;
-        return true;
-    };
-};
 var GridItem = function (_a) {
     var _b;
     var children = _a.children, props = __rest(_a, ["children"]);
@@ -50,8 +39,6 @@ var GridItem = function (_a) {
     var _r = useState(false), pointerEventsNone = _r[0], setPointerEventsNone = _r[1];
     var elementRef = useRef(null);
     var isSelected = (_b = elementRef.current) === null || _b === void 0 ? void 0 : _b.classList.contains('react-grid-item-selected');
-    // throttle 참조 추가
-    var throttleRef = useRef(createThrottle(16)); // 약 60fps
     useEffect(function () {
         var _a;
         if (!isSelected || !autoResize) {
@@ -155,8 +142,7 @@ var GridItem = function (_a) {
     //     });
     //   }
     // };
-    // 메모이제이션된 위치 계산 함수
-    var getPositionParams = useCallback(function (prop) {
+    var getPositionParams = function (prop) {
         if (prop === void 0) { prop = props; }
         return {
             cols: prop.cols,
@@ -166,10 +152,9 @@ var GridItem = function (_a) {
             maxRows: prop.maxRows,
             rowHeight: prop.rowHeight,
         };
-    }, [props.cols, props.containerPadding, props.containerWidth, props.margin, props.maxRows, props.rowHeight]);
+    };
     var colWidth = customColWidth !== null && customColWidth !== void 0 ? customColWidth : calcGridColWidth(getPositionParams());
-    // 스타일 메모이제이션
-    var createStyle = useCallback(function (pos) {
+    var createStyle = function (pos) {
         var usePercentages = props.usePercentages, containerWidth = props.containerWidth, useCSSTransforms = props.useCSSTransforms;
         var style;
         if (useCSSTransforms) {
@@ -185,12 +170,8 @@ var GridItem = function (_a) {
                 style.width = perc(pos.width / containerWidth);
             }
         }
-        // 드래그나 리사이즈 중일 때만 will-change 추가
-        if (isDragging || isResizing) {
-            style.willChange = 'transform';
-        }
         return style;
-    }, [props.usePercentages, props.containerWidth, props.useCSSTransforms, isDragging, isResizing]);
+    };
     /**
      * Mix a Draggable instance into a child.
      * @param  {Element} child    Child element.
@@ -258,9 +239,6 @@ var GridItem = function (_a) {
      */
     var onDrag = function (e, _a) {
         var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
-        // throttle 적용
-        if (!throttleRef.current())
-            return;
         if (!dragging) {
             throw new Error('onDrag called before onDragStart.');
         }
@@ -273,6 +251,7 @@ var GridItem = function (_a) {
             var offsetParent = node.offsetParent;
             if (offsetParent) {
                 var margin = props.margin, rowHeight = props.rowHeight;
+                // const colWidth =  calcGridColWidth(positionParams);
                 var rowHeightNumber = resolveRowHeight(rowHeight, colWidth);
                 var bottomBoundary = offsetParent.clientHeight -
                     calcGridItemWHPx(h, rowHeightNumber, margin[1]);
@@ -283,7 +262,6 @@ var GridItem = function (_a) {
         }
         var newPosition = { top: top, left: left };
         setDragging(newPosition);
-        // 계산 최적화
         var _b = calcXY(positionParams, top, left, w, h), x = _b.x, y = _b.y;
         props.onDrag && props.onDrag(i, x, y, { e: e, node: node, newPosition: newPosition });
     };
@@ -360,9 +338,6 @@ var GridItem = function (_a) {
      * @param  {Object} callbackData  an object with node and size information
      */
     var onResize = function (e, callbackData) {
-        // throttle 적용
-        if (!throttleRef.current())
-            return;
         setIsResizing(true);
         onResizeHandler(e, callbackData, 'onResize');
     };
@@ -411,13 +386,10 @@ var GridItem = function (_a) {
         var _d = getResizableXYPosition(handle, w, h, prevW, prevH), newX = _d.newX, newY = _d.newY;
         handler(i, w, h, { e: e, node: node, size: size }, newX, newY);
     };
-    // 렌더링 최적화
-    var pos = useMemo(function () {
-        return calcGridItemPosition(getPositionParams(), x, y, z, w, h, {
-            dragging: dragging,
-            resizing: resizing,
-        }, colWidth);
-    }, [x, y, z, w, h, dragging, resizing, colWidth, getPositionParams]);
+    var pos = calcGridItemPosition(getPositionParams(), x, y, z, w, h, {
+        dragging: dragging,
+        resizing: resizing,
+    }, colWidth);
     var child = React.Children.only(children);
     var newChild = React.cloneElement(child, {
         key: i,
@@ -443,12 +415,4 @@ var GridItem = function (_a) {
     newChild = mixinDraggable(newChild, isDraggable);
     return newChild;
 };
-export default React.memo(GridItem, function (prevProps, nextProps) {
-    // 필요한 속성만 비교하여 불필요한 리렌더링 방지
-    return (prevProps.x === nextProps.x &&
-        prevProps.y === nextProps.y &&
-        prevProps.w === nextProps.w &&
-        prevProps.h === nextProps.h &&
-        prevProps.isDraggable === nextProps.isDraggable &&
-        prevProps.isResizable === nextProps.isResizable);
-});
+export default GridItem;

package/dist/lib/GridItem/OutsideClickHandler.js

@@ -18,6 +18,6 @@ var OutsideClickHandler = function (_a) {
             document.removeEventListener('dblclick', handleClickOutside);
         };
     }, [onOutsideClick]);
-    return _jsx("div", { ref: wrapperRef, children: children });
+    return _jsx("div", { ref: wrapperRef, className: 'outside-click-wrapper', children: children });
 };
 export default OutsideClickHandler;

package/dist/lib/GridLayoutEditor/ReactGridLayout.js

@@ -227,7 +227,6 @@ var ReactGridLayout = function (_a) {
             i: i,
         };
         var isUserAction = true;
-        // 레이아웃 계산 최적화
         var newLayout = isGroup
             ? layout
             : moveElement({
@@ -242,21 +241,19 @@ var ReactGridLayout = function (_a) {
                 allowOverlap: allowOverlap,
             });
         if (isGroup) {
-            // 그룹 이동 시 배치 최적화
-            var movedItems_1 = new Map();
             oldGroupChildren.forEach(function (item) {
                 var layoutItem = getLayoutItem(layout, item.i);
-                if (!layoutItem)
-                    return;
-                var newPos = __assign(__assign({}, layoutItem), { x: item.x + xgap, y: item.y + ygap });
-                movedItems_1.set(item.i, newPos);
-            });
-            // 한 번에 레이아웃 업데이트
-            newLayout = layout.map(function (item) {
-                if (movedItems_1.has(item.i)) {
-                    return __assign(__assign({}, item), movedItems_1.get(item.i));
-                }
-                return item;
+                newLayout = moveElement({
+                    layout: layout,
+                    l: layoutItem,
+                    x: item.x + xgap,
+                    y: item.y + ygap,
+                    isUserAction: isUserAction,
+                    preventCollision: preventCollision,
+                    compactType: compactType,
+                    cols: cols,
+                    allowOverlap: allowOverlap,
+                });
             });
         }
         props.onDrag &&

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "publ-echo-test",
-  "version": "0.0.174",
+  "version": "0.0.176",
   "private": false,
   "main": "dist/lib/index.js",
   "types": "dist/lib/index.d.js",