publ-echo-test 0.0.174 → 0.0.175

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.
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  import { GridItemProps } from './types';
3
3
  import { PropsWithChildren } from '../types';
4
- declare const _default: React.MemoExoticComponent<({ children, ...props }: PropsWithChildren<GridItemProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>>;
5
- export default _default;
4
+ declare const GridItem: ({ children, ...props }: PropsWithChildren<GridItemProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
5
+ export default GridItem;
@@ -21,23 +21,12 @@ var __rest = (this && this.__rest) || function (s, e) {
21
21
  return t;
22
22
  };
23
23
  import { jsx as _jsx } from "react/jsx-runtime";
24
- import React, { useEffect, useRef, useState, useCallback, useMemo, } from 'react';
24
+ import React, { useEffect, useRef, useState, } from 'react';
25
25
  import { DraggableCore } from '../Draggable';
26
26
  import classNames from '../../external-lib/classnames';
27
27
  import { calcGridColWidth, calcGridItemPosition, calcGridItemWHPx, calcWH, calcXY, clamp, resolveRowHeight, } from './utils/calculateUtils';
28
28
  import { perc, setTopLeft, setTransform, } from '../GridLayoutEditor/utils/renderHelpers';
29
29
  import { Resizable } from '../Resizable';
30
- // throttle 함수 추가
31
- var createThrottle = function (delay) {
32
- var lastCall = 0;
33
- return function () {
34
- var now = Date.now();
35
- if (now - lastCall < delay)
36
- return false;
37
- lastCall = now;
38
- return true;
39
- };
40
- };
41
30
  var GridItem = function (_a) {
42
31
  var _b;
43
32
  var children = _a.children, props = __rest(_a, ["children"]);
@@ -50,8 +39,6 @@ var GridItem = function (_a) {
50
39
  var _r = useState(false), pointerEventsNone = _r[0], setPointerEventsNone = _r[1];
51
40
  var elementRef = useRef(null);
52
41
  var isSelected = (_b = elementRef.current) === null || _b === void 0 ? void 0 : _b.classList.contains('react-grid-item-selected');
53
- // throttle 참조 추가
54
- var throttleRef = useRef(createThrottle(16)); // 약 60fps
55
42
  useEffect(function () {
56
43
  var _a;
57
44
  if (!isSelected || !autoResize) {
@@ -155,8 +142,7 @@ var GridItem = function (_a) {
155
142
  // });
156
143
  // }
157
144
  // };
158
- // 메모이제이션된 위치 계산 함수
159
- var getPositionParams = useCallback(function (prop) {
145
+ var getPositionParams = function (prop) {
160
146
  if (prop === void 0) { prop = props; }
161
147
  return {
162
148
  cols: prop.cols,
@@ -166,10 +152,9 @@ var GridItem = function (_a) {
166
152
  maxRows: prop.maxRows,
167
153
  rowHeight: prop.rowHeight,
168
154
  };
169
- }, [props.cols, props.containerPadding, props.containerWidth, props.margin, props.maxRows, props.rowHeight]);
155
+ };
170
156
  var colWidth = customColWidth !== null && customColWidth !== void 0 ? customColWidth : calcGridColWidth(getPositionParams());
171
- // 스타일 메모이제이션
172
- var createStyle = useCallback(function (pos) {
157
+ var createStyle = function (pos) {
173
158
  var usePercentages = props.usePercentages, containerWidth = props.containerWidth, useCSSTransforms = props.useCSSTransforms;
174
159
  var style;
175
160
  if (useCSSTransforms) {
@@ -185,12 +170,8 @@ var GridItem = function (_a) {
185
170
  style.width = perc(pos.width / containerWidth);
186
171
  }
187
172
  }
188
- // 드래그나 리사이즈 중일 때만 will-change 추가
189
- if (isDragging || isResizing) {
190
- style.willChange = 'transform';
191
- }
192
173
  return style;
193
- }, [props.usePercentages, props.containerWidth, props.useCSSTransforms, isDragging, isResizing]);
174
+ };
194
175
  /**
195
176
  * Mix a Draggable instance into a child.
196
177
  * @param {Element} child Child element.
@@ -258,9 +239,6 @@ var GridItem = function (_a) {
258
239
  */
259
240
  var onDrag = function (e, _a) {
260
241
  var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
261
- // throttle 적용
262
- if (!throttleRef.current())
263
- return;
264
242
  if (!dragging) {
265
243
  throw new Error('onDrag called before onDragStart.');
266
244
  }
@@ -273,6 +251,7 @@ var GridItem = function (_a) {
273
251
  var offsetParent = node.offsetParent;
274
252
  if (offsetParent) {
275
253
  var margin = props.margin, rowHeight = props.rowHeight;
254
+ // const colWidth = calcGridColWidth(positionParams);
276
255
  var rowHeightNumber = resolveRowHeight(rowHeight, colWidth);
277
256
  var bottomBoundary = offsetParent.clientHeight -
278
257
  calcGridItemWHPx(h, rowHeightNumber, margin[1]);
@@ -283,7 +262,6 @@ var GridItem = function (_a) {
283
262
  }
284
263
  var newPosition = { top: top, left: left };
285
264
  setDragging(newPosition);
286
- // 계산 최적화
287
265
  var _b = calcXY(positionParams, top, left, w, h), x = _b.x, y = _b.y;
288
266
  props.onDrag && props.onDrag(i, x, y, { e: e, node: node, newPosition: newPosition });
289
267
  };
@@ -360,9 +338,6 @@ var GridItem = function (_a) {
360
338
  * @param {Object} callbackData an object with node and size information
361
339
  */
362
340
  var onResize = function (e, callbackData) {
363
- // throttle 적용
364
- if (!throttleRef.current())
365
- return;
366
341
  setIsResizing(true);
367
342
  onResizeHandler(e, callbackData, 'onResize');
368
343
  };
@@ -411,13 +386,10 @@ var GridItem = function (_a) {
411
386
  var _d = getResizableXYPosition(handle, w, h, prevW, prevH), newX = _d.newX, newY = _d.newY;
412
387
  handler(i, w, h, { e: e, node: node, size: size }, newX, newY);
413
388
  };
414
- // 렌더링 최적화
415
- var pos = useMemo(function () {
416
- return calcGridItemPosition(getPositionParams(), x, y, z, w, h, {
417
- dragging: dragging,
418
- resizing: resizing,
419
- }, colWidth);
420
- }, [x, y, z, w, h, dragging, resizing, colWidth, getPositionParams]);
389
+ var pos = calcGridItemPosition(getPositionParams(), x, y, z, w, h, {
390
+ dragging: dragging,
391
+ resizing: resizing,
392
+ }, colWidth);
421
393
  var child = React.Children.only(children);
422
394
  var newChild = React.cloneElement(child, {
423
395
  key: i,
@@ -443,12 +415,4 @@ var GridItem = function (_a) {
443
415
  newChild = mixinDraggable(newChild, isDraggable);
444
416
  return newChild;
445
417
  };
446
- export default React.memo(GridItem, function (prevProps, nextProps) {
447
- // 필요한 속성만 비교하여 불필요한 리렌더링 방지
448
- return (prevProps.x === nextProps.x &&
449
- prevProps.y === nextProps.y &&
450
- prevProps.w === nextProps.w &&
451
- prevProps.h === nextProps.h &&
452
- prevProps.isDraggable === nextProps.isDraggable &&
453
- prevProps.isResizable === nextProps.isResizable);
454
- });
418
+ export default GridItem;
@@ -227,7 +227,6 @@ var ReactGridLayout = function (_a) {
227
227
  i: i,
228
228
  };
229
229
  var isUserAction = true;
230
- // 레이아웃 계산 최적화
231
230
  var newLayout = isGroup
232
231
  ? layout
233
232
  : moveElement({
@@ -242,21 +241,19 @@ var ReactGridLayout = function (_a) {
242
241
  allowOverlap: allowOverlap,
243
242
  });
244
243
  if (isGroup) {
245
- // 그룹 이동 시 배치 최적화
246
- var movedItems_1 = new Map();
247
244
  oldGroupChildren.forEach(function (item) {
248
245
  var layoutItem = getLayoutItem(layout, item.i);
249
- if (!layoutItem)
250
- return;
251
- var newPos = __assign(__assign({}, layoutItem), { x: item.x + xgap, y: item.y + ygap });
252
- movedItems_1.set(item.i, newPos);
253
- });
254
- // 한 번에 레이아웃 업데이트
255
- newLayout = layout.map(function (item) {
256
- if (movedItems_1.has(item.i)) {
257
- return __assign(__assign({}, item), movedItems_1.get(item.i));
258
- }
259
- return item;
246
+ newLayout = moveElement({
247
+ layout: layout,
248
+ l: layoutItem,
249
+ x: item.x + xgap,
250
+ y: item.y + ygap,
251
+ isUserAction: isUserAction,
252
+ preventCollision: preventCollision,
253
+ compactType: compactType,
254
+ cols: cols,
255
+ allowOverlap: allowOverlap,
256
+ });
260
257
  });
261
258
  }
262
259
  props.onDrag &&
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "publ-echo-test",
3
- "version": "0.0.174",
3
+ "version": "0.0.175",
4
4
  "private": false,
5
5
  "main": "dist/lib/index.js",
6
6
  "types": "dist/lib/index.d.js",