publ-echo-test 0.0.34 → 0.0.36

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.
@@ -93,11 +93,6 @@ var DraggableCore = function (_a) {
93
93
  var _a, _b;
94
94
  return (_b = (_a = props === null || props === void 0 ? void 0 : props.nodeRef) === null || _a === void 0 ? void 0 : _a.current) !== null && _b !== void 0 ? _b : draggableCoreRef === null || draggableCoreRef === void 0 ? void 0 : draggableCoreRef.current;
95
95
  };
96
- var findChildrenNode = function () {
97
- var _a;
98
- console.log(props.nodeRef);
99
- return (_a = props === null || props === void 0 ? void 0 : props.nodeRef) === null || _a === void 0 ? void 0 : _a.current;
100
- };
101
96
  // NOTE - event 발생 시 {x, y} position을 가져오는 함수
102
97
  var getControlPosition = function (e, touchIdentifier) {
103
98
  var _a;
@@ -187,7 +182,6 @@ var DraggableCore = function (_a) {
187
182
  setDraggableCoreState(function (prev) { return (__assign(__assign({}, prev), { dragging: true, lastX: x, lastY: y })); });
188
183
  }
189
184
  function handleDrag(e) {
190
- // console.log(e.currentTarget)
191
185
  var _a;
192
186
  var position = getControlPosition(e, draggableCoreState.touchIdentifier);
193
187
  if (!position)
@@ -204,7 +198,6 @@ var DraggableCore = function (_a) {
204
198
  }
205
199
  var coreEvent = createCoreData(x, y);
206
200
  var thisNode = findDOMNode();
207
- // const children = findChildrenNode()
208
201
  if (!coreEvent || !thisNode)
209
202
  return;
210
203
  var shouldUpdate = onDrag(e, coreEvent, thisNode);
@@ -47,12 +47,17 @@ var GridItem = function (_a) {
47
47
  if (!targetNode || isDragging || isResizing) {
48
48
  return;
49
49
  }
50
+ var prevPaddingL = parseFloat(getComputedStyle(targetNode).paddingLeft);
51
+ var prevPaddingR = parseFloat(getComputedStyle(targetNode).paddingRight);
52
+ var prevPaddingT = parseFloat(getComputedStyle(targetNode).paddingTop);
53
+ var prevPaddingB = parseFloat(getComputedStyle(targetNode).paddingBottom);
50
54
  // MutationObserver 콜백 함수
51
55
  var callback = function (mutationsList) {
52
56
  for (var _i = 0, mutationsList_1 = mutationsList; _i < mutationsList_1.length; _i++) {
53
57
  var mutation = mutationsList_1[_i];
54
58
  var isCharacterChanged = mutation.type === 'characterData';
55
59
  var keepWidth = true;
60
+ var hasPaddingChanged = false;
56
61
  var height = isCharacterChanged ? mutation.target.parentNode.clientHeight : mutation.target.clientHeight;
57
62
  var width = targetNode.clientWidth;
58
63
  if (!isCharacterChanged && mutation.target instanceof Element) {
@@ -61,6 +66,14 @@ var GridItem = function (_a) {
61
66
  if (minWidth > width) {
62
67
  keepWidth = false;
63
68
  }
69
+ // NOTE: POC
70
+ var paddingL = parseFloat(styles.paddingLeft);
71
+ var paddingR = parseFloat(styles.paddingRight);
72
+ var paddingT = parseFloat(styles.paddingTop);
73
+ var paddingB = parseFloat(styles.paddingBottom);
74
+ if (prevPaddingL !== paddingL || prevPaddingR !== paddingR || prevPaddingT !== paddingT || prevPaddingB !== paddingB) {
75
+ hasPaddingChanged = true;
76
+ }
64
77
  }
65
78
  var prevW = props.w;
66
79
  var prevH = props.h;
@@ -75,7 +88,10 @@ var GridItem = function (_a) {
75
88
  h_1 = prevH;
76
89
  }
77
90
  var _b = getResizableXYPosition('e', w_1, h_1, prevW, prevH), newX = _b.newX, newY = _b.newY;
78
- props.onFitToContent && props.onFitToContent(i, w_1, h_1, newX, newY);
91
+ if (prevH === h_1 && prevW === w_1 && newX === x && newY === y) {
92
+ return;
93
+ }
94
+ props.onFitToContent && props.onFitToContent(i, w_1, h_1, newX, newY, { hasPaddingChanged: hasPaddingChanged });
79
95
  }
80
96
  };
81
97
  // MutationObserver 인스턴스 생성
@@ -341,7 +357,7 @@ var GridItem = function (_a) {
341
357
  return;
342
358
  var prevW = props.w, prevH = props.h;
343
359
  // Get new XY
344
- var _b = calcWH(getPositionParams(), size, x, y, handle, prevW, prevH, false), w = _b.w, h = _b.h;
360
+ var _b = calcWH(getPositionParams(), size, x, y, handle, prevW, prevH, true), w = _b.w, h = _b.h;
345
361
  var tempMinH = minH;
346
362
  if (minWidth) {
347
363
  var _c = calcWH(getPositionParams(), __assign(__assign({}, size), { width: minWidth, height: minHeight !== null && minHeight !== void 0 ? minHeight : 0 }), x, y, handle, prevW, prevH, true), minW_1 = _c.w, newMinH = _c.h;
@@ -75,7 +75,9 @@ export type GridItemProps = {
75
75
  onResize?: ResizeGridItemCallback<GridResizeEvent>;
76
76
  onResizeStart?: ResizeGridItemCallback<GridResizeEvent>;
77
77
  onResizeStop?: ResizeGridItemCallback<GridResizeEvent>;
78
- onFitToContent?: (i: string, w: number, h: number, x: number, y: number) => void;
78
+ onFitToContent?: (i: string, w: number, h: number, x: number, y: number, { hasPaddingChanged }: {
79
+ hasPaddingChanged: boolean;
80
+ }) => void;
79
81
  isHiddenVisibility?: boolean;
80
82
  customColWidth?: number;
81
83
  autoResize: boolean;
@@ -255,7 +255,6 @@ var ReactGridLayout = function (_a) {
255
255
  var l = getLayoutItem(layout, i);
256
256
  if (!l)
257
257
  return;
258
- console.log(l);
259
258
  setOldResizeItem(cloneLayoutItem(l));
260
259
  setOldLayout(layout);
261
260
  props.onResizeStart &&
@@ -334,8 +333,9 @@ var ReactGridLayout = function (_a) {
334
333
  setOldLayout(undefined);
335
334
  onLayoutMaybeChanged(newLayout, oldLayout);
336
335
  };
337
- var onFitToContentHandler = function (i, w, h, x, y) {
338
- var _a = withLayoutItem(layout, i, function (l) {
336
+ var onFitToContentHandler = function (i, w, h, x, y, _a) {
337
+ var hasPaddingChanged = _a.hasPaddingChanged;
338
+ var _b = withLayoutItem(layout, i, function (l) {
339
339
  var hasCollisions;
340
340
  if (preventCollision && !allowOverlap) {
341
341
  var collisions = getAllCollisions(layout, __assign(__assign({}, l), { w: x, h: y })).filter(function (layoutItem) { return layoutItem.i !== l.i; });
@@ -363,7 +363,7 @@ var ReactGridLayout = function (_a) {
363
363
  l.minH = h;
364
364
  }
365
365
  return l;
366
- }), newLayout = _a[0], l = _a[1];
366
+ }), newLayout = _b[0], l = _b[1];
367
367
  if (!l)
368
368
  return;
369
369
  props.onFitToContent &&
@@ -371,6 +371,7 @@ var ReactGridLayout = function (_a) {
371
371
  layout: newLayout,
372
372
  prev: oldResizeItem,
373
373
  item: l,
374
+ hasPaddingChanged: hasPaddingChanged
374
375
  });
375
376
  setLayout(allowOverlap ? newLayout : compact(newLayout, compactType, cols));
376
377
  };
@@ -71,7 +71,7 @@ export type ReactGridLayoutProps = {
71
71
  innerRef?: RefObject<HTMLDivElement>;
72
72
  minNbRow?: number;
73
73
  customColWidth?: number;
74
- onFitToContent?: EventCallback;
74
+ onFitToContent?: OnFitContentCallBack;
75
75
  };
76
76
  export type DragOverEvent = MouseEvent & {
77
77
  nativeEvent: {
@@ -79,6 +79,15 @@ export type DragOverEvent = MouseEvent & {
79
79
  layerY: number;
80
80
  } & Event;
81
81
  };
82
+ export type OnFitContentCallBack = (properties: {
83
+ layout: Layout;
84
+ prev?: LayoutItem;
85
+ item?: LayoutItem;
86
+ placeholder?: LayoutItem;
87
+ e?: ResizeEventType;
88
+ node?: HTMLElement;
89
+ hasPaddingChanged: boolean;
90
+ }) => void;
82
91
  export type EventCallback = (properties: {
83
92
  layout: Layout;
84
93
  prev?: LayoutItem;
@@ -53,15 +53,17 @@ var Resizable = function (_a) {
53
53
  var className = props.className, draggableOpts = props.draggableOpts, width = props.width, height = props.height, handle = props.handle, onResize = props.onResize, onResizeStop = props.onResizeStop, onResizeStart = props.onResizeStart, restProps = __rest(props, ["className", "draggableOpts", "width", "height", "handle", "onResize", "onResizeStop", "onResizeStart"]);
54
54
  var elementRef = children.ref;
55
55
  var extendedHeightRef = useRef(null);
56
+ var shouldShrinkRef = useRef(false);
56
57
  var minWidth = useRef(0);
57
58
  useEffect(function () {
58
- var _a;
59
+ var _a, _b;
59
60
  if (!autoResize) {
60
61
  return;
61
62
  }
62
63
  if (!isResizing) {
63
64
  extendedHeightRef.current = null;
64
65
  minWidth.current = 0;
66
+ shouldShrinkRef.current = false;
65
67
  return;
66
68
  }
67
69
  if (!elementRef.current) {
@@ -74,10 +76,16 @@ var Resizable = function (_a) {
74
76
  var target = (_a = placeholder.children[0].children[0].children[0]) !== null && _a !== void 0 ? _a : placeholder.children[0].children[0];
75
77
  if (target.clientHeight > elementRef.current.clientHeight) {
76
78
  extendedHeightRef.current = target.clientHeight;
79
+ shouldShrinkRef.current = true;
77
80
  }
78
81
  else {
79
82
  extendedHeightRef.current = null;
80
83
  }
84
+ console.log('startHeight', (_b = startSize.current) === null || _b === void 0 ? void 0 : _b.height);
85
+ console.log('height', height);
86
+ if (shouldShrinkRef.current && (target.clientHeight < elementRef.current.clientHeight)) {
87
+ extendedHeightRef.current = target.clientHeight;
88
+ }
81
89
  var minWidthStyle = target.computedStyleMap().get('min-width');
82
90
  if (typeof minWidthStyle.value === 'number') {
83
91
  minWidth.current = minWidthStyle.value;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "publ-echo-test",
3
- "version": "0.0.34",
3
+ "version": "0.0.36",
4
4
  "private": false,
5
5
  "main": "dist/lib/index.js",
6
6
  "types": "dist/lib/index.d.js",